小程序获取实时位置信息

293 阅读1分钟

小程序中需要获取用户的经纬度;需要实时监听;无论是手机屏幕发亮;还是黑屏;无论是小程序是否在屏幕;小程序是否在后台;微信是否在后台 都可以获取到位置信息;

只要不是杀死小程序;默认点击胶囊按钮的关闭;如果开启位置信息的方法;默认会让小程序悬浮到应用上;

实现:

需要小程序开发平台中;接口设置 申请开通:(这个比较难开通;待开通可以找我)

image.png

wx.onLocationChange wx.startLocationUpdateBackground;

申请开通需要去设置小程序的分类和类目;只要符合条件的才可以申请;

在uni-app 开发小程序时需要在 manifest.json 源码视图配置:

requiredPrivateInfos,requiredBackgroundModes

 /* 小程序特有相关 */
    "mp-weixin" : {
        "appid" : "wx123456789",
        "setting" : {
            "urlCheck" : false
        },
        "usingComponents" : true,
        "libVersion" : "latest",
        "permission" : {
            "scope.userLocation" : {
                "desc" : "你的位置信息将用于小程序位置接口的效果展示"
            }
        },
        "requiredPrivateInfos" : [ "getLocation", "chooseLocation","onLocationChange", "startLocationUpdateBackground" ],
	/* 微信小程序需要在后台使用的能力*/
	"requiredBackgroundModes" : [ "location" ]
    },

代码:

<text @click="openOrclose">开启/关闭实时位置</text>
data() {
    return {
         isOpen:false,
    }
},
// 开启或者关闭实时位置
openOrclose(){
        if(!this.isOpen){
                this.getLocation();
        }else{
                // 移除实时地理位置变化事件的监听函数
                wx.offLocationChange(this.listenerFun);
                // 关闭位置监听
                wx.stopLocationUpdate();
        }
        this.isOpen = !this.isOpen;
},
// 获取位置
getLocation(){
        // 授权
        uni.authorize({
                scope: 'scope.userLocationBackground',
                success: (res) => {
                        this.getWxData();
                },
        });
},
getWxData(){
        wx.startLocationUpdateBackground({
                 success: () => {
                        // 实时获取位置信息
                        wx.onLocationChange(this.listenerFun);
                }
        })
},
// 回调
listenerFun(res){
        let latitude_longitude = `${res.longitude},${res.latitude}`;
        uni.showToast({
                title:latitude_longitude,
                icon:"none"
        })
        // 走接口请求:用来判断黑屏状态下走没有;
},

运行后效果:

image.png

image.png

image.png

黑屏后;ios 与 安卓运行1个小时 测试没有问题;可以继续发送位置信息;

不太完善的地方:wx.onLocationChange 获取位置太过频繁;这个需要优化;