WeChat applet obtains location permission and the user refuses authorization and then redirects the user to authorize

WeChat applet obtains location permission and the user refuses authorization and then redirects the user to authorize

Solve the problem:

​ The WeChat applet obtains location permissions. The user clicks Allow and then directly selects a point on the map, or the user refuses authorization and guides the user to the settings page for re-authorization. If the code is required, slide directly to the bottom of the page.

Calling method:

1. Use to uni.getSettingobtain the user's current settings

2. Use to uni.authorizeinitiate authorization requests to users in advance. After the call is made, a pop-up window will immediately ask the user whether they agree to authorize the applet to use a certain function or obtain some of the user's data, but the corresponding interface will not actually be called. If the user has previously agreed to the authorization, no pop-up window will appear and success will be returned directly. If the user has previously refused authorization, this interface will directly enter the failure callback. It is generally used uni.getSettingwithuni.openSetting

3. Use to uni.openSettingcall up the client applet setting interface and return the operation results set by the user.

4.Use to uni.chooseLocationopen the map and select the location

Solutions:

Use uni.getSettingto obtain setting information-user permission list:

If the user is authorized, call directly to uni.chooseLocationopen the map and select the location;

If it has not been authorized yet, use to uni.authorizeinitiate authorization

If the user clicks Allow, call the select location information function to select the location.

If the user clicks Deny or the user has previously clicked Deny Authorization, open the user settings modal box.

Use to uni.openSettingcall up the client applet setting interface

The user clicks Allow in the settings and calls the select location information function.

When the user clicks Not Allowed in the settings, the authorization denial message is displayed.

Complete code:

Page tags

<!-- 点击按钮获取地图位置信息 -->
<view @click="getSetting">{
   
   { address }}</view>


<!-- 为保持页面modal弹框UI样式一致，使用第三方uView组件 -->
<u-modal v-model="isShowOpen" :content="content" @confirm="openSetting"  :show-cancel-button="true"></u-modal>

method:

export default{
    
    
    data(){
    
    
        address: '点击添加地址（必填）',
        isShowOpen:false,//是否打开设置
		content:'检测到您没打开获取位置功能权限，是否去设置打开？',
    },
    methods:{
    
    
            // 1.获取设置信息-用户权限列表
			getSetting() {
    
    
				const that = this;
				uni.getSetting({
    
    
					success: res => {
    
    
						console.log('用户权限列表:', res.authSetting)
						if (res.authSetting['scope.userLocation']) {
    
    
							console.log('已授权userLocation')
							// 选择位置信息
							that.chooseLocation();
						} else {
    
    
							console.log('用户未授权userLocation')
                            //2.用户第一次进来发起授权
							uni.authorize({
    
    
								scope: 'scope.userLocation', 
								success: (res1) => {
    
    
									console.log("允许授权", res1);
									// 3.如果用户点击了允许，调用选择位置信息函数选择位置
									that.chooseLocation();
								},
								fail: (err1) => {
    
    
									console.log("拒绝授权", err1);
                                    // 3.如果用户点击了拒绝或者用户之前点击过拒绝授权，打开用户设置模态框
									that.isShowOpen = true;
								},
							})
						}
					}
				})
			},
                
            // 4.打开设置
			openSetting(){
    
    
				const that = this;
				uni.openSetting({
    
    
					success: (res) => {
    
    
						console.log("打开设置成功", res);
						if (res.authSetting['scope.userLocation']) {
    
    
							console.log('成功授权userLocation')
							// 5.用户在设置中点击了允许，调用选择位置信息函数
							that.chooseLocation();
						} else {
    
    
							console.log('用户未授权userLocation')
                            // 5.用户在设置中点击了不允许，展示拒绝授权信息
							uni.showToast({
    
    
								title: '你拒绝了授权，无法操作内容',
								icon: 'none',
								duration: 3000,
							})
						}
					},
					fail: (err) => {
    
    
						console.log("打开设置失败", err)
					}
				})
			},


			// 选择位置信息
			chooseLocation() {
    
    
				uni.chooseLocation({
    
    
					success: (res) => {
    
    
						console.log("选择位置信息", res)
						this.address = res.address + res.name
						this.lat = res.latitude
						this.lng = res.longitude
					},
					fail(err) {
    
    
						console.log("选择位置信息失败或者点击了取消按钮", err)
					},
				})
			},
                
            
    }
}