微信小程序获取地理位置及经纬度授权代码实例


Posted in Javascript onSeptember 18, 2019

这篇文章主要介绍了微信小程序获取地理位置及经纬度授权代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

微信小程序获取地理位置授权,首先需要在app.json中添加配置:

"permission": {
  "scope.userLocation": {
   "desc": "请确认授权"
  }
 }

获取经纬度:如果手机未开启位置信息,那么授权成功后在wx.getLocation()方法中也会一直失败,所以需要在fail方法中提示用户开启手机位置信息

getUserLocation: function () {
    let vm = this
    wx.getSetting({
      success: (res) => {
        // res.authSetting['scope.userLocation'] == undefined  表示 初始化进入该页面
        // res.authSetting['scope.userLocation'] == false  表示 非初始化进入该页面,且未授权
        // res.authSetting['scope.userLocation'] == true  表示 地理位置授权
        // 拒绝授权后再次进入重新授权
        if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
          // console.log('authSetting:status:拒绝授权后再次进入重新授权', res.authSetting['scope.userLocation'])
          wx.showModal({
            title: '',
            content: '【泰福利Lite】需要获取你的地理位置,请确认授权',
            success: function (res) {
              if (res.cancel) {
                wx.showToast({
                  title: '拒绝授权',
                  icon: 'none'
                })
                setTimeout(() => {
                  wx.navigateBack()
                }, 1500)
              } else if (res.confirm) {
                wx.openSetting({
                  success: function (dataAu) {
                    // console.log('dataAu:success', dataAu)
                    if (dataAu.authSetting["scope.userLocation"] == true) {
                      //再次授权,调用wx.getLocation的API
                      vm.getLocation(dataAu)
                    } else {
                      wx.showToast({
                        title: '授权失败',
                        icon: 'none'
                      })
                      setTimeout(() => {
                        wx.navigateBack()
                      }, 1500)
                    }
                  }
                })
              }
            }
          })
        }
        // 初始化进入,未授权
        else if (res.authSetting['scope.userLocation'] == undefined) {
          // console.log('authSetting:status:初始化进入,未授权', res.authSetting['scope.userLocation'])
          //调用wx.getLocation的API
          vm.getLocation(res)
        }
        // 已授权
        else if (res.authSetting['scope.userLocation']) {
          // console.log('authSetting:status:已授权', res.authSetting['scope.userLocation'])
          //调用wx.getLocation的API
          vm.getLocation(res)
        }
      }
    })
  },
  // 微信获得经纬度
  getLocation: function (userLocation) {
    let vm = this
    wx.getLocation({
      type: "wgs84",
      success: function (res) {
        // console.log('getLocation:success', res)
        var latitude = res.latitude
        var longitude = res.longitude
        vm.getDaiShu(latitude, longitude)
      },
      fail: function (res) {
        // console.log('getLocation:fail', res)
        if (res.errMsg === 'getLocation:fail:auth denied') {
          wx.showToast({
            title: '拒绝授权',
            icon: 'none'
          })
          setTimeout(() => {
            wx.navigateBack()
          }, 1500)
          return
        }
        if (!userLocation || !userLocation.authSetting['scope.userLocation']) {
          vm.getUserLocation()
        } else if (userLocation.authSetting['scope.userLocation']) {
          wx.showModal({
            title: '',
            content: '请在系统设置中打开定位服务',
            showCancel: false,
            success: result => {
              if (result.confirm) {
                wx.navigateBack()
              }
            }
          })
        } else {
          wx.showToast({
            title: '授权失败',
            icon: 'none'
          })
          setTimeout(() => {
            wx.navigateBack()
          }, 1500)
        }
      }
    })
  }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
显示、隐藏密码
Jul 01 Javascript
js字符编码函数区别分析
Jun 05 Javascript
jquery向.ashx文件post中文乱码问题的解决方法
Mar 28 Javascript
silverlight线程与基于事件驱动javascript引擎(实现轨迹回放功能)
Aug 09 Javascript
appendChild() 或 insertBefore()使用与区别介绍
Oct 11 Javascript
jquery 获取dom固定元素 添加样式的简单实例
Feb 04 Javascript
深入理解JavaScript系列(18):面向对象编程之ECMAScript实现
Mar 05 Javascript
基于jQuery+PHP+Mysql实现在线拍照和在线浏览照片
Sep 06 Javascript
bootstrap时间控件daterangepicker使用方法及各种小bug修复
Oct 25 Javascript
vue.js内置组件之keep-alive组件使用
Jul 10 Javascript
详解Vue.js iview实现树形权限表(可扩展表)
Sep 30 Javascript
小程序实现单选多选功能
Nov 04 Javascript
layui复选框限制选择个数的方法
Sep 18 #Javascript
layui lay-verify form表单自定义验证规则详解
Sep 18 #Javascript
layui输入框只允许输入中文且判断长度的例子
Sep 18 #Javascript
Vue Components 数字键盘的实现
Sep 18 #Javascript
layui输入框中只允许输入整数的实现方法
Sep 18 #Javascript
layui富文本编辑器前端无法取值的解决方法
Sep 18 #Javascript
使用layui 的layedit定义自己的toolbar方法
Sep 18 #Javascript
You might like
30个php操作redis常用方法代码例子
2014/07/05 PHP
php程序总是提示验证码输入有误解决方案
2015/01/07 PHP
php实现Session存储到Redis
2015/11/11 PHP
php计算年龄精准到年月日
2015/11/17 PHP
Linux系统下使用XHProf和XHGui分析PHP运行性能
2015/12/08 PHP
php原生导出excel文件的两种方法(推荐)
2016/11/19 PHP
用JavaScript获取网页中的js、css、Flash等文件
2006/12/20 Javascript
基于jquery的不规则矩形的排列实现代码
2012/04/16 Javascript
chrome浏览器不支持onmouseleave事件的解决技巧
2013/05/31 Javascript
jquery.post用法关于type设置问题补充
2014/01/03 Javascript
jquery中页面Ajax方法$.load的功能使用介绍
2014/10/20 Javascript
jQuery form插件之formDdata参数校验表单及验证后提交
2016/01/23 Javascript
Js 获取当前函数参数对象的实现代码
2016/06/20 Javascript
jQGrid动态填充select下拉框的选项值(动态填充)
2016/11/28 Javascript
Bootstrap php制作动态分页标签
2016/12/23 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
2017/02/10 Javascript
layer提示框添加多个按钮选择的实例
2019/09/12 Javascript
[01:12]DOTA2次级职业联赛 - Newbee.Y 战队宣传片
2014/12/01 DOTA
[07:57]2018DOTA2国际邀请赛寻真——PSG.LGD凤凰浴火
2018/08/12 DOTA
Python 实现选择排序的算法步骤
2018/04/22 Python
详解pytorch 0.4.0迁移指南
2019/06/16 Python
python获取Linux发行版名称
2019/08/30 Python
使用Tensorboard工具查看Loss损失率
2020/02/15 Python
3种适用于Python的疯狂秘密武器及原因解析
2020/04/29 Python
python实现马丁策略的实例详解
2021/01/15 Python
python读取excel数据并且画图的实现示例
2021/02/08 Python
长曲棍球装备:Lacrosse Monkey
2020/12/02 全球购物
教师演讲稿范文
2014/01/08 职场文书
大学四年个人的自我评价
2014/02/26 职场文书
劲霸男装广告词改编版
2014/03/21 职场文书
村支部书记群众路线对照检查材料思想汇报
2014/10/08 职场文书
2015年双拥工作总结
2015/04/08 职场文书
英语演讲开场白
2015/05/29 职场文书
2015年暑期社会实践总结
2015/07/13 职场文书
css3实现背景图片半透明内容不透明的方法示例
2021/04/13 HTML / CSS
pd.DataFrame中的几种索引变换的实现
2022/06/16 Python