微信小程序出现wx.getLocation再次授权问题的解决方法分析


Posted in Javascript onJanuary 16, 2019

本文实例讲述了微信小程序出现wx.getLocation再次授权问题的解决方法。分享给大家供大家参考,具体如下:

首先,在page外定义一个公共函数用于发送获取位置的请求

var getLocation = function (that) {
 wx.getLocation({
  type: 'wgs84',
  success: function (res) {
   // 经纬度
   var latitude = res.latitude
   var longitude = res.longitude
   var aK = that.data.aK
   wx.request({
    url: 'https://api.map.baidu.com/geocoder/v2/?ak=' + aK + '&location=' + latitude + ',' + longitude + '&output=json',
    data: {},
    header: {
     'content-type': 'application/json'
    },
    success: function (res) {
     var city = res.data.result.addressComponent.city;
     that.setData({
      currentCity: city
     })
     wx.request({
      url: 'xxx' + city,
      data: {},
      header: {
       'content-type': 'application/json'
      },
      success: function (res) {
       that.setData({
        county: res.data,
       })
      },
     })
    }
   })
  },
  fail: function () {
   wx.showToast({
    title: '授权失败',
    icon: 'success',
    duration: 1000
   })
  }
 })
}

然后,在page中需要位置调用page外部的getLocation 函数

wx.getSetting({
    success: (res) => {
     if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {//非初始化进入该页面,且未授权
      wx.showModal({
       title: '是否授权当前位置',
       content: '需要获取您的地理位置,请确认授权,否则无法获取您所需数据',
       success: function (res) {
        if (res.cancel) {
         that.setData({
          isshowCIty: false
         })
         wx.showToast({
          title: '授权失败',
          icon: 'success',
          duration: 1000
         })
        } else if (res.confirm) {
         wx.openSetting({
          success: function (dataAu) {
           if (dataAu.authSetting["scope.userLocation"] == true) {
            wx.showToast({
             title: '授权成功',
             icon: 'success',
             duration: 1000
            })
            //再次授权,调用getLocationt的API
            getLocation(that);
           } else {
            wx.showToast({
             title: '授权失败',
             icon: 'success',
             duration: 1000
            })
           }
          }
         })
        }
       }
      })
     } else if (res.authSetting['scope.userLocation'] == undefined) {//初始化进入
      getLocation(that);
     }
     else { //授权后默认加载
      getLocation(that);
     }
    }
})

上述过程执行顺序为:

1.先加载wx.getLocation弹出自己的授权框,如图

微信小程序出现wx.getLocation再次授权问题的解决方法分析

然后,点击确定即可授权,若点击取消则取消授权,当再次需要授权时,会调用我们自定义的Modal框,如图

微信小程序出现wx.getLocation再次授权问题的解决方法分析

其次,针对上述的Modal框点击取消则关闭,若点击确定则打开手机的地址授权设置,如图

微信小程序出现wx.getLocation再次授权问题的解决方法分析

最后,若直接点击左上方的返回箭头则取消授权,若先选中地理位置按钮,然后在点击左上方的返回箭头则授权成功,如图

微信小程序出现wx.getLocation再次授权问题的解决方法分析

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
Extjs学习笔记之六 面版
Jan 08 Javascript
给artDialog 5.02 增加ajax get功能详细介绍
Nov 13 Javascript
javascript的offset、client、scroll使用方法详解
Dec 25 Javascript
两种方法实现在HTML页面加载完毕后运行某个js
Jun 16 Javascript
JS小游戏之象棋暗棋源码详解
Sep 25 Javascript
javascript动态添加checkbox复选框的方法
Dec 23 Javascript
JavaScript类型系统之布尔Boolean类型详解
Jun 26 Javascript
红黑树的插入详解及Javascript实现方法示例
Mar 26 Javascript
10个最受欢迎的 JavaScript框架(推荐)
Apr 24 Javascript
微信小程序如何再次获取用户授权的方法
May 10 Javascript
基于Angular 8和Bootstrap 4实现动态主题切换的示例代码
Feb 11 Javascript
webpack+vue.js构建前端工程化的详细教程
May 10 Javascript
在Create React App中启用Sass和Less的方法示例
Jan 16 #Javascript
在Create React App中使用CSS Modules的方法示例
Jan 15 #Javascript
Vue 样式绑定的实现方法
Jan 15 #Javascript
在vue使用clipboard.js进行一键复制文本的实现示例
Jan 15 #Javascript
2019 年编写现代 JavaScript 代码的5个小技巧(小结)
Jan 15 #Javascript
mock.js实现模拟生成假数据功能示例
Jan 15 #Javascript
详解webpack引入第三方库的方式以及注意事项
Jan 15 #Javascript
You might like
PHP APC的安装与使用详解
2013/06/13 PHP
PHP中CURL的CURLOPT_POSTFIELDS参数使用细节
2014/03/17 PHP
PHP快速按行读取CSV大文件的封装类分享(也适用于其它超大文本文件)
2014/04/10 PHP
php在windows环境下获得cpu内存实时使用率(推荐)
2018/02/08 PHP
使用JQUERY Tabs插件宿主IFRAMES
2010/01/01 Javascript
Jquery 1.42 checkbox 全选和反选代码
2010/03/27 Javascript
JavaScript动态设置div的样式的方法
2015/12/26 Javascript
jQuery Ajax请求后台数据并在前台接收
2016/12/10 Javascript
nodejs处理图片的中间件node-images详解
2017/05/08 NodeJs
jQuery制作全屏宽度固定高度轮播图(实例讲解)
2017/07/08 jQuery
vue中使用vue-router切换页面时滚动条自动滚动到顶部的方法
2017/11/28 Javascript
JS去除字符串最后的逗号实例分析【四种方法】
2019/06/20 Javascript
LayUi数据表格自定义赋值方式
2019/10/26 Javascript
vue+canvas实现拼图小游戏
2020/09/18 Javascript
python私有属性和方法实例分析
2015/01/15 Python
在Python程序中实现分布式进程的教程
2015/04/28 Python
python实现将汉字保存成文本的方法
2018/11/16 Python
详解Python3迁移接口变化采坑记
2019/10/11 Python
python3 assert 断言的使用详解 (区别于python2)
2019/11/27 Python
Pytorch学习之torch用法----比较操作(Comparison Ops)
2020/06/28 Python
英国在线电子和小工具商店:TecoBuy
2018/10/06 全球购物
试述DBMS的主要功能
2016/11/13 面试题
土木工程建筑专业毕业生求职信
2013/10/21 职场文书
实习生体会的自我评价范文
2013/11/28 职场文书
民主生活会对照检查材料
2014/09/22 职场文书
群众路线调研报告范文
2014/11/03 职场文书
2014年领班工作总结
2014/11/25 职场文书
惊涛骇浪观后感
2015/06/05 职场文书
应收账款管理制度
2015/08/06 职场文书
教师病假条范文
2015/08/17 职场文书
2016年春季运动会通讯稿
2015/11/25 职场文书
浅谈Python3中datetime不同时区转换介绍与踩坑
2021/08/02 Python
Canvas绘制像素风图片的示例代码
2021/09/25 HTML / CSS
Python 类,对象,数据分类,函数参数传递详解
2021/09/25 Python
Vue+TypeScript中处理computed方式
2022/04/02 Vue.js
台积电称即便经济低迷也没有降价的计划
2022/04/21 数码科技