微信小程序位置授权处理方法


Posted in Javascript onJune 13, 2019

这两天在做小程序调取地图的时候遇到一个问题,如果用户第一次拒绝了位置权限请求。那么就不会再次唤起授权弹出。需要我们引导用户去开启。

具体做法如下。 在 aap.json中加入授权配置

"permission": {
 "scope.userLocation": {
  "desc": "你的位置信息将用于小程序位置接口的效果展示"
 }
 }

在 page页面中使用,需要有几个注意的地方,初次使用的时候,去申请权限。这里我是放在onShow 方法里面。

onShow: function () {
 //初始获取定位权限
 wx.authorize({
  scope: 'scope.userLocation',
  success: (res) => {

  },
 })
 },

然后在调用地图地位。或者获取用户权限的函数去判断是否有定位权限,如果没有那么引导用户开启权限。 如下:我有一个Input去触发选择地图事件。

<input bindfocus="openMap" value='{{address}}' placeholder="点击选择详细地址"></input>

事件处理

openMap:function(e){
 var that = this
 wx.getSetting({
  success(res){
  //这里判断是否有地位权限
   if (!res.authSetting['scope.userLocation']) {
   wx.showModal({
    title: '提示',
    content: '请求获取位置权限',
    success:function(res){
    if(res.confirm==false){
     return false;
    }
    wx.openSetting({
     success(res) {
     //如果再次拒绝则返回页面并提示
     if (!res.authSetting['scope.userLocation']) {
      wx.showToast({
      title: '此功能需获取位置信息,请重新设置',
      duration: 3000,
      icon: 'none'
      })
     } else {
      //允许授权,调用地图
      that.chooseMap()
     }
     }
    })
    }
   }) 
   } else {
   //如果有定位权限,调用地图
   that.chooseMap()
   }

  }

 })
 },

 chooseMap(){
 var that = this
 wx.chooseLocation({
  success: function (res) {
  that.setData({
   address: res.address,
   latitude: res.latitude,
   longitude: res.longitude
  })
  },
  fail: function (res) {
  console.log(res)
  }
 })
 },

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
jquery查找父元素、子元素(个人经验总结)
Apr 09 Javascript
JS实现带缓冲效果打开、关闭、移动一个层的方法
May 09 Javascript
基于Jquery实现万圣节快乐特效
Nov 01 Javascript
详解AngularJS中$http缓存以及处理多个$http请求的方法
Feb 06 Javascript
bootstrap的工具提示实例代码
May 17 Javascript
JS操作时间 - UNIX时间戳的简单介绍(必看篇)
Aug 16 Javascript
深入浅析ES6 Class 中的 super 关键字
Oct 20 Javascript
babel的使用及安装配置教程
Feb 22 Javascript
详解Vue项目引入CreateJS的方法(亲测可用)
May 30 Javascript
使用layer弹窗提交表单时判断表单是否输入为空的例子
Sep 26 Javascript
vue 获取元素额外生成的data-v-xxx操作
Sep 09 Javascript
如何使用vue3打造一个物料库
May 08 Vue.js
json数据格式常见操作示例
Jun 13 #Javascript
微信小程序实现渐入渐出动画效果
Jun 13 #Javascript
微信小程序前端自定义分享的实现方法
Jun 13 #Javascript
javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】
Jun 13 #Javascript
javascript实现的字符串转换成数组操作示例
Jun 13 #Javascript
javascript实现的时间格式加8小时功能示例
Jun 13 #Javascript
深入了解JavaScript代码覆盖
Jun 13 #Javascript
You might like
PHP新手上路(十一)
2006/10/09 PHP
PHP __call()方法实现委托示例
2019/05/20 PHP
document.getElementById的简写方式(获取id对象的简略写法)
2010/09/10 Javascript
基于jQuery的遍历同id元素 并响应事件的代码
2012/06/14 Javascript
JavaScript中检测变量是否存在遇到的一些问题
2013/11/11 Javascript
我的Node.js学习之路(四)--单元测试
2014/07/06 Javascript
js实现按一下删除键删除整个单词附demo
2014/09/05 Javascript
浅析Node.js 中 Stream API 的使用
2015/10/23 Javascript
原生JS封装Ajax插件(同域、jsonp跨域)
2016/05/03 Javascript
微信小程序 action-sheet底部菜单详解
2016/10/27 Javascript
通过bootstrap全面学习less
2016/11/09 Javascript
js编写三级联动简单案例
2016/12/21 Javascript
Angularjs自定义指令实现三级联动 选择地理位置
2017/02/13 Javascript
如何重置vue打印变量的显示方式
2017/12/06 Javascript
对vux点击事件的优化详解
2018/08/28 Javascript
Vue.js 事件修饰符的使用教程
2018/11/01 Javascript
vue实现分页组件
2020/06/16 Javascript
详解Python字符串对象的实现
2015/12/24 Python
Scrapy爬虫实例讲解_校花网
2017/10/23 Python
使用python 爬虫抓站的一些技巧总结
2018/01/10 Python
Python实现PS滤镜的万花筒效果示例
2018/01/23 Python
Python实现的用户登录系统功能示例
2018/02/05 Python
使用python判断你是青少年还是老年人
2018/11/29 Python
Python TCP通信客户端服务端代码实例
2019/11/21 Python
Python错误的处理方法
2020/06/23 Python
小程序canvas中文字设置居中锚点
2019/04/16 HTML / CSS
美国休闲服装品牌:Express
2016/09/24 全球购物
交通法规咨询中心工作职责
2013/11/27 职场文书
2013的个人自我评价
2013/12/26 职场文书
军训自我鉴定
2014/01/22 职场文书
环保倡议书格式范文
2014/05/14 职场文书
青年文明号口号
2014/06/17 职场文书
2014党支部对照检查材料思想汇报
2014/10/05 职场文书
2015秋季幼儿园开学寄语
2015/03/25 职场文书
Python趣味挑战之用pygame实现简单的金币旋转效果
2021/05/31 Python
深入解读Java三大集合之map list set的用法
2021/11/11 Java/Android