zoukankan      html  css  js  c++  java
  • 微信小程序之授权 wx.authorize

    一、 wx.authorize(Object object)

    提前向用户发起授权请求。调用后会立刻弹窗询问用户是否同意授权小程序使用某项功能或获取用户的某些数据,但不会实际调用对应接口。如果用户之前已经同意授权,则不会出现弹窗,直接返回成功。

    • 用户可以授权的
      scope 包括:
    scope 对应接口 描述
    scope.userInfo wx.getUserInfo 用户信息
    scope.userLocation wx.getLocation, wx.chooseLocation, wx.openLocation 地理位置
    scope.address wx.chooseAddress 通讯地址
    scope.invoiceTitle wx.chooseInvoiceTitle 发票抬头
    scope.invoice wx.chooseInvoice 获取发票
    scope.werun wx.getWeRunData 微信运动步数
    scope.record wx.startRecord 录音功能
    scope.writePhotosAlbum wx.saveImageToPhotosAlbum, wx.saveVideoToPhotosAlbum 保存到相册
    scope.camera 组件 摄像头

    注意:上述接口中,wx.authorize({scope: "scope.userInfo"}),无法弹出授权窗口,使用 button 组件,并将 open-type 指定为 getUserInfo 类型,获取用户基本信息。https://developers.weixin.qq.com/community/develop/doc/0000a26e1aca6012e896a517556c01

    二、 wx.authorize 用法

    wx.getSetting({
      success (res) {
        console.log(res.authSetting)
      }
    })
    

    如果用户已经授权过 地理位置,上面代码则会返回:"scope.userInfo": true

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

    三、 注意

    • 微信中使用 wx.getUserInfo 接口直接弹出授权框的开发方式将逐步不再支持。
    • 所以在用户未授权的情况下,在 onload 函数中使用 wx.getUserInfo 是默认失败的, 如下:
    onLoad: function (options) { 
        // 只有在用户已经授权后,才能在 onload 函数中获取到用户信息
        // 所以,下面通过 wx.getSetting 检查用户是否已经授权,
        // 如果没有授权,则停止执行
        // 如果已经授权,则继续执行success 
        wx.getSetting({
          success (res){
            if (res.authSetting['scope.userInfo']) {
              // 已经授权,可以直接调用 getUserInfo 获取头像昵称
              wx.getUserInfo({
                success: function(res) { 
                  console.log(res.userInfo)
                }
              })
            }
          }
        })
    }, 
    
    • 建议使用 button 组件,并将 open-type 指定为 getUserInfo 类型,通过点击事件获取用户基本信息。

    • 代码如下:

    wxml:

     <button open-type="getUserInfo" bindgetuserinfo='getUser'>获取用户信息(授权登录)</button>
    

    js:

    getUser(e) { 
        console.log(e)
        wx.getUserInfo({
            success: (res) => {
                console.log(res)
                this.setData({
                    userInfo: res.userInfo
                });
            }
        })
    }
    
  • 相关阅读:
    echart图表--雷达图表的动态数据max
    访问github个人博客时*.github.io 拒绝了我们的连接请求,错误码403
    js数组对象去重
    关于vuex的demo
    原生js实现 正方体旋转
    实现分页加载,加载更多(按钮类型),滚动加载的方式
    this指向
    记录三段式布局
    vue 动态路由 和 路由模式
    vue cli 配置反向代理
  • 原文地址:https://www.cnblogs.com/cckui/p/10000738.html
Copyright © 2011-2022 走看看