悬赏【150元人民币】 解决一个JS的小问题:修改一个http请求的信息

musiclov 2017-10-19 02:36:19
问题在这里:

http://bbs.csdn.net/topics/392273885

问题对高手来说不难,要求用JS解决这个问题,或者能让用户不安装插件就能使用也可以。

有意者私信我,问题解决后支付宝或微信支付都可以,坛友可监督支付情况。
...全文
314 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
abcd_ufo 2017-10-20
  • 打赏
  • 举报
回复
Google 地图的资源都是通过 js 渲染到页面中的吧 ? 可以用下面这个方案处理下

var container;

(function () {
    debugger;
    document.body.innerHTML = '<div id="container"></div>';
    container = document.getElementById('container');
})();


(function() {
    container.addEventListener("DOMNodeInserted", function(e) {
        e = e || event;
        var target = e.target;
        if (target && e.target.src) {
            if (target.src.indexOf("https://ss1.baidu.com") >= 0) {
                target.src = target.src.replace(
                    "https://ss1.baidu.com",
                    "https://ss0.baidu.com"
                );
            }
        }
    });
})();

(function() {
    debugger;
    container.innerHTML =
        '<img src="https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=1258876876,645640263&fm=173&s=97A088AA44CB34E84E31C8B303005005&w=218&h=146&img.JPEG"/><br/><img src="https://ss1.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=1963492293,1129115862&fm=173&s=FD814B9ECED919CC6ABA2BB30300E01E&w=218&h=146&img.JPEG"/>';
})();
在线地址: https://codepen.io/raisezhang/pen/BwboYP
musiclov 2017-10-20
  • 打赏
  • 举报
回复
代码如下,可参看我代码里面我的注释。
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Directions service</title>
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
	  #panel {
	    position: absolute;
        width:300px;
		height:800px;
		right:10px;
		top:10px;
		border: solid 2px blue;
        background:white;

      }
	  #panel1 {
	    position: absolute;
        width:300px;
		height:800px;
		left:10px;
		top:10px;
		border: solid 2px blue;
        background:white;

      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
      #floating-panel {
        position: absolute;
        top: 10px;
        left: 25%;
        z-index: 5;
        background-color: #fff;
        padding: 5px;
        border: 1px solid #999;
        text-align: center;
        font-family: 'Roboto','sans-serif';
        line-height: 30px;
        padding-left: 10px;
      }
    </style>

  </head>
  <body>
    <div id="floating-panel">
    <b>Start: </b>
    <select id="start">
      <option value="chicago, il">Chicago</option>
      <option value="st louis, mo">St Louis</option>
      <option value="joplin, mo">Joplin, MO</option>
      <option value="oklahoma city, ok">Oklahoma City</option>
      <option value="amarillo, tx">Amarillo</option>
      <option value="gallup, nm">Gallup, NM</option>
      <option value="flagstaff, az">Flagstaff, AZ</option>
      <option value="winona, az">Winona</option>
      <option value="kingman, az">Kingman</option>
      <option value="barstow, ca">Barstow</option>
      <option value="san bernardino, ca">San Bernardino</option>
      <option value="los angeles, ca">Los Angeles</option>
    </select>
    <b>End: </b>
    <select id="end">
      <option value="chicago, il">Chicago</option>
      <option value="st louis, mo">St Louis</option>
      <option value="joplin, mo">Joplin, MO</option>
      <option value="oklahoma city, ok">Oklahoma City</option>
      <option value="amarillo, tx">Amarillo</option>
      <option value="gallup, nm">Gallup, NM</option>
      <option value="flagstaff, az">Flagstaff, AZ</option>
      <option value="winona, az">Winona</option>
      <option value="kingman, az">Kingman</option>
      <option value="barstow, ca">Barstow</option>
      <option value="san bernardino, ca">San Bernardino</option>
      <option value="los angeles, ca">Los Angeles</option>
    </select>
	<button id="btn">C</button>
    </div>
    <div id="map"> 
	</div>
	<div id="panel"></div>	
    <script>	  
	  var directionsService;
	   var map;
      function initMap() {	  	  
         directionsService = new google.maps.DirectionsService;
        	
        map = new google.maps.Map(document.getElementById('map'), {
          zoom: 7,
          center: {lat: 41.85, lng: -87.65}
        });        
		calculateAndDisplayRoute();
      }	  

      function calculateAndDisplayRoute() {
	  
	  var r={
          //origin: document.getElementById('start').value,
          //destination: document.getElementById('end').value,
		  origin: '1 Austin Terrace at Spadina Ave, Toronto, Ontario M5R 1X8, Canada',
          destination: '108 Chestnut Street, Toronto, Ontario, M5G1R3, Canada',
          travelMode: 'TRANSIT'
        };
		r.provideRouteAlternatives=true;
		
        directionsService.route(r, function(response, status) {
          if (status === 'OK') {

		console.log(response);
		console.log(response.routes.length);		

		var directionsDisplay= new google.maps.DirectionsRenderer;
		directionsDisplay.setMap(map);
		directionsDisplay.setDirections(response);

		//上面这句会加载三个.com的图标资源:
		//http://mt.googleapis.com/maps/vt/icon/name=icons/spotlight/spotlight-waypoint-a.png&text=A&psize=16&font=fonts/Roboto-Regular.ttf&color=ff333333&ax=44&ay=48&scale=1
        //http://mt.google.cn/maps/vt/icon/name=icons/spotlight/spotlight-waypoint-a.png&text=A&psize=16&font=fonts/Roboto-Regular.ttf&color=ff333333&ax=44&ay=48&scale=1
        //http://maps.gstatic.com/mapfiles/transit/iw2/6/bus2.png
		//这几个图标加载不了,只需mt.googleapis.com 改成  mt.google.cn,maps.gstatic.com 改成 maps.gstatic.cn 就能正常显示。问题是怎么改,这三个图标资源
		//不是img要素,是json里面的icon,改API应该不可能,唯一的解决方案可能是截获页面的http请求,改图标的url。
		
		directionsDisplay.setPanel(document.getElementById('panel'));
		
		
		  } else {
            window.alert('Directions request failed due to ' + status);
          }
        });		
      }
    </script>
	
	<script async defer
    src="http://ditu.google.cn/maps/api/js?region=cn&language=zh-CN&callback=initMap">
    </script>
	

	
  </body>
</html>
似梦飞花 2017-10-19
  • 打赏
  • 举报
回复

Object.defineProperty(HTMLImageElement.prototype,'src',{
            set(value){
                alert(value)
            }
        });
你先把这段代码加到你代码的最开始位置 看能监听到所有的img的src赋值吗

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧