【微信小程序用户信息获取全攻略 | 逻辑详解+代码避坑指南 】


一、用户授权基础逻辑
  1. 静默授权获取 OpenID

    • 通过 wx.login() 获取临时 code(5分钟有效),传给后端。
    • 后端用 code + AppSecret 请求微信接口,换取 openidsession_key
    • 作用:建立用户唯一标识,无感登录,无需弹窗!
  2. 主动授权获取用户详情(头像、昵称等)

    • 必须用户主动触发!使用
    • 用户点击后触发 bindgetuserinfo 事件,返回加密数据 encryptedData 和初始向量 iv
    • 注意:强制首页弹窗授权会被微信审核拒绝❌。

二、前端代码实例
  1. 检查授权状态
wx.getSetting({  
  success: (res) => {  
    if (res.authSetting['scope.userInfo']) {  
      // 已授权,直接调用 wx.getUserInfo  
    } else {  
      // 显示授权按钮  
    }  
  }  
});  
  1. 授权按钮与回调
  
<button wx:if="{{!isAuth}}" open-type="getUserInfo" bindgetuserinfo="onAuth">授权登录button>  
// JS  
onAuth(e) {  
  if (e.detail.userInfo) {  
    // 用户同意授权  
    const { encryptedData, iv } = e.detail;  
    // 发送给后端解密  
  } else {  
    // 用户拒绝,提示引导重新授权  
  }  
}  

三、后端解密处理(Java 示例)

关键:用 session_key 解密 encryptedData

public String wxDecrypt(String encryptedData, String sessionKey, String iv) {  
  byte[] encData = Base64.decode(encryptedData);  
  byte[] ivData = Base64.decode(iv);  
  byte[] key = Base64.decode(sessionKey);  
  // AES-128-CBC 解密  
  Cipher cipher = Cipher.getInstance("AES/CBC/PKCS5Padding");  
  cipher.init(Cipher.DECRYPT_MODE, new SecretKeySpec(key, "AES"), new IvParameterSpec(ivData));  
  return new String(cipher.doFinal(encData), "UTF-8");  
}  

避坑

  • session_key 可能过期(需重新 wx.login 获取)。
  • 解密失败常见于 session_key 不匹配或 Base64 解码错误!

四、全局状态管理(MobX 方案)

目标:用户信息全局共享,避免重复请求。

// store.js  
import { observable, action } from 'mobx-miniprogram';  

export const store = observable({  
  userInfo: {},  
  setUserInfo: action(function(info) {  
    this.userInfo = info;  
    wx.setStorageSync('user', JSON.stringify(info)); // 持久化  
  }),  
  // 从缓存初始化  
  initUser() {  
    const cache = wx.getStorageSync('user');  
    if (cache) this.userInfo = JSON.parse(cache);  
  }  
});  

使用场景

  • 个人页展示用户头像昵称;
  • 订单页关联用户身份。

五、高频问题解答
  1. 用户拒绝授权怎么办?

    • 引导跳转到设置页:wx.openSetting()
    • 关键功能入口再次提示授权(如“点击收藏需先授权”)。
  2. UnionID 如何获取?

    • 条件:小程序绑定微信开放平台 + 用户同主体公众号已授权。
    • 后端用 codesession_key 时,微信自动返回 unionid(无需用户授权)!
  3. 为何不推荐首页强制授权?

    • 用户体验差!微信明确禁止❌,可能导致审核不通过。

总结最佳实践
  1. 静默登录优先:先用 openid 建立用户体系。
  2. 按需授权:在用户触发敏感操作时再申请详细信息。
  3. 全局状态+本地缓存:用 MobX 或 Vuex 管理用户数据。
  4. 后端解密防篡改:校验签名 + 异常捕获(避免 BadPaddingException)。

代码全开源:[Github 链接] | 更多实战案例点我主页
#微信小程序 #用户授权 #前端开发 #实战教程

你可能感兴趣的:(小程序,微信小程序,前端)