官方描述说明
部分接口需要经过用户授权统一才能调用。我们把这些接口按使用范围分成多个scope,用户选择对scope进行授权,当授权给一个scope之后,其对应的所有接口都可以直接使用。
此类接口调用时:
- 如果用户未接受或拒绝过此权限,会弹窗询问用户,用户点击同意后方可调用接口;
- 如果用户已授权,可以直接调用接口;
- 如果用户已拒绝授权,则不会出现弹窗,而是直接进入接口 fail 回调。请开发者兼容用户拒绝授权的场景。
获取用户授权设置
开发者可以使用 wx.getSetting 获取用户当前的授权状态。
打开设置界面
用户可以在小程序设置界面(「右上角」 - 「关于」 - 「右上角」 - 「设置」)中控制对该小程序的授权状态。
开发者可以调用 wx.openSetting 打开设置界面,引导用户开启授权。
提前发起授权请求
开发者可以使用 wx.authorize 在调用需授权 API 之前,提前向用户发起授权请求。
scope | 对应接口 | 描述 |
---|---|---|
scope.userInfo | wx.getUserInfo | 用户信息 |
scope.userLocation | wx.getLocation | 地理位置 |
scope.werun | wx.getWeRunData | 微信运动步数 |
scope.writePhotosAlbum | ws.saveImageToPhotosAlbum | 保存到相册 |
scope.WxFriendInteraction | 对应开放数据域内的 wx.对应开放数据域内的 wx.getFriendCloudStorage 、wx.getGroupCloudStorage、wx.getGrouplnfo 、wxgetPotentialFriendList、wx.getUserCloudStorageKeys 、wx.getUserlnfo、GameServerManagergetFriendsStateData 接口,以及主城内的 wx.getUserlnteractiveStorage 接口 | 是否授权使用你的微信朋友信息 |
授权有效期
一旦用户明确同意或拒绝过授权,其授权关系会记录在后台,直到用户主动删除小程序。
最佳实践
在真正需要使用授权接口时,才向用户发起授权申请,并在授权申请中说明清楚要使用该功能的理由。
注意事项
wx.authorize({scope: “scope.userInfo”}),不会弹出授权窗口,请使用 wx.createUserInfoButton
需要授权 scope.userLocation 时必须配置地理位置用途说明。
2、具体权限接口介绍
2.1 wx.authorize()
官方说明 wx.authorize
开放接口 / 授权 / wx.authorize
wx.authorize(Object object)
基础库 1.2.0 开始支持,版本低需做兼容处理。
以Promise 风格 调用:支持
微信 Windows 版:支持
相关文档:授权
功能描述
提前向用户发起授权请求。调用后会立刻弹窗询问用户是否同意授权小程序使用某项功能或获取用户的某些数据,但不会实际调用对应接口。如果用户之前已经同意授权,则不会出现弹窗,直接返回成功。更多用法详见用户授权。
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
scope | string | 是 | 需要获取权限的 scope,详见 scope 列表 | |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
注意事项
- 小游戏内使用 wx.authorize({scope: “scope.userInfo”}),不会弹出授权窗口,请使用 wx.createUserInfoButton
- 需要授权 scope.userLocation 时必须配置地理位置用途说明。
示例代码
// 可以通过 wx.getSetting 先查询一下用户是否授权了 "scope.record" 这个 scope
wx.getSetting({
success(res) {
if (!res.authSetting['scope.record']) {
wx.authorize({
scope: 'scope.record',
success () {
// 用户已经同意小程序使用录音功能,后续调用 wx.startRecord 接口不会弹窗询问
ws.startRecord()
}
})
}
}
})
2.2 wx.openSetting()
wx.openSetting(Object object)
基础库 1.1.0 开始支持,版本低需做兼容处理。
以Promise 风格 调用:支持
微信 Mac 版:支持
相关文档:授权
功能描述
调起客户端小程序设置界面,返回用户设置的操作结果。设置界面只会出现小程序已经向用户请求过的权限。
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
withSubscriptioins | Boolean | false | 否 | 是否同时获取用户订阅消息的订阅状态,默认不获取。注意:withSubscriptioins只返回用户勾选过订阅面板中的“总是保持以上选择,不再询问”的订阅消息。 |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
Object.success 回调函数
参数
Object res
属性 | 类型 | 说明 | 最低版本 |
---|---|---|---|
authSetting | AuthSetting | 用户授权结果 | |
subscriptionsSetting | SubscriptionsSetting | 用户订阅消息设置,接口参数 withSubscriptions 值为 true 时才会返回 | 2.10.3 |
- 注意:2.3.0版本开始,用户发生点击行为后,才可以跳转打开设置页,管理授权信息。
示例代码
wx.openSetting({
success(res) {
console.log(res.authSetting)
// res.authSetting = {
// "scope.userInfo":true,
// "scope.userLocation": true
// }
}
})
3 、权限申请方式
- 通过 button 的 open-type 方式来获取相应的权限及信息。
- 通过 wx.authorize()和wx.openSetting() 两个接口来申请相应的权限。
特别注意的是:需要授权 scope.userLocation、scope.userLocationBackground 时必须配置地理位置用途说明
通过button申请权限
通过button获取权限对于开发者来说相对简单一些,开发者只需要绑定相应的回调函数即可,权限申请的成功和失败都可以在回调函数中处理。
其实我们可以把通过button申请权限的方式当作普通的信息获取接口,只不过这个接口必须通过button组件来调用而已。
通过wx.authorize()来申请权限
通过wx.authorize()来申请权限的方式是比较繁琐的。因为它的状态比较多,大致可分为:
- 如果用户未接受或拒绝过此权限,会弹窗询问用户,用户点击同意后方可调用接口;
- 如果用户已授权,可以直接调用接口;
- 如果用户已拒绝授权,则不会出现弹窗,而是直接进入接口 fail 回调。请开发者兼容用户拒绝授权的场景
针对这三种状态,开发者的处理方式也有所不同。
- 用户未接受或拒绝过此权限,会弹窗询问用户,用户点击同意 —— 可调用相应接口。
- 用户未接受或拒绝过此权限,会弹窗询问用户,用户点击拒绝 —— 打开设置页面。
- 如果用户已授权 —— 可调用相应接口。
- 用户已拒绝授权 —— 打开设置页面。
上述情况的2/4是需要开发者结合 wx.openSetting() 来帮助用户进行二次授权的。
就是这个 openSetting 打开设置页面的过程让开发者比较抓狂。
2.3.0 版本开始,用户发生点击行为后,才可以跳转打开设置页。
也就是说 openSetting 只能通过 button 组件和点击(bindtap)的回调函数里来调用。
然而我们在申请权限的时候无法保证用户一定会在第一次申请的时候同意,所以一定是需要配合openSetting来使用的。
那我们在每个调用openSetting的地方都加一个button也是很不别扭的。
当下来说我们最好的处理方案就是把wx.authorize()和wx.openSetting()结合起来使用,并把他们放在一个bindtap/catchtap(或其他手势事件)的回调函数里。
接下来我们重点来整合一下这种方式的权限处理。
4、权限申请整合代码
4.1 参考工具类代码
以下是整合的工具类代码,我们暂时命名其为 authorizer.js,可直接复制使用。
const authsName = {
“scope.userInfo”: “用户信息”,// 请用button获取该信息
“scope.userLocation”: “地理位置”,
“scope.userLocationBackground”: “后台定位”,
“scope.address”: “通讯地址”,
“scope.invoiceTitle”: “发票抬头”,
“scope.invoice”: “获取发票”,
“scope.werun”: “微信运动步数”,
“scope.record”: “录音功能”,
“scope.writePhotosAlbum”: “保存到相册”,
“scope.camera”: “摄像头”,
}
var scope = null;
var success = null;
var fail = null;
var denyBack = null;
var deniedFun = null;
/**
- 申请某个权限
- _scope 权限名称
- _success 成功回调
- _fail 失败回调
- _denyBack 申请权限时用户 拒绝 后的回调
- _deniedFun 之前申请过该权限但被拒绝了,该情况下调用此函数
*/
function authorize(_scope, _success, _fail, _denyBack, _deniedFun) {
resetData();
scope = _scope;
success = _success;
fail = _fail;
denyBack = _denyBack;
deniedFun = _deniedFun;
if (!scope) {
return;
}
// 判断权限状态
wx.getSetting({
success: function(res) {
let currentScope = res.authSetting[scope];
if (currentScope == undefined || currentScope == null) {
// 之前没有申请或该权限
wx.authorize({
scope: scope,
success: function(res) {
authSuccess(res);
},
fail: function(err) {
authDeny();
}
});
} else if (currentScope == false) {
// 之前申请过该权限但被拒绝了, 如果配置 deniedFun 函数,则有执行 deniedFun 方法,
// 由调用者决定改中情况下如何处理。
if (authDenied()) {
return;
}
// 如果没有配置 deniedFun 函数,走默认逻辑,打开设置界面
wx.showModal({
title: '权限申请',
content: '点击 “确定” 按钮,打开 “' + authsName[scope] + '” 的权限设置界面',
cancelText: '取消',
confirmText: '确定',
success(res) {
if (res.confirm) {
wx.openSetting({
success: function(res) {
let cScope = res.authSetting[scope];
if (cScope) {
authSuccess();
} else {
authFail();
}
},
fail: function(res) {
authFail();
}
});
}
}
});
} else {
// 已经获得该权限
authSuccess();
}
},
fail: function() {
authFail();
}
});
}
/**
* 权限申请成功
*/
function authSuccess(res) {
if (success && typeof success == 'function') {
success(res);
}
resetData();
}
/**
* 权限申请失败
*/
function authFail() {
if (fail && typeof fail == 'function') {
fail();
}
resetData();
}
/**
* 拒绝使用该权限
*/
function authDeny() {
if (denyBack && typeof denyBack == 'function') {
denyBack();
}
resetData();
}
/**
* 之前申请过该权限但被拒绝了
*/
function authDenied() {
if (deniedFun && typeof deniedFun == 'function') {
deniedFun();
resetData();
return true;
} else {
return false;
}
}
/**
* 重置参数
*/
function resetData() {
scope = null;
success = null;
fail = null;
denyBack = null;
deniedFun = null;
}
module.exports = {
authorize: authorize,
}
工具类的使用
wxml代码:
<view bindtap="authApply">权限申请</view>
js代码:
/**
* 权限申请--微信步数
*/
authApply(e) {
authorizer.authorize("scope.werun", function(res) {
console.log('success', res);
wx.getWeRunData({success: function(res){
console.log('WeRunData', res)
}});
}, function(err) {
console.log('denyback', err);
}, function(err) {
console.log('deniedBack', err);
});
},
4.2 实际代码实现
data:{
authScope:"scope.werun",//要申请的权限
},
/**
* 申请权限
* _scope 权限名称
* _authSuccess 成功回调
* _authFail 失败回调
* _authDeny 申请权限时用户 拒绝 后的回调
* _authDenied 之前申请过该权限但被拒绝了,该情况下调用此函数
*/
//授权成功
authSuccess(){
let that = this
console.log("授权成功")
that.setData({
hasWerun:true
})
that.getUserRun()
},
//授权失败
authFail(){
console.log("授权失败")
wx.showToast({
title: '授权失败',
icon: 'none',
duration: 1000
})
},
//拒绝授权
authDeny(){
console.log("authorize调用失败,引导重新吊起")
wx.showToast({
title: '您未授权微信运动 请点击右上角设置 进入列表手动授权',
icon: 'none',
duration: 3000
})
},
//已被拒绝授权过的权限,重新吊起
authDenied(){
console.log("currentScope == false 已被拒绝授权过的权限,引导重新吊起")
wx.showToast({
title: '您未授权微信运动 请点击右上角设置 进入列表重新授权',
icon: 'none',
duration: 3000
})
},
authApply:function(){
let that = this
let scope = that.data.authScope
if (!scope) {
return;
}
// 判断权限状态
wx.getSetting({
success: function(res) {
console.log("当前权限列表")
console.log(res)
let currentScope = res.authSetting[scope];
if (currentScope == undefined || currentScope == null) {
// 之前没有申请或该权限
console.log("之前没有申请或该权限")
wx.authorize({
scope: scope,
success: function() {
that.authSuccess();
},
fail: function(err) {
that.authDeny();
}
});
} else if (currentScope == false) {
// 之前申请过该权限但被拒绝了
that.authDenied()
return;
} else {
// 已经获得该权限
that.authSuccess();
}
},
fail: function() {
that.authFail();
}
});
},
//设置按钮绑定权限列表
getOpenSetting: function () {
let that = this
wx.openSetting({
success(res) {
if (res.authSetting[that.data.authScope]) {
// 用户在设置页面开启权限后,重新授权成功
// 可以调用相应的 API 接口
that.setData({
hasWerun:true
})
console.log("openSetting已获取到授权")
that.authSuccess()
} else {
// 用户在设置页面未开启权限,授权失败
that.authFail()
}
},
fail() {
console.log("openSetting拉起失败")
// 调用 wx.openSetting 接口失败
that.authFail()
}
})
},
wxml
<text class="info-text" bindtap="getOpenSetting">权限</text>
总结
微信小程序的权限申请有两种方式;
分析了一下wx.authorize这种方式发生的几种情况以及相应的处理;
整理了一份wx.authorize使用的通用方法,且此方法须在某个手势事件的回调函数中。
Comments | 0 条评论