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


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 相关文章推荐
PJBlog插件 防刷新的在线播放器
Oct 25 Javascript
jqeury eval将字符串转换json的方法
Jan 20 Javascript
jQuery实现的Email中的收件人效果(按del键删除)
Mar 20 Javascript
node.js中的console.error方法使用说明
Dec 10 Javascript
JS实现带缓冲效果打开、关闭、移动一个层的方法
May 09 Javascript
浅析AngularJS Filter用法
Dec 28 Javascript
利用JS生成博文目录及CSS定制博客
Feb 10 Javascript
Js+Ajax,Get和Post在使用上的区别小结
Jun 08 Javascript
解决Vue2.0自带浏览器里无法打开的原因(兼容处理)
Jul 28 Javascript
Angular中支持SCSS的方法
Nov 18 Javascript
基于Vue实现拖拽效果
Apr 27 Javascript
详解Element-UI中上传的文件前端处理
Aug 07 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实现ping
2006/10/09 PHP
一个MYSQL操作类
2006/11/16 PHP
Window下PHP三种运行方式图文详解
2013/06/11 PHP
php中call_user_func函数使用注意事项
2014/11/21 PHP
php文件夹的创建与删除方法
2015/01/24 PHP
PHP连接SQLServer2005的方法
2015/01/27 PHP
phpStudy访问速度慢和启动失败的解决办法
2015/11/19 PHP
Laravel 实现在Blade模版中使用全局变量代替路径的例子
2019/10/22 PHP
Javascript常考语句107条收集
2010/03/09 Javascript
Jquery 获取checkbox的checked问题
2011/11/16 Javascript
jquery操作checked属性以及disabled属性的多种方法
2014/06/20 Javascript
jQuery中andSelf()方法用法实例
2015/01/08 Javascript
javascript最基本的函数汇总
2015/06/25 Javascript
js+css实现超简洁的二级下拉菜单效果代码
2015/09/07 Javascript
AngularJS服务service用法总结
2016/12/13 Javascript
lhgcalendar时间插件限制只能选择三个月的实现方法
2017/07/03 Javascript
js 取消页面可以选中文字的功能方法
2018/01/02 Javascript
微信小程序实现跳转的几种方式总结(推荐)
2019/04/24 Javascript
koa router 多文件引入的方法示例
2019/05/22 Javascript
[18:20]DOTA2 HEROS教学视频教你分分钟做大人-昆卡
2014/06/11 DOTA
[43:24]2018DOTA2亚洲邀请赛3月29日 小组赛A组 LGD VS Liquid
2018/03/30 DOTA
在Python的Django框架下使用django-tagging的教程
2015/05/30 Python
解读Python编程中的命名空间与作用域
2015/10/16 Python
Python实现的径向基(RBF)神经网络示例
2018/02/06 Python
matplotlib.pyplot绘图显示控制方法
2019/01/15 Python
Python 使用SFTP和FTP实现对服务器的文件下载功能
2020/12/17 Python
HTML5 贪吃蛇游戏实现思路及源代码
2013/09/03 HTML / CSS
JBL澳大利亚官方商店:扬声器、耳机和音响系统
2018/05/24 全球购物
学生出入校管理制度
2014/01/16 职场文书
十八大标语口号
2014/10/09 职场文书
68句权威创业名言
2019/08/26 职场文书
PHP判断是否是json字符串
2021/04/01 PHP
Golang 如何实现函数的任意类型传参
2021/04/29 Golang
vue实现列表拖拽排序的示例代码
2022/04/08 Vue.js
vue @click.native 绑定原生点击事件
2022/04/22 Vue.js
Python实现聚类K-means算法详解
2022/07/15 Python