uniapp实现微信小程序手机号授权
首先要进行手机号授权，app_id必须是企业类型的
一般手机号之前我们会先进行一次静默授权，获取code
首先看静默授权
我通常就封装成一个方法
login.js
export function login(){
uni.login({
success: res => {
console.log(res)
uni.request({
url: '',
method: "POST",
header: {
},
data: {
code: res.code
},
success: result => {
console.log(result)
uni.showToast({
title: result.data.msg,
icon: "none"
})
if(result.data.status =='success'){
console.log(result.data.status)
uni.reLaunch({
url:'/pages/index/index'
})
uni.setStorageSync('token',result.data.token)
}else{
uni.login({
success:res=>{
uni.setStorageSync('code',res.code)
}
})
}
},
fail: (err) => {
}
})
}
})
}
啥意思呢？
上面的result.data.status =='success,这是后台返回的一个状态码，意思就是我们手机号授权过，就不用进行第二次授权了，直接跳到主页面
并且后台会返回一个token,然后我们存在本地缓存里面
这个需要放在我们的页面路由里面，因为这是我们一进页面就要判断的，一般放在APP.vue中的onLaunch里面
接下来就是手机号授权页面了，因为微信现在不允许一进页面就弹出授权框，必须通过button点击才行
methods
export default {
methods: {
onGetPhoneNumber(e) {
console.log(e)
uni.showLoading({
title: '请等待',
mask: false
})
const encryptedData = e.detail.encryptedData
const iv = e.detail.iv
if(e.detail.errMsg =="getPhoneNumber:ok"){
this.login(encryptedData, iv)
}else{
uni.showToast({
title: '请重新获取',
icon: "none"
})
}
},
login(encryptedData, iv) {
uni.hideLoading()
uni.request({
url: '',
method: "POST",
header: {
},
data: {
code: uni.getStorageSync('code'),
encryptedData: encryptedData,
iv: iv
},
success: result => {
if (result.data.status == 'success') {
uni.showToast({
title: '授权成功',
icon: "none"
})
uni.reLaunch({
url:'../index/index'
})
uni.setStorageSync('token', result.data.token)
} else {
uni.hideLoading();
uni.showToast({
title: result.data.msg,
icon: "none"
})
}
},
fail: (err) => {
uni.showToast({
title: err.data.msg,
icon: "none"
})
}
})
}
},
}
手机号授权传递三个参数，code，encryptedData，iv
code在静默授权已经存到本地了，encryptedData和iv我们通过onGetPhoneNumber已经获取了，当我们点击允许时候就保存token到本地，同时跳转到主页面，拒绝就弹出请重新获取
一般还可能存在一个登陆过期的问题，状态码一般为403吧，一般就写在封装的网络请求里面
if(res[1].statusCode ==403){
uni.showToast({
icon:'none',
title: '登陆过期,请重新授权登录',
duration: 3000
});
uni.reLaunch({
url:'/pages/login/login',
})
login()
}
如果res[1].statusCode ==403，就让它返回login页面重新授权，然后我们调用login方法，让它重新执行一次，然后自动再跳转到主页面即可