微信小程序生态3—微信小程序用户认证流程设计

一、微信用户认证

微信APP是我们微信小程序流量的入口,能否获取到当前使用小程序的用户信息对我们来讲很重要,微信公众平台对此提供了一个单点登录的解决方案,如下图:

用户登录微信,进入小程序后,小程序会对当前的用户生成一个openid,不同的小程序对同一个用户生成的openid也是不一样的,这个要注意。

二、获取微信小程序用户openid

1. 登录时序图

首先贴一张完整逻辑的时序图,大家可以看看。

2. 获取小程序的AppID和AppSecret

3. 微信获取登录用户的openId

(1)小程序端调用wx.login()

css 复制代码
{
    "code": "192038921jkjKHWJKEB21",
    "msg": "login:ok"
}

wx.login()会返回一个临时授权码,将获取到的临时授权码传个后端。

(2)使用临时授权码调用微信接口查询用户信息

接口为:

api.weixin.qq.com/sns/jscode2...

参数说明如下:

markdown 复制代码
/**
 * auth.code2Session
 * https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/login/auth.code2Session.html
 * 请求参数   属性        类型       默认值 必填  说明
 * @param   appId       string                是    小程序 appId
 * @param   secret      string                是    小程序 appSecret
 * @param   jsCode      string                是    登录时获取的 code
 *          grantType   string                是    授权类型,此处只需填写 authorization_code
 * 返回值
 * @return  JSON 数据包
 *           属性         类型       说明
 *          openid      string      用户唯一标识
 *          session_key     string      会话密钥
 *          unionid         string      用户在开放平台的唯一标识符,在满足 UnionID 下发条件的情况下会返回,详见 UnionID 机制说明。
 *          errcode         number      错误码
 *          errmsg      string      错误信息
 *
 *          errcode 的合法值
 *
 *          值           说明                         最低版本
 *          -1          系统繁忙,此时请开发者稍候再试
 *          0           请求成功
 *          40029       code 无效
 *          45011       频率限制,每个用户每分钟100次
 */
JSONObject authCode2Session(String appId, String secret, String jsCode);

WeChatServiceImpl.java

typescript 复制代码
import com.alibaba.dc.basic.ability.service.WeChatService;
import com.alibaba.fastjson.JSONObject;
import lombok.extern.slf4j.Slf4j;
import org.apache.commons.lang3.StringUtils;
import org.springframework.http.*;
import org.springframework.stereotype.Service;
import org.springframework.web.client.RestTemplate;
import javax.annotation.Resource;

@Service
@Slf4j
public class WeChatServiceImpl implements WeChatService {

    @Resource(name = "restTemplateOfBasicAbility")
    private RestTemplate restTemplate;

    @Override
    public JSONObject authCode2Session(String appId, String secret, String jsCode) {
        String url = "https://api.weixin.qq.com/sns/jscode2session?appid=" + appId + "&secret=" + secret + "&js_code=" + jsCode + "&grant_type=authorization_code";
        String str = restTemplate.getForObject(url, String.class);
        log.info("api/wx-mini/getSessionKey:" + str);
        if (StringUtils.isEmpty(str)) {
            return null;
        } else {
            return JSONObject.parseObject(str);
        }
    }
}

服务端使用临时授权码发起api.weixin.qq.com/sns/jscode2... 接口,就可以查询到用户在当前小程序下的openid了。

三、微信小程序获取用户手机号授权以及解码

1. 小程序代码

授权手机号必须让用户自己手动触发,这里用一个按钮的点击事件触发getPhoneNumber方法。

html 复制代码
<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">手机号码授权</button>
js 复制代码
getPhoneNumber: function(e) {     
    console.log(e.detail.errMsg)     
    console.log(e.detail.iv)     
    console.log(e.detail.encryptedData)     
    if (e.detail.errMsg == 'getPhoneNumber:fail user deny'){    
      wx.showModal({    
          title: '提示',    
          showCancel: false,    
          content: '未授权',    
          success: function (res) { }    
      })    
    } else {    
      wx.showModal({    
          title: '提示',    
          showCancel: false,    
          content: '同意授权',    
          success: function (res) { }    
      })    
    }    
  }    

2. 后端解码代码(旧版)

java 复制代码
import lombok.extern.slf4j.Slf4j;
import org.bouncycastle.jce.provider.BouncyCastleProvider;
import org.bouncycastle.util.Arrays;
import org.bouncycastle.util.encoders.Base64;

import javax.crypto.Cipher;
import javax.crypto.spec.IvParameterSpec;
import javax.crypto.spec.SecretKeySpec;
import java.security.Key;
import java.security.Security;

@Slf4j
public class WeChatUtil {
    private static final String KEY_ALGORITHM = "AES";
    private static final String ALGORITHM_STR = "AES/CBC/PKCS7Padding";
    private static Key key;
    private static Cipher cipher;
    /**
     * 手机号解码
     *
     * @param encryptDataB64
     * @param sessionKeyB64
     * @param ivB64
     * @return
     */
    public static String decryptData(String encryptDataB64, String sessionKeyB64, String ivB64) {
        log.info("encryptDataB64:" + encryptDataB64);
        log.info("sessionKeyB64:" + sessionKeyB64);
        log.info("ivB64:" + ivB64);
        return new String(
                decryptOfDiyIv(
                        Base64.decode(encryptDataB64),
                        Base64.decode(sessionKeyB64),
                        Base64.decode(ivB64)
                )
        );
    }
    private static void init(byte[] keyBytes) {
        // 如果密钥不足16位,那么就补足.  这个if 中的内容很重要
        int base = 16;
        if (keyBytes.length % base != 0) {
            int groups = keyBytes.length / base + 1;
            byte[] temp = new byte[groups * base];
            Arrays.fill(temp, (byte) 0);
            System.arraycopy(keyBytes, 0, temp, 0, keyBytes.length);
            keyBytes = temp;
        }
        // 初始化
        Security.addProvider(new BouncyCastleProvider());
        // 转化成JAVA的密钥格式
        key = new SecretKeySpec(keyBytes, KEY_ALGORITHM);
        try {
            // 初始化cipher
            cipher = Cipher.getInstance(ALGORITHM_STR, "BC");
        } catch (Exception e) {
            log.error("初始化cipher失败", e);
        }
    }

    /**
     * 解密方法
     *
     * @param encryptedData 要解密的字符串
     * @param keyBytes      解密密钥
     * @param ivs           自定义对称解密算法初始向量 iv
     * @return 解密后的字节数组
     */
    private static byte[] decryptOfDiyIv(byte[] encryptedData, byte[] keyBytes, byte[] ivs) {
        byte[] encryptedText = null;
        init(keyBytes);
        try {
            cipher.init(Cipher.DECRYPT_MODE, key, new IvParameterSpec(ivs));
            encryptedText = cipher.doFinal(encryptedData);
        } catch (Exception e) {
            log.error("解密失败", e);
        }
        return encryptedText;
    }
}

3. 后端解码代码(新版)

旧版是通过解析一串加密的字符串算出当前用户的手机号,后来微信给改版了,变成调用接口的方式获取(当时不知道变化还出了线上故障😇,现在还收费。。。)。 新版很简单调用如下接口即可

api.weixin.qq.com/wxa/busines...

相关推荐
玩电脑的辣条哥2 小时前
Python如何播放本地音乐并在web页面播放
开发语言·前端·python
ew452182 小时前
ElementUI表格表头自定义添加checkbox,点击选中样式不生效
前端·javascript·elementui
suibian52352 小时前
AI时代:前端开发的职业发展路径拓宽
前端·人工智能
Moon.92 小时前
el-table的hasChildren不生效?子级没数据还显示箭头号?树形数据无法展开和收缩
前端·vue.js·html
垚垚 Securify 前沿站2 小时前
深入了解 AppScan 工具的使用:筑牢 Web 应用安全防线
运维·前端·网络·安全·web安全·系统安全
m0_748256144 小时前
SpringBoot
java·spring boot·后端
多想和从前一样4 小时前
Django 创建表时 “__str__ ”方法的使用
后端·python·django
工业甲酰苯胺5 小时前
Vue3 基础概念与环境搭建
前端·javascript·vue.js
涛粒子6 小时前
Spring Bean 生命周期的执行流程
java·后端·spring
mosquito_lover16 小时前
怎么把pyqt界面做的像web一样漂亮
前端·python·pyqt