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


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 相关文章推荐
js FLASH幻灯片字符串中有连接符&的处理方法
Mar 01 Javascript
JS操作select下拉框动态变动(创建/删除/获取)
Jun 02 Javascript
jquery选择器、属性设置用法经验总结
Sep 08 Javascript
百度判断手机终端并自动跳转js代码及使用实例
Jun 11 Javascript
jquery中checkbox使用方法简单实例演示
Nov 24 Javascript
JavaScript数据类型学习笔记
Jan 25 Javascript
Bootstrap风格的WPF样式
Dec 07 Javascript
完美解决mui框架off-canvas侧滑超出部分隐藏无法滚动的问题
Jan 25 Javascript
vue页面跳转后返回原页面初始位置方法
Feb 11 Javascript
axios对请求各种异常情况处理的封装方法
Sep 25 Javascript
vue开发拖拽进度条滑动组件
Sep 21 Javascript
小程序角标的添加及绑定购物车数量进行实时更新的实现代码
Dec 07 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
《Pokemon Sword·Shield》系列WEB动画《薄明之翼》第2话声优阵容公开!
2020/03/06 日漫
php正则过滤html标签、空格、换行符的代码(附说明)
2010/10/25 PHP
PHP统一页面编码避免乱码问题
2015/04/09 PHP
关于php中的json_encode()和json_decode()函数的一些说明
2016/11/20 PHP
利用PHP获取网站访客的所在地位置
2017/01/18 PHP
PHP封装类似thinkphp连贯操作数据库Db类与简单应用示例
2019/05/08 PHP
为radio类型的INPUT添加客户端脚本(附加实现JS来禁用onClick事件思路代码)
2010/11/11 Javascript
关于extjs treepanel复选框选中父节点与子节点的问题
2013/04/02 Javascript
jquery的each方法使用示例分享
2014/03/25 Javascript
JavaScript的事件代理和委托实例分析
2015/03/25 Javascript
Jquery代码实现图片轮播效果(一)
2015/08/12 Javascript
基于jQuery+PHP+Mysql实现在线拍照和在线浏览照片
2015/09/06 Javascript
AngularJS入门教程之过滤器用法示例
2016/11/02 Javascript
MUI实现上拉加载和下拉刷新效果
2017/06/30 Javascript
Angular实现下拉框模糊查询功能示例
2018/01/03 Javascript
vue2.0使用v-for循环制作多级嵌套菜单栏
2018/06/25 Javascript
element-ui 设置菜单栏展开的方法
2018/08/22 Javascript
JavaScript简单实现动态改变HTML内容的方法示例
2018/12/25 Javascript
原生js实现公告滚动效果
2021/01/10 Javascript
vue flex 布局实现div均分自动换行的示例代码
2020/08/05 Javascript
利用python爬取散文网的文章实例教程
2017/06/18 Python
python 多个参数不为空校验方法
2019/02/14 Python
Pytorch mask_select 函数的用法详解
2020/02/18 Python
python实现经纬度采样的示例代码
2020/12/10 Python
夏威夷灵感服装及配饰:Reyn Spooner
2018/09/18 全球购物
马来西亚与新加坡长途巴士售票网站:BusOnlineTicket.com
2018/11/05 全球购物
Camille Jewelry官网:现代女性时尚首饰
2019/07/07 全球购物
在weblogic中发布ejb需涉及到哪些配置文件
2012/01/17 面试题
日语专业毕业生自荐信
2013/11/11 职场文书
小学三年级数学教学反思
2014/01/31 职场文书
委托公证书范本
2014/04/03 职场文书
法学自荐信
2014/06/20 职场文书
离婚协议书怎么写(范本参考)
2014/09/30 职场文书
群众路线四风自我剖析材料
2014/10/08 职场文书
2014年个人工作总结范文
2014/11/07 职场文书
给朋友的赠语
2015/06/23 职场文书