【百度地圖API】手機瀏覽器抓包工具及其使用方法

時間 2019-11-19

標籤百度地圖API 手機瀏覽器抓包工具及其使用方法欄目瀏覽器简体版

原文原文鏈接

原文: 【百度地圖API】手機瀏覽器抓包工具及其使用方法

摘要：爲了測試地圖API在手機瀏覽器上的性能，須要給手機瀏覽器設置代理。經過代理，咱們能夠在PC上獲取到抓包數據。進而對性能作進一步分析。javascript

------------------------------------------------------css

1、手機瀏覽器抓包工具html

Paros 3.2.13java

2、如何配置git

一、將電腦和手機連到同一個wifi環境中canvas

二、找到電腦的IPapi

能夠點擊網卡圖標，找到IP信息瀏覽器

也能夠在cmd下，使用ipconfigide

三、打開Paros，點擊Tools->Options工具

四、將電腦的IP填入，必須是本機的實時IP哦。不能是127.0.0.1.

五、將手機wifi的代理也填成電腦的IP。

3、完成！

這時代理就作好了。你只須要在手機上打開瀏覽器，Paros就開始抓包啦。

百度地圖API定位示例抓包：

谷歌地圖API定位示例抓包：

所有源代碼：

百度定位示例

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>瀏覽器定位</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
</head>
<style>
body,html,#container{height:100%;width:100%;padding:0;margin:0;}
</style>
<body>
<div id="container"></div>
</body>
</html>
<script type="text/javascript">
var map = new BMap.Map("container");            // 建立Map實例
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);

var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
    if(this.getStatus() == BMAP_STATUS_SUCCESS){
        var mk = new BMap.Marker(r.point);
        map.addOverlay(mk);
        map.panTo(r.point);
        alert('您的位置：'+r.point.lng+','+r.point.lat);
    }
    else {
        alert('failed'+this.getStatus());
    }        
})
</script>

谷歌定位示例

<!DOCTYPE html>
<html DIR="LTR">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Google Maps JavaScript API v3 示例：地圖地理位置</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://code.google.com/apis/gears/gears_init.js"></script>
<script type="text/javascript">

var initialLocation;
var siberia = new google.maps.LatLng(60, 105);
var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687);
var browserSupportFlag =new Boolean();
var map;
var infowindow = new google.maps.InfoWindow();
  
function initialize() {
  var myOptions = {
    zoom: 6,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  
  // Try W3C Geolocation method (Preferred)
if(navigator.geolocation) {
    browserSupportFlag = true;
    navigator.geolocation.getCurrentPosition(function(position) {
      initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
      contentString = "Location found using W3C standard";
      map.setCenter(initialLocation);
      infowindow.setContent(contentString);
      infowindow.setPosition(initialLocation);
      infowindow.open(map);
    }, function() {
      handleNoGeolocation(browserSupportFlag);
    });
  } else if (google.gears) {
    // Try Google Gears Geolocation
    browserSupportFlag = true;
    var geo = google.gears.factory.create('beta.geolocation');
    geo.getCurrentPosition(function(position) {
      initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
      contentString = "Location found using Google Gears";
      map.setCenter(initialLocation);
      infowindow.setContent(contentString);
      infowindow.setPosition(initialLocation);
      infowindow.open(map);
    }, function() {
      handleNoGeolocation(browserSupportFlag);
    });
  } else {
    // Browser doesn't support Geolocation
    browserSupportFlag = false;
    handleNoGeolocation(browserSupportFlag);
  }
}

function handleNoGeolocation(errorFlag) {
  if (errorFlag == true) {
    initialLocation = newyork;
    contentString = "Error: The Geolocation service failed.";
  } else {
    initialLocation = siberia;
    contentString = "Error: Your browser doesn't support geolocation. Are you in Siberia?";
  }
  map.setCenter(initialLocation);
  infowindow.setContent(contentString);
  infowindow.setPosition(initialLocation);
  infowindow.open(map);
}
</script>
<style>
body,html,#map_canvas{height:100%;width:100%;padding:0;margin:0;}
</style>
</head>
<body onload="initialize()">
  <div id="map_canvas"></div>
</body>
</html>