小程序定位

一、小程序定位

需要用到腾讯位置服务官网–>微信小程序JavaScript SDK(用来获取当前地址信息)
https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview
微信小程序官网
https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html

1.使用步骤

代码如下(示例):

  1. 申请开发者密钥(key) 申请密钥
  2. 下载微信小程序JavaScriptSDK JavaScriptSDK v1.2(下载下来将qqmap-wx-jssdk.min.js放到自己合适的目录下,我一般放在utils⬇️)
  3. 安全域名设置,在小程序管理后台 -> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置request合法域名,添加https://apis.map.qq.com
  4. 引入SDK核心类
  //index.js
  var QQMapWX = require('../util/qqmap-wx-jssdk.min.js')
  var qqmapsdk;//需要声明qqmapsdk
  onLoad: function (options) {
    qqmapsdk = new QQMapWX({
        key: "自己的key秘钥 ", //最开始申请的密钥key
      });
    this.getUserLocation();//调用获取位置信息授权
  },
  getUserLocation(){
   let vm = this;
  	//获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。
	wx.getSetting({
	  success (res) {
	      //res.authSetting用户授权结果 
	      // res.authSetting['scope.userLocation'] == undefined    表示 初始化进入该页面
          // res.authSetting['scope.userLocation'] == false    表示 非初始化进入该页面,且未授权
          // res.authSetting['scope.userLocation'] == true    表示 地理位置授权
          if (res.authSetting["scope.userLocation"] != undefined && res.authSetting["scope.userLocation"] != true){
			//对话框提示
			wx.showModal({
			  title: "请求授权当前位置",//提示标题
              content: "需要获取您的地理位置,请确认授权",//提示内容
              success(res){
               //取消
			  	if(res.cancel){
				  wx.showToast({
                    title: "用户拒绝授权",
                    icon: "none",
                    duration: 1000,
                  });	
                  //确定
				}else if(res.confirm){
				  // 调起客户端小程序设置界面,返回用户设置的操作结果
				  wx.openSetting({
				  	success(openset){
					 //authSetting用户授权结果
						if(openset.authSetting["scope.userLocation"] == true){
						      //显示消息提示框
							  wx.showToast({
		                          title: "授权成功",
		                          icon: "success",
		                          duration: 1000,
		                      });
		                       //再次授权,调用wx.getLocation的API
		                       vm.getLocation();
							 }else{
							   wx.showToast({
		                          title: "授权失败",
		                          icon: "none",
		                          duration: 1000,
		                     });
						 }
					  }
				  })
				}
			  }
		   })	
		} else if (res.authSetting["scope.userLocation"] == undefined){
		    //调用wx.getLocation的API
            vm.getLocation();
		}else{
			//调用wx.getLocation的API
            vm.getLocation();
		}
	  }
	})	
  }


  // 微信获得经纬度、当前的地理位置、速度
    getLocation: function () {
      let vm = this;
      wx.getLocation({
        type: "wgs84", //返回 gps 坐标
        success: function (res) {
          var latitude = res.latitude;
          var longitude = res.longitude;
          var speed = res.speed;
          var accuracy = res.accuracy;
          vm.getLocal(latitude, longitude);
        },
        fail: function (res) {
          console.log("fail" + JSON.stringify(res));
        },
      });
    },
   // 获取当前地理位置
   getLocal(latitude, longitude){
   	//提供由坐标到坐标所在位置的文字描述的转换,输入坐标返回地理位置信息和附近poi列表
	 qqmapsdk.reverseGeocoder({
		 location: {
	        latitude: latitude,
	        longitude: longitude,
        },
        success: function (res) {
          let province = res.result.ad_info.province;
          let city = res.result.ad_info.city;
          vm.setData({
            "statusList[2].text": city,
          });
        },
	 })
   }

总结

仅记录自己的七秒记忆📝

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值