微信小程序出现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 相关文章推荐
JavaScript 脚本将当地时间转换成其它时区
Mar 19 Javascript
Javascript 面向对象编程(一) 封装
Aug 28 Javascript
JavaScript控制网页层收起和展开效果的方法
Apr 15 Javascript
js实现简单排列组合的方法
Jan 27 Javascript
javascript单页面手势滑屏切换原理详解
Mar 21 Javascript
jQuery实现简单滚动动画效果
Apr 07 Javascript
使用开源工具制作网页验证码的方法
Oct 17 Javascript
Angular.js基础学习之初始化
Mar 10 Javascript
详解AngularJs路由之Ui-router-resolve(预加载)
Jun 13 Javascript
JavaScript设计模式之代理模式简单实例教程
Jul 03 Javascript
了解javascript中的Dom操作
May 27 Javascript
js瀑布流布局的实现
Jun 28 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 写文本日志实现代码
2010/05/18 PHP
从零开始学YII2框架(一)通过Composer安装Yii2框架
2014/08/20 PHP
PHP数组排序之sort、asort与ksort用法实例
2014/09/08 PHP
PHP图片处理之图片旋转和图片翻转实例
2014/11/19 PHP
php 数组字符串搜索array_search技巧
2016/07/05 PHP
ExtJS 2.0实用简明教程 之Border区域布局
2009/04/29 Javascript
JQuery优缺点分析说明
2011/04/10 Javascript
JS截取字符串常用方法详细整理
2013/10/28 Javascript
Javascript call和apply区别及使用方法
2013/11/14 Javascript
JavaScript验证Email(3种方法)
2015/09/21 Javascript
深入理解angularjs过滤器
2016/05/25 Javascript
js实现带缓动动画的导航栏效果
2017/01/16 Javascript
ES6新特性八:async函数用法实例详解
2017/04/21 Javascript
vue2.0+vue-router构建一个简单的列表页的示例代码
2019/02/13 Javascript
运用js实现图层拖拽的功能
2019/05/24 Javascript
JsonServer安装及启动过程图解
2020/02/28 Javascript
Python 错误和异常小结
2013/10/09 Python
利用Django框架中select_related和prefetch_related函数对数据库查询优化
2015/04/01 Python
在MAC上搭建python数据分析开发环境
2016/01/26 Python
Python中常见的异常总结
2018/02/20 Python
Python简单实现查找一个字符串中最长不重复子串的方法
2018/03/26 Python
python 判断linux进程,并杀死进程的实现方法
2019/07/01 Python
python调用支付宝支付接口流程
2019/08/15 Python
如何将json数据转换为python数据
2020/09/04 Python
浅析Python 中的 WSGI 接口和 WSGI 服务的运行
2020/12/09 Python
CSS3绘制超炫的上下起伏波动进度加载动画
2016/04/21 HTML / CSS
Ann Taylor官方网站:美国最大的女性产品制造商之一
2016/09/14 全球购物
英国文胸专家:AmpleBosom.com
2018/02/06 全球购物
万代美国官网:PREMIUM BANDAI USA
2020/09/11 全球购物
一套PHP的笔试题
2013/05/31 面试题
应聘收银员个人的求职信
2013/11/30 职场文书
地震慰问信
2015/02/14 职场文书
大学军训通讯稿(2016最新版)
2015/12/21 职场文书
2016年优秀共产党员先进事迹材料
2016/02/29 职场文书
六年级上册《闻官军收河南河北》的教学设计
2019/11/15 职场文书
PHP正则表达式之RCEService回溯
2022/04/11 PHP