【微信小程序】授权

1.授权相关概念

(1)为什么要授权
部分接口需要经过用户授权同意才能调用。我们把这些接口按使用范围分成多个 scope ,用户选择对 scope 来进行授权,当授权给一个 scope 之后,其对应的所有接口都可以直接使用。
(2)直接使用这些接口时的问题

  • 如果用户未接受或未拒绝过此权限,会弹窗询问用户,用户点击同意后方可调用接口
  • 如果用户已授权,可以直接调用接口
  • 如果用户已拒绝授权,则不会出现弹窗,而是直接进入接口 fail 回调,k开发时考虑兼容

(3)常见需要授权的接口
wx.getUserInfo: 用户信息
wx.getLocation, wx.chooseLocation 地理位置
wx.userLocationBackground 后台定位【不会弹框,通过调用wx.opensetting,打开设置页】
wx.chooseAddress 通讯地址
wx.saveImageToPhotosAlbum, wx.saveVideoToPhotosAlbum 保存到相册
还有手机号
(4)授权相关注意事项

  • 授权有效期
    一旦用户明确同意或拒绝过授权,其授权关系会记录在后台,直到用户主动删除小程序。
  • 如何获取用户当前的授权状态
    调用wx.getSetting接口
  • 如何引导用户开启授权
    方法一:调用 wx.openSetting 打开设置界面,引导用户开启授权。
    方法二:用户可以在小程序设置界面(「右上角」 - 「关于」 - 「右上角」 - 「设置」)中控制对该小程序的授权状态。
  • 提前发起授权请求
    为了避免未授权时直接调用接口失败,可以提前发起授权请求(预授权),用户授权成功后再取调用相关接口。主要是通过调用wx.authorize接口,调用后会立刻弹窗询问用户是否同意授权小程序使用某项功能或获取用户的某些数据,但不会实际调用对应接口。如果用户之前已经同意授权,则不会出现弹窗,直接返回成功

2. 授权方式总结

小程序调起授权弹框的方式主要三种:

2.1直接使用相关api时自动调起

例如调用wx.chooseAddress(),只要你之前没有授权或拒绝过(删除小程序授权关系记录就没有了),就会出现允许调用通讯地址授权窗口;

2.2提前授权申请

流程:获取所有授权状态----如果不存在---再调用授权接口---如果授权成功---调用最终API接口

// 可以通过 wx.getSetting 先查询一下用户是否授权了 "scope.record" 这个 scope
wx.getSetting({
  success(res) {
    if (!res.authSetting['scope.record']) {
      wx.authorize({
        scope: 'scope.record',
        success () {
          // 用户已经同意小程序使用录音功能,后续调用 wx.startRecord 接口不会弹窗询问
          wx.startRecord()
        }
      })
    }
  }
})

2.3三是组件方式

例如使用button按钮,像获取用户数据,手机号等,让用户主动触发。

<button open-type="openSetting" bindopensetting="callback">打开设置页</button>
<button open-type="getUserInfo" bindgetuserinfo='getInfo'>获取用户信息</button>

要注意的重点:

  • 用button触发的授权方式可以无限调起授权窗口(只要之前没成功就能无限调起),而用api触发的只能调起一次(无论成功或失败)
  • 有些接口只能用组件方式触发授权
    wx.getUserInfo(不能用于授权,只能是获取用户信息)
  • wx.openSetting(跳转设置页),只支持按钮方式打开设置引导授权页面。

3.授权的流程

总结完整的授权流程,以获取用户信息为例

<!-- 授权按钮-->
<button open-type="getUserInfo" wx:if="{{isShow}}" bindgetuserinfo="bindGetUserInfo"></button>
// 点击授权按钮,返回的信息
bindGetUserInfo: function(e) {
    console.log(e.detail.userInfo)
},
// 代码中调用接口获取用户信息
getUserInfo:function(){
    wx.getSetting({
        success: function(res) {
            // 隐藏授权 button
            ...
            // 查看是否授权
           if (res.authSetting['scope.userInfo']) {
              // 已经授权,可以直接调用 getUserInfo 获取用户信息
              wx.getUserInfo({
                 success: function(res) {
                     console.log(res)
                 },
                 fail: function(error) {
                     console.log(error
                 }
              });
            } else {
               wx.authorize({})或者跳转至授权页使用button的open-type进行授权
               ...
            }
        }
    });
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容