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


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 相关文章推荐
用JavaScript编写COM组件的步骤
Mar 17 Javascript
javascript 清除输入框中的数据
Apr 13 Javascript
JavaScript Cookie 直接浏览网站分网址
Dec 08 Javascript
jquery实现背景墙聚光灯效果示例分享
Mar 02 Javascript
Egret引擎开发指南之运行项目
Sep 03 Javascript
JQuery实现可直接编辑的表格
Apr 16 Javascript
jquery实现鼠标经过显示下划线的渐变下拉菜单效果代码
Aug 24 Javascript
JavaScript程序设计之JS调试
Dec 09 Javascript
JavaScript 判断一个对象{}是否为空对象的简单方法
Oct 09 Javascript
关于jQuery里prev()的简单操作代码
Oct 27 jQuery
Vue-router 中hash模式和history模式的区别
Jul 24 Javascript
js中getter和setter用法实例分析
Aug 14 Javascript
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实现的短网址算法分享
2014/06/20 PHP
PHP使用get_headers函数判断远程文件是否存在的方法
2014/11/28 PHP
php计划任务之ignore_user_abort函数实现方法
2015/01/08 PHP
Yii2 rbac权限控制之菜单menu实例教程
2016/04/28 PHP
跟随鼠标旋转的文字
2006/11/30 Javascript
javascript实现划词标记+划词搜索功能
2007/03/06 Javascript
javascript String 的扩展方法集合
2008/06/01 Javascript
简明json介绍
2008/09/28 Javascript
javascript:history.go()和History.back()的区别及应用
2012/11/25 Javascript
js使用eval解析json(js中使用json)
2014/01/17 Javascript
jquery.ajax的url中传递中文乱码问题的解决方法
2014/02/07 Javascript
解释&amp;&amp;和||在javascript中的另类用法
2014/07/28 Javascript
JavaScript用JQuery呼叫Server端方法示例代码
2014/09/03 Javascript
浅谈jQuery异步对象(XMLHttpRequest)
2014/11/17 Javascript
使用CSS+JavaScript或纯js实现半透明遮罩效果的实例分享
2016/05/09 Javascript
jQuery实例—选项卡的简单实现(js源码和jQuery)
2016/06/14 Javascript
js 函数式编程学习笔记
2017/03/25 Javascript
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
2018/09/14 Javascript
利用Node.js如何实现文件循环覆写
2019/04/05 Javascript
鸿蒙系统中的 JS 开发框架
2020/09/18 Javascript
Python的Flask框架中web表单的教程
2015/04/20 Python
用Django实现一个可运行的区块链应用
2018/03/08 Python
python numpy 显示图像阵列的实例
2018/07/02 Python
OpenCV python sklearn随机超参数搜索的实现
2020/01/17 Python
python selenium操作cookie的实现
2020/03/18 Python
Python内建序列通用操作6种实现方法
2020/03/26 Python
CSS3绘制有活力的链接下划线
2016/07/14 HTML / CSS
html5如何在Canvas中实现自定义路径动画示例
2017/09/18 HTML / CSS
贝斯特韦斯特酒店集团官网:Best Western
2019/01/03 全球购物
Hotels.com越南:酒店预订
2019/10/29 全球购物
购房协议书
2014/04/11 职场文书
会计求职信
2014/05/29 职场文书
批评与自我批评总结
2014/10/17 职场文书
新员工试用期工作总结2015
2015/05/28 职场文书
员工规章制度范本
2015/08/07 职场文书
Python selenium的这三种等待方式一定要会!
2021/06/10 Python