小程序获取定位完整的封装js(uniapp)
1.小程序获取定位,首先需要在微信公众平台,申请getLocation接口(开发管理->接口设置)
2.在manifest.json打开源码视图,增加代码
"mp-weixin": {
"appid": "appid","permission": {
"scope.userLocation": {
"desc": "获取您的地理位置"
},
},
"requiredPrivateInfos": ["chooseLocation","getLocation"],
},
3.在腾讯地图api中申请一个key,用于经纬度的逆转化(需要将腾讯地图的域名配置到微信公众平台request中)
4.封装获取定位js
let getLocation = function() {
return new Promise((reslove) => {
//获取设置
uni.getSetting({
success(res) {
if (res.authSetting["scope.userLocation"] || res.authSetting["scope.userLocation"] === undefined) {
//获取定位
uni.getLocation({
type: 'gcj02',
success(res) {
reslove(codeAroundCity(res.latitude, res.longitude))
},
fail(err) {
console.log(err);
}
})
} else {
uni.showModal({
title: '提示',
content: '为方便更好的服务您,需要获取您的位置信息!',
success(res) {
if (res.confirm) {
//打开设置
uni.openSetting({
success(dataAu) {
if (dataAu.authSetting['scope.userLocation'] === true) {
uni.getLocation({
type: 'gcj02',
success(res) {
reslove(codeAroundCity(res.latitude,res.longitude))
},
fail(err) {
console.log(err);
}
})
}
}
})
}
}
})
}
}
})
})
}
let codeAroundCity = function(lat, lng) {
let key = '腾讯地图申请的key'
return new Promise((reslove, reject) => {
uni.request({
url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${lat},${lng}`,
method: 'GET',
data: {
key,
},
success(res) {
let result = res.data.result.address_component //这边需要省,市,县,所以就拿这个信息,如果需要其他信息可以参照腾讯地图api
reslove(result)
}
})
})
}
export default getLocation
5.使用,引入getLocation方法
async onLoad(){
let res = await getLocation()//res就是获取到的信息
}
不足之处还请各位大佬指点!!!
设置
小程序获取定位完整的封装js(uniapp)的更多相关文章
- (八)微信小程序---获取定位信息chooseLocation
微信小程序---获取定位信息 chooseLocation wxml <view bindtap="getlocalPath">{{localPath}}</v ...
- [微信小程序] 微信小程序获取用户定位信息并加载对应城市信息,wx.getLocation,腾讯地图小程序api,微信小程序经纬度逆解析地理信息
因为需要在小程序加个定位并加载对应城市信息 然而小程序自带api目前只能获取经纬度不能逆解析,虽然自己解析方式,但是同时也要调用地图,难道用户每次进小程序还要强行打开地图选择地址才定位吗?多麻烦也不利 ...
- 微信小程序-获取当前城市位置及再次授权地理位置
微信小程序-获取当前城市位置 1. 获取当前地理位置,可通过wx.getLocation接口,返回经纬度.速度等信息; 注意---它的默认工作机制: 首次进入页面,调用该api,返回用户授权结果,并保 ...
- 基于小程序请求接口 wx.request 封装的类 axios 请求
基于小程序请求接口 wx.request 封装的类 axios 请求 Introduction wx.request 的配置.axios 的调用方式 源码戳我 feature 支持 wx.reques ...
- 微信小程序-获取经纬度
微信小程序-获取经纬度 最近公司新功能 要求在外的市场人员 发送位置信息回来. 用的还是微信小程序开发.... 微信小程序 提供一个接口 getLocation 这个接口反回来的位置 相对实际位置 相 ...
- 小程序获取微信用户的openid
小程序获取微信用户的openid //index.js //获取应用实例 const app = getApp() Page({ globalData: { appid: '11121221a89e0 ...
- 小程序基础知识点讲解-WXML + WXSS + JS,生命周期
小程序基础 小程序官方地址,小程序开发者工具,点击此处下载.在微信小程序中有一个配置文件project.config.json,此文件可以让开发者在不同设备中进行开发. 微信小程序共支持5种文件,wx ...
- 微信小程序 获取用户openid
1,可以在小程序app.js入口文件中放入登录代码 wx.login({ success: res => { // 登录注册接口 if (res.code) { // 调用服务端登录接口,发送 ...
- JavaScript和微信小程序获取IP地址的方法
最近公司新加了一个需求,根据用户登录的IP地址判断是否重复登录,重复登录就进行逼退,那么怎么获取到浏览器的IP地址呢?最后发现搜狐提供了一个JS接口,可以通过它获取到客户端的IP. 接口地址如下: h ...
- 微信小程序获取输入框(input)内容
微信小程序---获取输入框(input)内容 wxml <input placeholder="请输入手机号码" maxlength="11" type= ...
随机推荐
- 指针进阶(数组指针 )(C语言)
1. 数组名的理解 在指针入门中我们在使用指针访问数组的内容时,有这样的代码: int arr[10] = {1,2,3,4,5,6,7,8,9,10}; int *p = &arr[0]; ...
- mongodb插入数据不能在vue显示
问题描述:当我们在命令行插入数据时,在MongoVUE却显示不了数据,并且查询有插入数据的数据库,如下图所示 网上资料说,这是引擎的问题,mongoDB3.2版本之后默认开启的存储引擎是wiredRi ...
- Visual Studio 快速分析 .NET Dump 文件
前言 在开发和维护 .NET 应用程序的过程中,有时会遇到难以捉摸的性能瓶颈或内存泄漏等问题.这些问题往往发生在生产环境中,难以复现.为了更准确地诊断这些运行时问题,通常会收集应用程序在生产环境中的内 ...
- 异常断链的惨痛经历!拯救Air780EP模块紧急项目
必须要吐槽一下:最近被老板驱使,要用Air780EP模块做几个紧急项目... 就怕紧急项目,时间紧任务重,遇到了一些棘手问题,可把我给折腾死了-- 这里把遇到的问题,排查记录下来,看能不能帮到因遇 ...
- php ice框架
ice框架是php扩展框架 概念和 yaf Phalcon 那种框架类似,就是把框架编译为C扩展,调用起来就等于调用C,这样框架本身的加载消耗就省下来了. pecl https://pecl.php ...
- Docker容器使用问题:Failed to get D-Bus connection: Operation not permitted
原因是dbus-daemon没能启动.其实systemctl并不是不可以使用.将你的CMD或者entrypoint设置为/usr/sbin/init即可.如: docker run --privile ...
- VSCode关于编译scss的插件
先安装两个插件,live server和 live sass compiler两个插件 然后将下面的代码复制到设置(文件---首选项----设置----打开设置json)中 "liveSas ...
- 解决window.close()在谷歌浏览器不起作用
简单明了直接上解决方法: let url = ' '; // 空字符串中间要加空格 window.open(url, '_self').close();
- 性能检测工具之Lighthouse
转载:https://mp.weixin.qq.com/s?src=11×tamp=1618929340&ver=3020&signature=oXyx*RDLXjN ...
- 解决GitHub无法访问问题
作为开发者,经常使用借助GitHub进行开发,但是最近一直无法访问github.com站点,决定搞一下!!! 由于国内某些原因,导致我们有时候不能访问到 www.github.com.此时我们必须找到 ...