vue中调用微信sdk获取地理位置

vue中调用微信sdk获取地理位置 最后通过百度地图查出详细地址
首先需要申请百度地图key
在index.html中引入

第一 npm install weixin-js-sdk --save //在项目中安装
第二 在使用的页面引入 import wx from 'weixin-js-sdk'（可在main.js全局引入）
第三

//需要注意的是微信sdk获取地理位置和百度获取地理位置是已不同规范获取的 需要将微信sdk获取的经纬度转为百度地图的经纬度，不然会有偏差。这里可以使用gcoord .js转换（npm install gcoord --save）
 //获取JS-SDK的页面必须先注入的配置信息(在mounted调用getJSSDKs方法)

    getJSSDKs(){
      let data={
        url:location.href.split('#')[0]
      }
      getJSSDK(data).then(res=>{//后台接口，返回给前端签名啥的一些配置参数  必须！！
        let _this=this
          wx.config({
            // debug: true, 调试用到
            appId: res.appId, //必须参数（后台获取）
            timestamp: res.timestamp, //必须参数（后台获取）
            nonceStr: res.nonceStr, //必须参数（后台获取）
            signature: res.signature,//必须参数（后台获取）
            jsApiList: [
              'getLocation',//必须  你要用到的api 必须在这里写，这里我只用到了获取地理位置的api
            ] 
          });
          wx.ready(function(){
            _this.getbylocation()
          })
      })
    },
//！
//！
getbylocation(){
      let _this=this
      wx.getLocation({
        type: 'wgs84',
        isHighAccuracy:true,
        success: function (res){
          let [longitude, latitude] = gcoord.transform(//转换经纬度（npm install gcoord --save）上面有说
                        [ res.longitude, res.latitude ], // 经纬度坐标
                        gcoord.WGS84, // 当前坐标系
                        gcoord.BD09 // 目标坐标系
          );
          console.log('精度',longitude)
          console.log('纬度',latitude)
          _this.latitude =latitude
          _this.longitude =longitude
          let point = new BMap.Point(longitude,latitude)
          let gc = new BMap.Geocoder()
          gc.getLocation(point, function(rs){
            console.log(rs)
            // _this.location.address=rs.address
            _this.location=rs.addressComponents
            _this.location.creditProvince=rs.addressComponents.province
             _this.location.creditCity=rs.addressComponents.city
             _this.location.creditArea=rs.addressComponents.district
             _this.location.creditStreet=rs.addressComponents.streetw
             _this.location.streetNumber=rs.addressComponents.streetNumber
             console.log('相差km数',_this.getDistance(_this.latitude,_this.longitude,_this.obj.y,_this.obj.x))
            //_this.obj.x,_this.obj.y分别是调后台接口返回的目标打卡点的经纬度，_this.obj.targetrange是后台返回的打卡范围为多少km
             if(_this.getDistance(_this.latitude,_this.longitude,_this.obj.y,_this.obj.x)>=_this.obj.targetrange/1000){
               _this.message='不在打卡范围'
               _this.status=false

             }else{
               _this.message='你已在打卡范围内'
               _this.status=true
             }
          })
        },
        fail: function (err){
          _this.$toast(err)
        }
      })
    },
//
//
//
 getDistance( lat1,  lng1,  lat2,  lng2){//比较两个不同经纬度之间的距离
    var radLat1 = lat1*Math.PI / 180.0;
    var radLat2 = lat2*Math.PI / 180.0;
    var a = radLat1 - radLat2;
    var  b = lng1*Math.PI / 180.0 - lng2*Math.PI / 180.0;
    var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a/2),2) +
    Math.cos(radLat1)*Math.cos(radLat2)*Math.pow(Math.sin(b/2),2)));
    s = s *6378.137 ;// EARTH_RADIUS;
    s = Math.round(s * 10000) / 10000;
    return s;//km
},