微信小程序用户位置权限的获取方法(拒绝后提醒)


Posted in Javascript onNovember 15, 2018

微信小程序获取用户当前位置有三个方式:

1. wx.getLocation(多与wx.openLocation一起用)

获取当前的精度、纬度、速度。不需要授权。当type设置为gcj02 返回可用于wx.openLocation的坐标

2. wx.chooseLocation

需要授权,打开地图选择位置

第一次调用方法时先出现

微信小程序用户位置权限的获取方法(拒绝后提醒)

允许权限之后之后再出现

微信小程序用户位置权限的获取方法(拒绝后提醒)

如果第一次就不允许,则一直调用wx.chooseLocation的fail方法

3. wx.openLocation

需要授权,使用微信内置地图查看位置。多半用于查看起点到终点的路线怎么走

微信小程序用户位置权限的获取方法(拒绝后提醒)

授权方法有三种:

1. wx.getSetting

获取用户的当前设置,返回值中只会出现小程序已经向用户请求过的权限,类似下面的样子

微信小程序用户位置权限的获取方法(拒绝后提醒)

2. wx.openSetting

调起权限设置选择界面,设置界面只会出现小程序已经向用户请求过的权限,类似下面的样子

微信小程序用户位置权限的获取方法(拒绝后提醒)

3. wx.authorize

提前向用户发起授权请求。调用后会立刻弹窗询问用户是否同意授权小程序使用某项功能或获取用户的某些数据,但不会实际调用对应接口。如果用户之前已经同意授权,则不会出现弹窗,直接返回成功。,类似下面的样子

微信小程序用户位置权限的获取方法(拒绝后提醒)

这就是wx.authorize出现的内容

问题来了:假如我第一次使用wx.chooseLocation()获取权限被拒绝,然后使用wx.getSetting()来重新获取权限该怎么做呢?

思路:wx.chooseLocation()有fail方法,如果第一次拒绝之后,以后调用选择地图都是触发的这个,那么我可以在fail方法里面,使用wx.getSetting(),这样就每次都能判断是否已经给与了权限了。

第一步:由于有可能会多次使用定位的方法,所以我把定位的方法写到App.js中,方便调用

App({
 //获取用户地理位置权限
 getPermission:function(obj){
  wx.chooseLocation({
  success: function (res) { 
   obj.setData({
    addr: res.address  //调用成功直接设置地址
   })    
  },
  fail:function(){
   wx.getSetting({
    success: function (res) {
     var statu = res.authSetting;
     if (!statu['scope.userLocation']) {
      wx.showModal({
       title: '是否授权当前位置',
       content: '需要获取您的地理位置,请确认授权,否则地图功能将无法使用',
       success: function (tip) {
        if (tip.confirm) {
         wx.openSetting({
          success: function (data) {
           if (data.authSetting["scope.userLocation"] === true) {
            wx.showToast({
             title: '授权成功',
             icon: 'success',
             duration: 1000
            })
            //授权成功之后,再调用chooseLocation选择地方
            wx.chooseLocation({
             success: function(res) {
              obj.setData({
               addr: res.address
              })
             },
            })
           } else {
            wx.showToast({
             title: '授权失败',
             icon: 'success',
             duration: 1000
            })
           }
          }
         })
        }
       }
      })
     }
    },
    fail: function (res) {
     wx.showToast({
      title: '调用授权窗口失败',
      icon: 'success',
      duration: 1000
     })
    }
   })
  }
 })  
 },
})

第二步:在需要获取地址的页面中:

var app = getApp();
Page({
 data:{
  addr:'请选择位置'   
 },
 //选择获取地理位置
 getAddress:function(){
   var that=this;
  app.getPermission(that); //传入that值可以在app.js页面直接设置内容 
 }, 
})

最终效果图:

微信小程序用户位置权限的获取方法(拒绝后提醒)

最终在手机上获取到的位置偏差不太大。

--------------------------------------------------------------------------------

更新 wx.openSetting 的注意事项。

2.3.0 版本开始,用户发生点击行为后,才可以跳转打开设置页,管理授权信息

即2.3.0版本之后,我通过上面的wx.showModal的回调函数来调用wx.openSetting 会发生下面的错误:

openSetting:fail can only be invoked by user TAP gesture.

但是我测试 2.2.4 开始 到2.3.1 都会出现上面这种错误。

2.3.2及以上又不会出现这种问题。。。。。。。。

而且当我测试2.0.8 到 2.2.3 会出现下面的错误。。。。。。

微信小程序用户位置权限的获取方法(拒绝后提醒)

其它的就没有这问题了。搞不懂。。。

总结

以上所述是小编给大家介绍的微信小程序用户位置权限的获取方法(拒绝后提醒),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript实现的基于金山词霸网络翻译的代码
Jan 15 Javascript
Javascript中克隆一个数组的实现代码
Dec 06 Javascript
常常会用到的截取字符串substr()、substring()、slice()方法详解
Dec 16 Javascript
浅谈json取值(对象和数组)
Jun 24 Javascript
基于JS实现横线提示输入验证码随验证码输入消失(js验证码的实现)
Oct 27 Javascript
react-router实现按需加载
May 09 Javascript
详解JavaScript按概率随机生成事件
Aug 02 Javascript
axios异步提交表单数据的几种方法
Aug 11 Javascript
electron实现静默打印的示例代码
Aug 12 Javascript
layui 实现二级弹窗弹出之后 关闭一级弹窗的方法
Sep 18 Javascript
vue解决花括号数据绑定不成功的问题
Oct 30 Javascript
Servlet返回的数据js解析2种方法
Dec 12 Javascript
判断iOS、Android以及PC端的示例代码
Nov 15 #Javascript
IE8中jQuery.load()加载页面不显示的原因
Nov 15 #jQuery
详解ES6 Fetch API HTTP请求实用指南
Nov 14 #Javascript
微信小程序购物车、父子组件传值及calc的注意事项总结
Nov 14 #Javascript
微信小程序中遇到的iOS兼容性问题小结
Nov 14 #Javascript
javascript中一些奇葩的日期换算方法总结
Nov 14 #Javascript
element vue Array数组和Map对象的添加与删除操作
Nov 14 #Javascript
You might like
mysql 性能的检查和优化方法
2009/06/21 PHP
php实现执行某一操作时弹出确认、取消对话框
2013/12/30 PHP
php操作xml入门之xml基本介绍及xml标签元素
2015/01/23 PHP
php读取txt文件并将数据插入到数据库
2016/02/23 PHP
Yii框架结合sphinx,Ajax实现搜索分页功能示例
2016/10/18 PHP
laravel 中如何使用ajax和vue总结
2017/08/16 PHP
JS将制定内容复制到剪切板示例代码
2014/02/11 Javascript
再谈javascript注入 黑客必备!
2016/09/14 Javascript
jQuery日程管理控件glDatePicker用法详解
2017/03/29 jQuery
实现微信小程序的wxml文件和wxss文件在webstrom的支持
2017/06/12 Javascript
基于JavaScript实现图片连播和联级菜单实例代码
2017/07/28 Javascript
详解Node.js利用node-git-server快速搭建git服务器
2017/09/27 Javascript
详解React中传入组件的props改变时更新组件的几种实现方法
2018/09/13 Javascript
jQuery点击页面其他部分隐藏下拉菜单功能
2018/11/27 jQuery
其实你可以少写点if else与switch(推荐)
2019/01/10 Javascript
[01:02]DOTA2上海特锦赛SHOWOPEN
2016/03/25 DOTA
[49:17]DOTA2-DPC中国联赛 正赛 Phoenix vs Dynasty BO3 第三场 1月26日
2021/03/11 DOTA
python实现随机密码字典生成器示例
2014/04/09 Python
怎么使用pipenv管理你的python项目
2018/03/12 Python
详解Python3注释知识点
2019/02/19 Python
numpy 矩阵形状调整:拉伸、变成一位数组的实例
2020/06/18 Python
css3个性化字体_动力节点Java学院整理
2017/07/12 HTML / CSS
英国领先的高街书籍专家:Waterstones
2018/02/01 全球购物
优质美利奴羊毛袜,不只是徒步旅行:Darn Tough Vermont
2018/11/05 全球购物
法国低价在线宠物商店:bitiba.fr
2020/07/03 全球购物
澳大利亚最受欢迎的超级商场每日优惠:Catch
2020/11/17 全球购物
工商管理专业学生的自我评价
2013/10/01 职场文书
医药代表个人求职信范本
2013/12/19 职场文书
优秀共产党员演讲稿
2014/09/04 职场文书
2014年后勤工作总结
2014/11/18 职场文书
公积金贷款承诺书
2015/04/30 职场文书
悬崖上的金鱼姬观后感
2015/06/15 职场文书
运动会班级前导词
2015/07/20 职场文书
高中语文教材(文学文化常识大全一)
2019/08/13 职场文书
前端实现滑动按钮AJAX与后端交互的示例代码
2022/02/24 Javascript
实现GO语言对数组切片去重
2022/04/20 Golang