微信小程序生态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...

相关推荐
hlsd#3 分钟前
go mod 依赖管理
开发语言·后端·golang
四喜花露水5 分钟前
Vue 自定义icon组件封装SVG图标
前端·javascript·vue.js
陈大爷(有低保)7 分钟前
三层架构和MVC以及它们的融合
后端·mvc
亦世凡华、7 分钟前
【启程Golang之旅】从零开始构建可扩展的微服务架构
开发语言·经验分享·后端·golang
河西石头8 分钟前
一步一步从asp.net core mvc中访问asp.net core WebApi
后端·asp.net·mvc·.net core访问api·httpclient的使用
前端Hardy15 分钟前
HTML&CSS: 实现可爱的冰墩墩
前端·javascript·css·html·css3
2401_8574396920 分钟前
SpringBoot框架在资产管理中的应用
java·spring boot·后端
怀旧66621 分钟前
spring boot 项目配置https服务
java·spring boot·后端·学习·个人开发·1024程序员节
阿华的代码王国42 分钟前
【SpringMVC】——Cookie和Session机制
java·后端·spring·cookie·session·会话
瑶琴AI前端44 分钟前
uniapp实现H5和微信小程序获取当前位置(腾讯地图)
微信小程序·小程序·uni-app