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


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 相关文章推荐
jQuery代码优化 选择符篇
Nov 01 Javascript
JS取request值以及自动执行使用示例
Feb 24 Javascript
js定时调用方法成功后并停止调用示例
Apr 08 Javascript
JavaScript中的toDateString()方法使用详解
Jun 12 Javascript
Prototype框架详解
Nov 25 Javascript
jQuery中select与datalist制作下拉菜单时的区别浅析
Dec 30 Javascript
微信小程序 用户数据解密详细介绍
Jan 09 Javascript
老生常谈ES6中的类
Jul 31 Javascript
JavaScript面向对象精要(下部)
Sep 12 Javascript
怎样使你的 JavaScript 代码简单易读(推荐)
Apr 16 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
Jan 26 Javascript
vue 接口请求地址前缀本地开发和线上开发设置方式
Aug 13 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
php下intval()和(int)转换使用与区别
2008/07/18 PHP
创建配置文件 用PHP写出自己的BLOG系统 2
2010/04/12 PHP
phpExcel中文帮助手册之常用功能指南
2014/08/18 PHP
什么情况下可以不写PHP的闭合标签“?>”
2014/08/28 PHP
PHP中魔术变量__METHOD__与__FUNCTION__的区别
2014/09/29 PHP
php实现遍历文件夹的方法汇总
2017/03/02 PHP
PHP单例模式与工厂模式详解
2017/08/29 PHP
url地址自动加#号问题说明
2010/08/21 Javascript
JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
2014/06/23 Javascript
js获取IP地址的方法小结
2014/07/01 Javascript
如何编写高质量JS代码(续)
2015/02/25 Javascript
深入了解JavaScript的逻辑运算符(与、或)
2016/12/20 Javascript
微信小程序 devtool隐藏的秘密
2017/01/21 Javascript
让python json encode datetime类型
2010/12/28 Python
用Python程序抓取网页的HTML信息的一个小实例
2015/05/02 Python
Python中使用items()方法返回字典元素对的教程
2015/05/21 Python
Python while 循环使用的简单实例
2016/06/08 Python
python 打印直角三角形,等边三角形,菱形,正方形的代码
2017/11/21 Python
pandas实现将dataframe满足某一条件的值选出
2019/06/12 Python
Python数据结构与算法(几种排序)小结
2019/06/22 Python
Python中正反斜杠(‘/’和‘\’)的意义与用法
2019/08/12 Python
Python 调用 Windows API COM 新法
2019/08/22 Python
Python urllib request模块发送请求实现过程解析
2020/12/10 Python
魔幻般冒泡背景的CSS3按钮动画
2016/02/27 HTML / CSS
移动端HTML5开发神器之vconsole详解
2020/12/15 HTML / CSS
JavaScript实现前端网页版倒计时
2021/03/24 Javascript
2013年员工自我评价范文
2013/12/27 职场文书
竞选部门副经理的自荐书范文
2014/02/11 职场文书
大学生工作自荐书
2014/06/16 职场文书
本科毕业生应聘自荐信范文
2014/06/26 职场文书
物价局领导班子四风问题整改措施
2014/10/26 职场文书
老干部工作汇报材料
2014/10/28 职场文书
党性分析材料格式
2014/12/19 职场文书
2016年暑期教师培训心得体会
2016/01/09 职场文书
Springboot如何使用logback实现多环境配置?
2021/06/16 Java/Android
Vue OpenLayer测距功能的实现
2022/04/20 Vue.js