做一个小程序持续获取用户位置信息的功能,即使小程序切换到后台也能继续获取,getLocation这个api只有小程序在前台才能获取位置,所以不用这个
先申请一个腾讯地图key
在uniapp项目配置源码视图里加上这个代码
先获取权限,再开启后台持续获取位置的能力
javascript
"mp-weixin" : {
"requiredPrivateInfos" : [
"chooseLocation",
"getLocation",
"onLocationChange",
"startLocationUpdateBackground"
],
"requiredBackgroundModes" : [ "location" ],
"permission" : {
"scope.userLocation" : {
"desc" : "方便您使用更完整的功能"
},
"scope.startLocationUpdateBackground" : {
"desc" : "方便获取您的位置"
}
}
},
下面是使用页面的代码
javascript
//获取位置权限
setPosition(){
const thle = this;
uni.getSetting({
success(res) {
console.log('权限权限',res.authSetting)
if (!res.authSetting['scope.userLocation']) {
uni.authorize({
scope: 'scope.userLocation',
success() {
console.log("用户成功授权位置信息")
thle.keepPosition()
},
fail() {
console.log("用户拒绝授权位置信息,再次提示用户授权")
thle.showRefuseLocationPermission('nonono')
}
})
}else if(!res.authSetting['scope.userLocationBackground']){
//后台获取位置变化的权限
uni.authorize({
scope: 'scope.userLocationBackground',
success() {
console.log("用户成功授权位置信息")
thle.keepPosition()
},
fail() {
console.log("用户拒绝授权位置信息,再次提示用户授权")
thle.showRefuseLocationPermission('nonono')
}
})
}else{
thle.keepPosition()
}
}
})
},
//持续上传位置
keepPosition(){
const thle = this;
// uni.startLocationUpdate({
// success: res => console.log('开启前台位置成功'),
// fail: err => console.error('开启前台位置失败:', err),
// });
//开启前后台位置获取
uni.startLocationUpdateBackground({
success: res =>{
console.log('前后台位置成功')
uni.onLocationChange(rr=> {
console.log('持续位置:',rr);
console.log('纬度:' + rr.latitude);
console.log('经度:' + rr.longitude);
thle.updataPosition(rr.latitude,rr.longitude)
});
},
fail: err => console.error('前后台位置失败:', err),
});
},
//更新位置
updataPosition(latitude,longitude){
const thle = this;
console.log('更新位置',latitude,longitude)
uni.request({
url: `https://apis.map.qq.com/ws/geocoder/v1/?key=${'腾讯地图key'}&location=`+ latitude + ',' +longitude,
success: res => {
console.log('解析成功',res)
let address = res.data.result.address;//经纬度解析后的地址
}
})
},
// 用户拒绝授权的展示
showRefuseLocationPermission(e) {
const that = this;
uni.showModal({
title: "提示",
content: "需要获取用户位置以及后台定位权限",
confirmText: "前往设置",
showCancel: false,
success(res) {
if (res.confirm) {
uni.openSetting({
success: (res) => {
console.log("打开设置成功", res);
if (res.authSetting['scope.userLocation']) {
console.log('成功授权userLocation')
} else {
console.log('用户未授权userLocation')
// 递归调用本函数,(函数套函数)
that.showRefuseLocationPermission()
}
},
fail: (err) => {
console.log("打开设置失败", err)
}
})
}
}
})
},