Tabla de contenido

Uso compartido de código de fondo y front-end ----

wx.getUserProfile

bindgetuserinfo

proceso de inicio de sesión

Inicio de sesión del miniprograma | Documentación abierta de WeChat (qq.com)

El Mini Programa puede obtener fácilmente la identidad de usuario proporcionada por WeChat a través de la capacidad de inicio de sesión oficial proporcionada por WeChat y establecer rápidamente un sistema de usuario dentro del Mini Programa.

Descripción Llame a wx.login(Object object) | WeChat Open Documentation (qq.com) para obtener el código de credencial de inicio de sesión temporal y enviarlo al servidor del desarrollador. Llame a la interfaz auth.code2Session de inicio de sesión del Mini Programa | WeChat Open Documentation ( qq.com ) a cambio de la ID única del usuario OpenID , la ID única (si el Mini Programa actual se ha vinculado a la cuenta de WeChat Open Platform) y la clave de sesión session_key . Posteriormente, el servidor del desarrollador puede generar un estado de inicio de sesión personalizado de acuerdo con la identificación del usuario, que se utiliza para identificar la identidad del usuario durante las interacciones de front-end y back-end en la lógica empresarial posterior. Precauciones La clave de sesión session_key es la clave para cifrar y firmar los datos del El servidor obtiene datos abiertos | Documentos abiertos de WeChat (qq.com) . Para proteger los datos propios de la aplicación, el servidor no debe enviar la clave de sesión al applet, ni debe proporcionar esta clave al mundo exterior. . El código de credencial de inicio de sesión temporal solo se puede usar una vez. La función appId muestra que appid es el identificador único de la cuenta de WeChat, que es fijo; si comprende el desarrollo de la cuenta oficial de WeChat, debe prestar atención, el appid de el applet y el appid de la cuenta oficial son inconsistentes descripción de la función session_key El cliente de WeChat obtiene información del usuario a través de wx.getUserInfo (). El fondo a veces necesita obtener la información del usuario del cliente de WeChat. Por lo tanto, es necesario usar el secreto key session_key para obtener el documento oficial de la plataforma WeChat. La verificación de firma y el cifrado y descifrado de datos involucra la clave de sesión del usuario session_key. El desarrollador debe obtener la clave de sesión session_key a través del proceso de inicio de sesión de wx.login por adelantado y guardarla en el servidor. Para no manipular los datos, el desarrollador no debe pasar session_key al entorno fuera del servidor, como el cliente del applet.

Applet de inicio de sesión

Ejecute wx.login para iniciar sesión y obtener el código del applet
El servidor obtiene la session_key de WeChat de acuerdo con el código y la almacena en caché; al mismo tiempo, genera un access_token y lo guarda en el applet para mantener el estado de inicio de sesión;
Cuando el applet solicita los datos del usuario del servidor, primero wx.checkSession, si es válido, determine el usuario a través de access_token y encuentre session_key, si no es válido, ejecute wx.login para volver a iniciar sesión para regenerar access_token, y el servidor vuelve a obtener session_key;
Si el mini programa no se usa durante mucho tiempo, la clave de sesión en el servidor dejará de ser válida y la clave de sesión ya no se puede usar para obtener datos de WeChat, y el mini programa debe realizar la operación de inicio de sesión nuevamente; el servidor puede solo obtenga session_key a través del inicio de sesión del mini programa;

wx.checkSession

Compruebe si el estado de inicio de sesión ha caducado

wx.login

Llame a la interfaz para obtener las credenciales de inicio de sesión (código)

wx.solicitud

Solicite su propio mini servidor de programas y lleve código, información de información de usuario

Entre bastidores

preparar hoja de datos

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;

La herramienta de compilación inversa genera

WxUser.java
WxUserMapper.java
WxUserMapper.xml

Prepárese para encapsular los datos pasados desde el front-end

Información de usuario

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;

}

Configuración del Mini Servidor de Programas

Importar WeChat Mini Programa SDK

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

WxPropiedades

Encapsular los datos 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;
    }

}

Controlador WxAuth

@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);
    }

Los datos de respuesta al cliente son:

Información del usuario del token

Applet de inicio de sesión

iniciar sesión.js

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

usuario.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);
        }
      })

Guardar información de usuario y datos 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')
      },

Si usa la función util.request, cada solicitud llevará 'X-OA-Token': wx.getStorageSync('token'); y el servidor ha guardado todos los tokens, por lo que el servidor distingue a cada cliente por token

emoticonos

Utf8 de Mysql codifica un carácter con un máximo de 3 bytes, pero una expresión emoji tiene 4 bytes, por lo que utf8 no admite el almacenamiento de expresiones emoji. Pero utf8mb4, un superconjunto de utf8, puede tener hasta 4 bytes por carácter, por lo que puede admitir el almacenamiento de expresiones emoji.

El archivo de configuración de MySQL en el sistema Linux es my.cnf.

El archivo de configuración en Windows es 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

Uso compartido de código de fondo y front-end ----

Fondo: ssm-oa.rar - Lanzuoyun

Recepción: oa-mini.rar - Lanzuoyun

WeChat Mini Program Inicio de sesión en la cuenta de WeChat

Uso compartido de código de fondo y front-end ----

Supongo que te gusta