Miniprograma WeChat Login da conta WeChat

Índice

Compartilhamento de código de fundo e front-end ----


wx.getUserProfile

bindgetuserinfo

processo de login

Login do mini programa | Documentação aberta do WeChat (qq.com)

O Mini Programa pode obter facilmente a identidade do usuário fornecida pelo WeChat por meio do recurso de login oficial fornecido pelo WeChat e estabelecer rapidamente um sistema de usuário dentro do Mini Programa.

Descrição Chame wx.login(Object object) | WeChat Open Documentation (qq.com) para obter o código de credencial de login temporário e enviá-lo de volta ao servidor do desenvolvedor. Chame a interface Login do Mini Programa | WeChat Open Documentation (qq.com) auth.code2Session em troca da ID exclusiva OpenID do usuário, a ID exclusiva (se o Mini Programa atual estiver vinculado a a conta WeChat Open Platform) e chave de sessão session_key . Posteriormente, o servidor do desenvolvedor pode gerar um status de login personalizado de acordo com o ID do usuário, que é usado para identificar a identidade do usuário durante as interações de front-end e back-end na lógica de negócios subsequente. Precauções A chave de sessão session_key é a chave para criptografar e assinar os dados do usuário . O servidor obtém dados abertos | Documentos abertos do WeChat (qq.com) . Para proteger os dados do próprio aplicativo, o servidor não deve enviar a chave de sessão para o applet, nem deve fornecer essa chave para o mundo externo. . O código de credencial de login temporário só pode ser usado uma vez. A função appId mostra que o appid é o identificador exclusivo da conta WeChat, que é fixo; se você entende o desenvolvimento da conta oficial do WeChat, precisa prestar atenção, o appid de o applet e o appid da conta oficial são inconsistentes descrição da função session_key O cliente WeChat obtém informações do usuário por meio de wx.getUserInfo(). O plano de fundo às vezes precisa obter as informações do usuário do cliente WeChat. Portanto, é necessário usar o segredo key session_key para obter o documento oficial da plataforma WeChat. Verificação de assinatura e criptografia e descriptografia de dados envolve a chave de sessão do usuário session_key. O desenvolvedor deve obter a chave de sessão session_key por meio do processo de login wx.login com antecedência e salvá-la no servidor. Para não adulterar os dados, o desenvolvedor não deve passar o session_key para o ambiente fora do servidor, como o cliente do applet.

Login-Applet

  1. Execute wx.login para efetuar login para obter o código do applet
  2. O servidor obtém a session_key do WeChat de acordo com o código e o armazena em cache; ao mesmo tempo, gera um access_token e o salva no applet para manter o status de login;
  3. Quando o applet solicita os dados do usuário do servidor, primeiro wx.checkSession, se válido, determina o usuário por meio do access_token e encontra a session_key;
  4. Se o miniprograma não for usado por muito tempo, a session_key no servidor se tornará inválida e a session_key não poderá mais ser usada para obter dados do WeChat, e o miniprograma precisará realizar a operação de login novamente; o servidor pode obter a session_key somente através do login do mini programa;

wx.checkSession

Verifique se o status de login expirou

wx.login

Chame a interface para obter credenciais de login (código)

wx.pedido

Solicite seu próprio mini servidor de programa e código de transporte, informações de userInfo

Nos bastidores

preparar folha de dados

DROP TABLE IF EXISTS `wx_user`;
CREATE TABLE `wx_user`  (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `username` varchar(63) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci NOT NULL COMMENT '用户名称',
  `password` varchar(63) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci NOT NULL DEFAULT '' COMMENT '用户密码',
  `gender` tinyint(3) NOT NULL DEFAULT 0 COMMENT '性别:0 未知, 1男, 1 女',
  `birthday` date NULL DEFAULT NULL COMMENT '生日',
  `last_login_time` datetime(0) NULL DEFAULT NULL COMMENT '最近一次登录时间',
  `last_login_ip` varchar(63) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci NOT NULL DEFAULT '' COMMENT '最近一次登录IP地址',
  `user_level` tinyint(3) NULL DEFAULT 0 COMMENT '用户层级 0 普通用户,1 VIP用户,2 区域代理用户',
  `nickname` varchar(63) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci NOT NULL DEFAULT '' COMMENT '用户昵称或网络名称',
  `mobile` varchar(20) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci NOT NULL DEFAULT '' COMMENT '用户手机号码',
  `avatar` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci NOT NULL DEFAULT '' COMMENT '用户头像图片',
  `weixin_openid` varchar(63) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci NOT NULL DEFAULT '' COMMENT '微信登录openid',
  `status` tinyint(3) NOT NULL DEFAULT 0 COMMENT '0 可用, 1 禁用, 2 注销',
  `add_time` datetime(0) NULL DEFAULT NULL COMMENT '创建时间',
  `update_time` datetime(0) NULL DEFAULT NULL COMMENT '更新时间',
  `deleted` tinyint(1) NULL DEFAULT 0 COMMENT '逻辑删除',
  `share_user_id` int(11) NULL DEFAULT NULL,
  PRIMARY KEY (`id`) USING BTREE,
  UNIQUE INDEX `user_name`(`username`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 1 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_general_ci COMMENT = '用户表' ROW_FORMAT = Compact;
​

A ferramenta de compilação reversa gera

  • WxUser.java
  • WxUserMapper.java
  • WxUserMapper.xml

Prepare-se para encapsular os dados passados ​​do front-end

  • Informação de usuário
package com.zking.ssm.model;

import lombok.Data;

import java.io.Serializable;

/**
 * 封装微信UserInfo用户信息
 */
@Data
public class UserInfo implements Serializable {
   private static final long serialVersionUID = -5813029516433359765L;

   private Integer userId;
   private String nickName;
   private String avatarUrl;
   private String country;
   private String province;
   private String city;
   private String language;
   private Byte gender;
   private String phone;
   private Byte userLevel;// 用户层级 0 普通用户,1 VIP用户,2 区域代理用户
   private String userLevelDesc;// 代理用户描述
   
   private Byte status;//状态
   private String registerDate;//注册日期
   
}
  • WxLoginInfo
package com.zking.ssm.model;

import lombok.Data;

import java.io.Serializable;

/**
 * 封装请求数据
 */
@Data
public class WxLoginInfo implements Serializable {

   private static final long serialVersionUID = -7722430332896313642L;

   private String code;
   private UserInfo userInfo;

}

Configuração do Servidor do Mini Programa

Importar WeChat Mini Program SDK

<dependency>
    <groupId>com.github.binarywang</groupId>
    <artifactId>weixin-java-miniapp</artifactId>
    <version>3.3.0</version>
</dependency>

WxProperties

Encapsule os dados de oa.wx

@Data
@Configuration
@ConfigurationProperties(prefix = "oa.wx")
public class WxProperties {
    /**
     * 设置微信小程序的appId
     */
    private String appId;
    /**
     * 设置微信小程序的Secret
     */
    private String appSecret;
    /**
     * 消息数据格式
     */
    private String msgDataFormat;
​
}

WxConfig

Registrar WxMaService

@Configuration
public class WxConfig {
    @Autowired
    private WxProperties properties;
​
    @Bean
    public WxMaConfig wxMaConfig() {
        WxMaInMemoryConfig config = new WxMaInMemoryConfig();
        config.setAppid(properties.getAppId());
        config.setSecret(properties.getAppSecret());
        config.setMsgDataFormat(properties.getMsgDataFormat());
        return config;
    }
​
    @Bean
    public WxMaService wxMaService(WxMaConfig maConfig) {
        WxMaService service = new WxMaServiceImpl();
        service.setWxMaConfig(maConfig);
        return service;
    }
​
}

WxAuthController

@RequestMapping("/wx/auth")
public class WxAuthController {
    @Autowired
    private WxMaService wxService;
     @PostMapping("login_by_weixin")
    public Object loginByWeixin(@RequestBody WxLoginInfo wxLoginInfo, HttpServletRequest request) {
​
        //客户端需携带code与userInfo信息
        String code = wxLoginInfo.getCode();
        UserInfo userInfo = wxLoginInfo.getUserInfo();
        if (code == null || userInfo == null) {
            return ResponseUtil.badArgument();
        }
        //调用微信sdk获取openId及sessionKey
        String sessionKey = null;
        String openId = null;
        try {
            WxMaJscode2SessionResult result = this.wxService.getUserService().getSessionInfo(code);
            sessionKey = result.getSessionKey();//session id
            openId = result.getOpenid();//用户唯一标识 OpenID
        } catch (Exception e) {
            e.printStackTrace();
        }
​
        if (sessionKey == null || openId == null) {
            log.error("微信登录,调用官方接口失败:{}", code);
            return ResponseUtil.fail();
        }else{
            log.info("openId={},sessionKey={}",openId,sessionKey);
        }
        //根据openId查询wx_user表
        //如果不存在,初始化wx_user,并保存到数据库中
        //如果存在,更新最后登录时间
        //....
        // token
        UserToken userToken = null;
        try {
            userToken = UserTokenManager.generateToken(user.getId());
        } catch (Exception e) {
            log.error("微信登录失败,生成token失败:{}", user.getId());
            e.printStackTrace();
            return ResponseUtil.fail();
        }
        userToken.setSessionKey(sessionKey);
        log.info("SessionKey={}",UserTokenManager.getSessionKey(user.getId()));
        Map<Object, Object> result = new HashMap<Object, Object>();
        result.put("token", userToken.getToken());
        result.put("tokenExpire", userToken.getExpireTime().toString());
        result.put("userInfo", userInfo);
        //....
​
​
        log.info("【请求结束】微信登录,响应结果:{}", JSONObject.toJSONString(result));
​
        return ResponseUtil.ok(result);
    }

Os dados de resposta ao cliente são:

Informações do usuário do token

Login-Applet

login.js

user.loginByWeixin(res.userInfo).then(res => {
    app.globalData.hasLogin = true;
    wx.navigateBack({
    delta: 1
    })
})

usuário.js

function loginByWeixin(userInfo) {
  return new Promise(function(resolve, reject) {
    return login().then((res) => {
      //登录远程服务器
      util.request(api.AuthLoginByWeixin, {
        code: res.code,
        userInfo: userInfo
      }, 'POST').then(res => {
        if (res.errno === 0) {
          //存储用户信息
          wx.setStorageSync('userInfo', res.data.userInfo);
          wx.setStorageSync('token', res.data.token);
          resolve(res);
        } else {
          reject(res);
        }
      })

Salve userInfo e dados de token localmente

util.js

function request(url, data = {}, method = "GET") {
  return new Promise(function (resolve, reject) {
    wx.request({
      url: url,
      data: data,
      method: method,
      timeout:6000,
      header: {
        'Content-Type': 'application/json',
        'X-OA-Token': wx.getStorageSync('token')
      },
Se você usar a função util.request, cada solicitação carregará 'X-OA-Token': wx.getStorageSync('token'); e o servidor salvou todos os tokens, então o servidor distingue cada cliente por token

emoji

O utf8 do Mysql codifica um caractere com no máximo 3 bytes, mas uma expressão emoji tem 4 bytes, portanto, o utf8 não suporta o armazenamento de expressões emoji. Mas utf8mb4, um superconjunto de utf8, pode ter até 4 bytes por caractere, portanto pode suportar o armazenamento de expressões emoji.

O arquivo de configuração do MySQL no sistema Linux é my.cnf.

O arquivo de configuração no Windows é my.ini.

[mysql]
# 设置mysql客户端默认字符集
default-character-set=utf8mb4
​
[mysqld]
#设置3306端口
port = 3306
# 设置mysql的安装目录
basedir=D:\\tools\\mysql-5.7.23-winx64
# 设置mysql数据库的数据的存放目录
datadir=D:\\tools\\mysql-5.7.23-winx64\\data
# 允许最大连接数
max_connections=200
# 服务端使用的字符集默认为8比特编码的latin1字符集
character-set-server=utf8mb4
# 创建新表时将使用的默认存储引擎
default-storage-engine=INNODB

Compartilhamento de código de fundo e front-end ----

Antecedentes: ssm-oa.rar - Lanzuoyun

Recepção: oa-mini.rar - Lanzuoyun

Acho que você gosta

Origin blog.csdn.net/qq_62898618/article/details/128628006
Recomendado
Clasificación