1. 程式人生 > >跨域請求(使用jsonp實現跨域請求)百度地圖api證逆地址解析獲取周邊資訊(pois)

跨域請求(使用jsonp實現跨域請求)百度地圖api證逆地址解析獲取周邊資訊(pois)

新手程式設計師,新手部落格,如果那裡寫的不好,還請大神們補充,指錯
最近專案裡面需要做一個電子圍欄的功能,我這邊做的就是需要把商戶的地址的經緯度存進資料庫,本來這些從百度地圖API裡面有Demo可以看,但是我是訪問的百度地圖的可以獲取經緯度以及根據經緯度進行周邊檢索的地址,因為我是內網,所以我是用的jsonp跨域請求,如果你的環境可以直接訪問外網,就用原生的AJAX請求那兩個地址就可以,然後對獲取到的結果做處理
http://lbsyun.baidu.com/jsdemo.htm#a1_2這個地址是百度地圖API

//根據輸入地址獲取周邊建築

function searchAddressList(){
var lat='';
var lng='';
var address= $J.getbyName("shopAttr").getValue();

 $.ajax({

//根據輸入的地址進行地址解析(解析出來輸入的地址的經緯度)

           url: 'http://api.map.baidu.com/geocoder/v2/?address=北京市海淀區上地十街10號&output=json&ak=您的ak',
           type: 'GET',
           async:false,//設定同步。ajax預設非同步
           dataType: 'jsonp',
           jsonp:'callback',//傳遞給請求處理程式或頁面的,用以獲得jsonp回撥函式名的引數名(預設為:callback)
           jsonpCallback:"callback",//自定義的jsonp回撥函式名稱,預設為jQuery自動生成的隨機函式名
           timeout: 5000,
           contentType: 'application/json; charset=utf-8',
           success: function (result) {
           if(result.result.location.lat!=null&&result.result.location.lat!="" && result.result.location.lng!=null&& result.result.location.lng!=""){
              lat=result.result.location.lat;
              lng=result.result.location.lng;
           }else{
          $J.alert("獲取不到該地址的經緯度,請輸入準確的省市區街道!");
          return;
       }

              $.ajax({

//解析出來輸入的地址的經緯度在做周邊pois查詢(百度地圖逆地址解析)

           url: 'http://api.map.baidu.com/geocoder/v2/?callback=renderReverse&location=39.934,116.329&output=json&pois=1',
           type: 'GET',
           async:false,
           dataType: 'jsonp',
           jsonp:'callback',//傳遞給請求處理程式或頁面的,用以獲得jsonp回撥函式名的引數名(預設為:callback)
           jsonpCallback:"callback",//自定義的jsonp回撥函式名稱,預設為jQuery自動生成的隨機函式名
           timeout: 5000,
           contentType: 'application/json; charset=utf-8',
           success: function (result) {
           if(result.result.pois.length!=0){
           for(var i=0;i<result.result.pois.length;++i){
           result.result.pois[i].text =result.result.pois[i].name;
           result.result.pois[i].id =result.result.pois[i].name;
              }
               $J.getbyName("buildingName").setData(result.result.pois);
               $J.getbyName("buildingName").setValue(result.result.pois[0].id);
               $J.getbyName("specificAddress").setValue(result.result.pois[0].addr);
$J.getbyName("xy").setValue(result.result.pois[0].point.x+","+result.result.pois[0].point.y);
        }else{
          $J.alert("無周邊相關資訊!請輸入準確的省市區街道資訊!");
        }
    },
      });
   }
  });

}