微信小程序出现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 相关文章推荐
农历与西历对照
Sep 06 Javascript
prototype 1.5相关知识及他人笔记
Dec 16 Javascript
jQuery链式操作如何实现以及为什么要用链式操作
Jan 17 Javascript
jQuery 遍历- 关于closest() 的方法介绍以及与parents()的方法区别分析
Apr 26 Javascript
原生js的弹出层且其内的窗口居中
May 14 Javascript
window.location 对象所包含的属性
Oct 10 Javascript
jQuery使用animate创建动画用法实例
Aug 07 Javascript
jQuery操作基本控件方法实例分析
Dec 31 Javascript
JavaScript获取客户端IP的方法(新方法)
Mar 11 Javascript
jQuery实现百度登录框的动态切换效果
Apr 21 jQuery
JavaScript获取tr td 的三种方式全面总结(推荐)
Aug 15 Javascript
ajax与jsonp的区别及用法
Oct 16 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下使用以下代码连接并测试
2008/04/09 PHP
php+jQuery递归调用POST循环请求示例
2016/10/14 PHP
php解析base64数据生成图片的方法
2016/12/06 PHP
phpstudy的php版本自由修改的方法
2017/10/18 PHP
漂亮的thinkphp 跳转页封装示例
2019/10/16 PHP
fckeditor 获取文本框值的实现代码
2009/02/09 Javascript
十个优秀的Ajax/Javascript实例网站收集
2010/03/31 Javascript
JS target与currentTarget区别说明
2011/08/28 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(五)可移动地图的实现
2013/01/23 Javascript
Javascript 鼠标移动上去 滑块跟随效果代码分享
2013/11/23 Javascript
node.js中Socket.IO的进阶使用技巧
2014/11/04 Javascript
js Object2String方便查看js对象内容
2014/11/24 Javascript
javascript实现随机生成DIV背景色
2016/06/20 Javascript
【经验总结】编写JavaScript代码时应遵循的14条规律
2016/06/20 Javascript
JavaScript 拖拽实例代码
2016/09/21 Javascript
js 奇葩技巧之隐藏代码
2017/08/11 Javascript
JQuery选中select组件被选中的值方法
2018/03/08 jQuery
小程序实现五星点评效果
2018/11/03 Javascript
js实现简单分页导航栏效果
2019/06/28 Javascript
微信小程序封装分享与分销功能过程解析
2019/08/13 Javascript
小程序实现录音上传功能
2019/11/22 Javascript
js实现一款简单踩白块小游戏(曾经很火)
2019/12/02 Javascript
微信小程序点击滚动到指定位置的实现
2020/05/22 Javascript
python创建线程示例
2014/05/06 Python
Python的socket模块源码中的一些实现要点分析
2016/06/06 Python
详解Python做一个名片管理系统
2019/03/14 Python
python进行参数传递的方法
2020/05/12 Python
python 数据分析实现长宽格式的转换
2020/05/18 Python
Python __slots__的使用方法
2020/11/15 Python
html通过canvas转成base64的方法
2019/07/18 HTML / CSS
html5的画布canvas——画出弧线、旋转的图形实例代码+效果图
2013/06/09 HTML / CSS
全球知名旅游社区法国站点:TripAdvisor法国
2016/08/03 全球购物
小学校长竞聘演讲稿
2014/05/16 职场文书
船舶工程技术专业求职信
2014/08/07 职场文书
护理自荐信
2019/05/14 职场文书
Idea连接MySQL数据库出现中文乱码的问题
2021/04/14 MySQL