uniapp中获取位置信息处理步骤

 更新时间:2024年02月29日 11:16:34   作者:羽筠  
在uniapp中获取位置信息处理,要兼容用户同意授权、拒绝授权情况下,最终能成功获取到位置信息的,本文给大家介绍uniapp中获取位置信息处理步骤,感兴趣的朋友跟随小编一起看看吧

脚本之家 / 编程助手:解决程序员“几乎”所有问题!
脚本之家官方知识库 → 点击立即使用

在微信小程序中,获取定位,是需要用户授权的,那么当用户拒绝授权后,需要重新获取定位时,是不会再调起授权界面,这时需要用户主动打开设置界面,才可以重新开启授权权限;

那么,在uniapp中获取位置信息处理,要兼容用户同意授权、拒绝授权情况下,最终能成功获取到位置信息的,做以下处理:

处理逻辑

一、获取定位时,用户同意授权获取定位,得到位置信息;

第1步:获取用户当前的授权状态 =>
第2步:判断是同意授权位置时 =>
第3步:获取位置

二、获取定位时,用户拒绝授权获取定位的:

第1步:获取用户当前的授权状态 =>
第2步:判断是未同意授权位置时,引导用户打开设置界面,重新选择授权功能 =>

第3步:用户选择允许授权后
第4步:重新获取位置,得到位置信息

第3步:用户选择不允许授权后
第4步:可至第1步,继续重新获取位置

引用文件可多页面复用的处理逻辑代码

引用文件:

1
import { doGetLocation } from '@/utils/getLocation.js';

需要获取位置代码处执行:

1
2
3
doGetLocation((data)=>{
    console.log(data);
})

getLocation.js:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
// import { doGetLocation } from '@/utils/getLocation.js';
let isOpenSetting;
/**
 * 获取定位,兼容用户拒绝授权及相关处理(获取用户当前的授权状态 => 未同意授权位置时,引导用户打开设置界面,重新选择授权功能 => 允许后重新获取位置)
 */
export function doGetLocation(callback){
    isOpenSetting = false; // 是否打开设置界面
    // 获取用户当前的授权状态
    uni.getSetting({
        success: (settingRes) => {
            console.log(settingRes)
            console.log(isOpenSetting)
            // 判断用户未同意授权位置时,提示并引导用户去打开设置界面,用户可重新选择授权功能
            if (!isOpenSetting && typeof(settingRes.authSetting['scope.userLocation']) != 'undefined' && !settingRes.authSetting['scope.userLocation']) {
                uni.showModal({
                    title: '需要授权获取您的位置信息',
                    content: '你的位置信息将用于为您提供更合适您的服务',
                    success: (data) => {
                        if (data.confirm) {
                            isOpenSetting = true;
                            // 打开设置界面
                            uni.openSetting({
                                success: (response) => {
                                    if(response.authSetting['scope.userLocation']){
                                        console.log('重新授权获取位置信息-同意');
                                        // 重新获取定位
                                        getLocation((data)=>{
                                            callback({
                                                isOpenSetting:isOpenSetting,
                                                ...data
                                            })
                                        });
                                    }else{
                                        console.log('重新授权获取位置信息-未同意');
                                        callback({
                                            isOpenSetting:isOpenSetting,
                                            latitude : '',
                                            longitude : '',
                                        })
                                    }
                                },
                                fail:()=>{
                                    console.log('openSetting接口调用失败的回调函数');
                                }
                            })
                        } else if (data.cancel) {
                            console.log('showModal接口:用户点击取消未打开设置界面');
                            callback({
                                isOpenSetting:isOpenSetting,
                                latitude : '',
                                longitude : '',
                            })
                        }
                    },
                    fail: function(){
                        console.log('showModal接口:调用失败的回调函数');
                    }
                });
            }else{
                // 重新获取定位
                getLocation((data)=>{
                    callback({
                        isOpenSetting:isOpenSetting,
                        ...data
                    })
                });
            }
        }
    })
}
/**
 * 获取位置
 */
export function getLocation(callback){
    uni.getLocation({
        //type: 'wgs84',
        type: 'gcj02',
        success: (res)=>{
            console.log(res);
            callback({
                latitude : res.latitude,
                longitude : res.longitude,
            })
        },
        fail: (res)=>{
            console.log('用户拒绝授权获取位置信息,使用默认经纬度0 0');
            callback({
                latitude : '',
                longitude : '',
            })
        },complete: (res)=>{
            // console.log(res);
            // 根据位置数据更新页面数据
        }
    });
}

直接在页面中处理逻辑代码

需要获取位置代码处执行:

1
this.doGetLocation();

methods中处理方法:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
methods: {
    // ......
    // 获取定位,兼容用户拒绝授权及相关处理(获取用户当前的授权状态 => 未同意授权位置时,引导用户打开设置界面,重新选择授权功能 => 允许后重新获取位置)
    doGetLocation(){
        this.isOpenSetting = false; // 是否打开设置界面
        // 获取用户当前的授权状态
        uni.getSetting({
            success: (settingRes) => {
                console.log(settingRes)
                console.log(this.isOpenSetting)
                // 判断用户未同意授权位置时,提示并引导用户去打开设置界面,用户可重新选择授权功能
                if (!this.isOpenSetting && typeof(settingRes.authSetting['scope.userLocation']) != 'undefined' && !settingRes.authSetting['scope.userLocation']) {
                    uni.showModal({
                        title: '需要授权获取您的位置信息',
                        content: '你的位置信息将用于为您提供更合适您的服务',
                        success: (data) => {
                            if (data.confirm) {
                                this.isOpenSetting = true;
                                // 打开设置界面
                                uni.openSetting({
                                    success: (response) => {
                                        if(response.authSetting['scope.userLocation']){
                                            console.log('重新授权获取位置信息-同意');
                                            // 重新获取定位
                                            this.getLocation();
                                        }else{
                                            console.log('重新授权获取位置信息-未同意');
                                            this.doGetLocationAfter({
                                                latitude : '',
                                                longitude : '',
                                                isOpenSetting : this.isOpenSetting,
                                            })
                                        }
                                    },
                                    fail:()=>{
                                        console.log('openSetting接口调用失败的回调函数');
                                    }
                                })
                            } else if (data.cancel) {
                                console.log('showModal接口:用户点击取消未打开设置界面');
                                this.doGetLocationAfter({
                                    latitude : '',
                                    longitude : '',
                                    isOpenSetting : this.isOpenSetting,
                                })
                            }
                        },
                        fail: function(){
                            console.log('showModal接口:调用失败的回调函数');
                        }
                    });
                }else{
                    // 重新获取定位
                    this.getLocation();
                }
            }
        })
    },
    // 获取位置
    getLocation(){
        uni.getLocation({
            //type: 'wgs84',
            type: 'gcj02',
            success: (res)=>{
                console.log(res);
                this.doGetLocationAfter({
                    latitude : res.latitude,
                    longitude : res.longitude,
                    isOpenSetting : this.isOpenSetting,
                })
            },
            fail: (res)=>{
                console.log('用户拒绝授权获取位置信息,使用默认经纬度0 0');
                this.doGetLocationAfter({
                    latitude : '',
                    longitude : '',
                    isOpenSetting : this.isOpenSetting,
                })
                // 根据位置数据更新页面数据
            },complete: (res)=>{
                // console.log(res);
                // 根据位置数据更新页面数据
            }
        });
    },
    // 最终获取到的信息数据
    doGetLocationAfter(data){
        console.log(data)
        if(data.latitude != this.latitude || data.longitude != this.longitude){
            this.latitude = data.latitude;
            this.longitude = data.longitude;
            // 根据位置数据更新页面数据
        }else{
            console.log('位置信息无变化');
        }
        // 在这里处理最终获取到的信息数据
    },
    // ......
}

uniapp API文档

获取定位:

uni.getLocation(OBJECT) 获取当前的地理位置、速度

https://uniapp.dcloud.net.cn/api/location/location.html#getlocation

获取用户当前的授权状态:

uni.getSetting(OBJECT) 获取用户的当前设置。

https://uniapp.dcloud.net.cn/api/other/setting.html#getsetting

打开设置界面:

uni.openSetting(OBJECT) 调起客户端小程序设置界面,返回用户设置的操作结果。

https://uniapp.dcloud.net.cn/api/other/setting.html#opensetting

到此这篇关于uniapp中获取位置信息处理的文章就介绍到这了,更多相关uniapp中获取位置信息内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

蓄力AI

微信公众号搜索 “ 脚本之家 ” ,选择关注

程序猿的那些事、送书等活动等着你

原文链接:https://blog.csdn.net/qq_16494241/article/details/136352232

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若内容造成侵权/违法违规/事实不符,请将相关资料发送至 reterry123@163.com 进行投诉反馈,一经查实,立即处理!

相关文章

最新评论