欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

微信小程序获取用户信息流程实例

程序员文章站 2022-04-09 10:50:39
授权部分接口需要经过用户授权同意才能调用。我们把这些接口按使用范围分成多个scope,用户选择对scope来进行授权,当授权给一个scope之后,其对应的所有接口都可以直接使用。此类接口调用时:如果用户未接受或拒绝过此权限,会弹窗询问用户,用户点击同意后方可调用接口;如果用户已授权,可以直接调用接口;如果用户已拒绝授权,则不会出现弹窗,而是直接进入接口 fail 回调。请开发者兼容用户拒绝授权的场景。获取用户授权设置开发者可以使用wx.getSetting获取用户......

授权

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

此类接口调用时:

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

获取用户授权设置

开发者可以使用 wx.getSetting 获取用户当前的授权状态
只要授权了,才能使用某种方式(button按钮,有些可以通过api)来进行获取

第1次获取用户信息,必须通过button按钮的open-type来 引用用户进行同意授权

如果用户允许 ,则代表授权成功。

如果用户同意授权,那么以后,就可以通过wx.getUserInfo方法获取到用户信息。

示例

<button open-type="getUserInfo" bindgetuserinfo="_getUserInfo">获取用户信息</button>
<view wx:if="{{userinfo !== ''}}">
  <image src="{{userinfo.avatarUrl}}" />
  <view>国籍:{{userinfo.country}}</view>
  <view>姓名:{{userinfo.nickName}}</view>
</view>
// pages/03getuserinfo/03getuserinfo.js
Page({
  data: {
    userinfo: ''
  },
  onLoad() {
    // 先检查用户是否授权用户信息权限
    // 若没有授权 跳转授权页
    // 授权了 直接获取用户信息
    // 检测是否授权,应该写在app.js的onLaunch中
    wx.getSetting({
      success:(res) =>{
        console.log(res)
        // authSetting ->{scope.userInfo:true}
        if (res.authSetting['scope.userInfo']) {
          console.log("用户已经授权")
          wx.getUserInfo({
            success:(res)=> {
              this.setData({
                userinfo: res.userInfo
              })
              console.log(res.userInfo);
            },
            fail(err) {
              console.log(err)
            }
          })
        } else {
          console.log("未授权,跳转授权")
        }
      }
    })
    
    // 官方api修改 调用此接口,不在弹出
    // wx.getUserInfo({
    //   success(res){
    //     console.log(res.userInfo);
    //   },
    //   fail(err){
    //     console.log(err)
    //   }
    // })
  },
  _getUserInfo(e) {
    console.log(e.detail.userInfo);
    this.setData({
      userinfo: e.detail.userInfo
    })
  }
})

微信小程序获取用户信息流程实例

 

本文地址:https://blog.csdn.net/JackieDYH/article/details/107349040