小程序：后台交互-个人中心

news2024/9/25 9:32:30

目录

获取用户昵称头像和昵称

wx.getUserProfile

bindgetuserinfo

oa-mini

登录过程

登录-小程序

wx.checkSession

wx.login

wx.request

后台

准备数据表

反向生成工具生成

准备封装前端传过来的数据

小程序服器配置

导入微信小程序SDK

application.yml

WxProperties

WxConfig

WxAuthController

登录-小程序

login.js

user.js

util.js

emoji

获取用户昵称头像和昵称

wx.getUserProfile

 

 

 

 

这是获取到的是微信头像 。

bindgetuserinfo

oa-mini

后台：

记得修改maven配置：

记得要修改yml文件：

 

 注意：如果不对应的话会微信登录失败的！

 

 

 

登录过程

小程序登录

小程序可以通过微信官方提供的登录能力方便地获取微信提供的用户身份标识，快速建立小程序内的用户体系。

  • 说明

    • 调用 wx.login() 获取 临时登录凭证code ，并回传到开发者服务器。

    • 调用 auth.code2Session 接口，换取 用户唯一标识 OpenID 、 用户在微信开放平台帐号下的唯一标识UnionID（若当前小程序已绑定到微信开放平台帐号） 和 会话密钥 session_key。

    • 之后开发者服务器可以根据用户标识来生成自定义登录态，用于后续业务逻辑中前后端交互时识别用户身份。

  • 注意事项

    1. 会话密钥 session_key 是对用户数据进行 加密签名 的密钥。为了应用自身的数据安全，开发者服务器不应该把会话密钥下发到小程序，也不应该对外提供这个密钥。

    2. 临时登录凭证 code 只能使用一次

  • appId 作用说明

    • appid 是微信账号的唯一标识，这个是固定不变的； 如果了解微信公众号开发的就需要注意一下，小程序的appid 和 公众号的appid 是不一致的

  • session_key 功能说明 微信客户端通过wx.getUserInfo()获取用户的信息 后台有时候也需要获取微信客户端的用户信息，因此，就需要利用session_key这个秘钥来从微信平台中获取 官方文档原文 签名校验以及数据加解密涉及用户的会话密钥 session_key。 开发者应该事先通过 wx.login 登录流程获取会话密钥 session_key 并保存在服务器。为了数据不被篡改，开发者不应该把 session_key 传到小程序客户端等服务器外的环境。

登录-小程序

  1. 执行wx.login 登录获取小程序端的code

  2. 服务端根据code去微信端获取session_key并且缓存；同时生成access_token 保存在小程序端，维持登录状态；

  3. 小程序端请求服务端用户数据时，先wx.checkSession，有效就通过access_token 确定用户，找到session_key；无效就执行wx.login重新登录重新生成access_token,服务端重新获取session_key；

  4. 小程序端长时间不使用，服务端的session_key会失效，无法再用session_key去微信端获取数据，需要小程序端重新执行登录操作； 服务端要获取session_key 只能通过小程序端的登录来操作；

wx.checkSession

检查登录态是否过期

wx.login

调用接口获取登录凭证（code）

wx.request

请求自己小程序服器，并且携带了code,userInfo信息

后台

准备数据表

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;

反向生成工具生成

  • WxUser.java

  • WxUserMapper.java

  • WxUserMapper.xml

准备封装前端传过来的数据

  • UserInfo

  • WxLoginInfo

小程序服器配置

导入微信小程序SDK

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

application.yml

oa:
  wx:
    app-id: wxf23b28b5e4ea4d6a
    app-secret: 212621faa31cdf0691367ea45b2b6041
    msgDataFormat: JSON

WxProperties

封装oa.wx的数据

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

}

WxConfig

注册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);
    }

响应给客户端数据有：

token userInfo

登录-小程序

login.js

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

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

将userInfo,token数据保存到本地

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')
      },

如果使用util.request函数，每次请求都会携带'X-OA-Token': wx.getStorageSync('token');而服器已经保存了所有的token,所以服器通过token区分每个客户端

emoji

mysql的utf8编码的一个字符最多3个字节，但是一个emoji表情为4个字节，所以utf8不支持存储emoji表情。但是utf8的超集utf8mb4一个字符最多能有4字节，所以能支持emoji表情的存储。

Linux系统中MySQL的配置文件为my.cnf。

Winows中的配置文件为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

找到服务：

 即可。

微信昵称就能存储emoji表情了。

今日内容到此结束啦，再会！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/127555.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

我眼中的Java内存模型

我眼中的Java内存模型

一.JVM内存结构 &#xff08;1&#xff09;方法区只是一种概念上的区域&#xff0c;并说明了其应该具有什么功能&#xff0c;但是没有规定这个区域到底应该处于何处&#xff0c;不同版本的方法区所处位置不同&#xff0c;并不是绝对意义上的物理区域。 &#xff08;2&#xff0…
阅读更多...
CSRF攻击方式及预防准则

CSRF攻击方式及预防准则

跨站点请求伪造&#xff08;CSRF&#xff09; 是一种攻击类型&#xff0c;当恶意网站、电子邮件、博客、即时消息或程序导致用户的Web浏览器在用户通过身份验证后对受信任的站点执行不需要的操作时&#xff0c;就会发生这种攻击。CSRF攻击之所以有效&#xff0c;是因为浏览器请…
阅读更多...
OpenHarmony#深入浅出学习eTs#（二）拖拽式UI

OpenHarmony#深入浅出学习eTs#（二）拖拽式UI

本项目Gitee仓地址&#xff1a;深入浅出eTs学习: 带大家深入浅出学习eTs (gitee.com) 一、创建支持Super Visual的工程 在这里选择直尺Super Visual的选项&#xff0c;调整当前路径&#xff0c;进入绘制界面 二、UI设计界面介绍 在左侧是路径&#xff08;即文件管理器&#x…
阅读更多...
3.我们一起来学习Linux 安装

3.我们一起来学习Linux 安装

Linux 安装 本章节我们将为大家介绍 Linux 的安装&#xff0c;安装步骤比较繁琐&#xff0c;现在其实云服务器挺普遍的&#xff0c;价格也便宜&#xff0c;如果自己不想搭建&#xff0c;也可以直接买一台学习用用。 本章节以 centos6.4 为例。 可以去官网下载最新版本&…
阅读更多...
【C语言进阶】通讯录再优化？学会文件操作，没有数据库也能保存和管理本地数据

【C语言进阶】通讯录再优化？学会文件操作，没有数据库也能保存和管理本地数据

目录 &#x1f95d;前言&#x1f95d;&#xff1a; 一、&#x1f353;文件概述&#x1f353;&#xff1a; 1.为什么使用文件&#xff1a; 2.什么是文件&#xff1a; ①.程序文件&#xff1a; ②.数据文件&#xff1a; ③.文件名&#xff1a; 二、&#x1f34a;文件顺序读写&…
阅读更多...
JAVA集成阿里云OSS对象存储

JAVA集成阿里云OSS对象存储

JAVA集成阿里云OSS对象存储1 : 配置集成1.1、对象存储OSS2 : 代码配置2.1、说明2.2、配置文件2.3、加载配置文件代码2.4、封装统一的DTO2.5、OSS上传Controller2.6、OSS上传Service2.7、OSS上传ServiceImpl3 : 测试3.1、文件上传3.2、文件迁移4 : 总结4.1、参考资料4.2、注意事…
阅读更多...
浅谈 C++ 字符串：std::string 与它的替身们

浅谈 C++ 字符串：std::string 与它的替身们

浅谈 C 字符串&#xff1a;std::string 与它的替身们 文章目录浅谈 C 字符串&#xff1a;std::string 与它的替身们零、前言一、前辈&#xff1a;C 风格的字符串1.1 什么是 C 风格的字符串1.2 C 风格的字符串有什么缺陷1.2.1 以 \0 作为结尾&#xff0c;没有直接指明长度1.2.2 …
阅读更多...
Android技术分享——APT实现ButterKnife【实战学习】

Android技术分享——APT实现ButterKnife【实战学习】

APT APT &#xff08;Annotation Processing Tool&#xff09; 是一种处理注释的工具&#xff0c;它对源代码文件进行检测并找出其中的 Annotation&#xff0c;根据注解自动生成代码&#xff0c;如果想要自定义的注解处理器能够运行&#xff0c;必须要通过 APT 工具来处理。 …
阅读更多...
Python实现FA萤火虫优化算法优化支持向量机分类模型(SVC算法)项目实战

Python实现FA萤火虫优化算法优化支持向量机分类模型(SVC算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 萤火虫算法&#xff08;Fire-fly algorithm&#xff0c;FA&#xff09;由剑桥大学Yang于2009年提出 , 作…
阅读更多...
maven第一篇：安装maven以及配置

maven第一篇：安装maven以及配置

本篇就是聊如何在电脑上安装maven&#xff0c;以及简单的配置基础环境。 首先需要了解什么适合maven&#xff0c;对于这个理论知识&#xff0c;还是老规矩直接复制一下&#xff1b; Maven 是一款基于 Java 平台的项目管理和整合工具&#xff0c;它将项目的开发和管理过程抽象…
阅读更多...
提速300%，PaddleSpeech语音识别高性能部署方案重磅来袭！

提速300%，PaddleSpeech语音识别高性能部署方案重磅来袭！

在人机交互的过程中&#xff0c;语音是重要的信息载体&#xff0c;而语音交互技术离不开语音识别与语音合成技术。飞桨语音模型库PaddleSpeech为开发者们使用这些技术提供了便捷的环境。本次PaddleSpeech迎来重大更新——1.3版本正式发布。让我们一起看看&#xff0c;这次Paddl…
阅读更多...
这样实操一下 JVM 调优，面试超加分

这样实操一下 JVM 调优，面试超加分

1.写在前面 前段时间一位读者面了阿里&#xff0c;在二面中被问到 GC 日志分析&#xff0c;感觉回答的不是很好&#xff0c;过来找我复盘&#xff0c;大致听了他的回答&#xff0c;虽然回答出了部分&#xff0c;但是没抓到重点。 GC 日志分析算是 JVM 调优中比较难的部分&…
阅读更多...
【XR】如何提高追踪保真度，确保内向外追踪系统性能

【XR】如何提高追踪保真度，确保内向外追踪系统性能

Constellation是Oculus研发的追踪系统。日前&#xff0c;负责AR/VR设备输入追踪的Facebook工程经理安德鲁梅利姆撰文介绍了他们是如何用基于Constellation追踪的控制器来提高交互保真度。具体整理如下&#xff1a; 我们的计算机视觉工程师团队一直在努力为Oculus Quest和Rift …
阅读更多...
【再学Tensorflow2】TensorFlow2的模型训练组件（1）

【再学Tensorflow2】TensorFlow2的模型训练组件（1）

TensorFlow2的模型训练组件&#xff08;1&#xff09;数据管道构建数据通道应用数据转换提升管道性能特征列特征列用法简介特征列使用示例激活函数常用激活函数激活函数使用示例Tensorflow模型中的层内置的层自定义模型中的层参考资料Tensorflow中与模型训练相关的组件主要包括…
阅读更多...
图像采样与量化

图像采样与量化

数字图像有两个重要属性&#xff1a;空间位置(x,y)以及响应值I(x,y)。数字图像中像素的空间位置及响应值都是离散值&#xff0c;传感器输出连续电压信号。为了产生数字图像&#xff0c;需要把连续的数据转换为离散的数字化形式。采用的方式是图像量化与采样。 图像采样 图像量化…
阅读更多...
【数据结构】（初阶）：二叉搜索树

【数据结构】（初阶）：二叉搜索树

​ ✨前言✨ &#x1f393;作者&#xff1a;【 教主 】 &#x1f4dc;文章推荐&#xff1a; ☕博主水平有限&#xff0c;如有错误&#xff0c;恳请斧正。 &#x1f4cc;机会总是留给有准备的人&#xff0c;越努力&#xff0c;越幸运&#xff01; &#x1f4a6;导航助手&#x…
阅读更多...
Docker+Selenium Grid运行UI自动化

Docker+Selenium Grid运行UI自动化

简介 使用Selenium Grid可以分布式运行UI自动化测试&#xff0c;可以同时启动多个不同的浏览器&#xff0c;也可以同时启动同一个浏览器的多个session。这里使用Docker Compose来同时启动不同浏览器的容器和Selenium Grid&#xff0c;只需一条命令就把自动化运行环境部署好了。…
阅读更多...
verilog仿真技巧与bug集合

verilog仿真技巧与bug集合

文章目录赋值语句想法一些建议时钟信号关于异步fifo写入数据时wp1&#xff0c;读出数据时rp1一些自己的bug关于操作符&关于if-else关于modelsim使用1.初学者不建议在设计文件中加入仿真语句&#xff1b; 2.初学者也不会在tb里使用类似always一样的设计。 对于1.因为把仿真…
阅读更多...
国产RISC-V处理器“黑马”跑分曝光！超过多数国内主流高性能处理器！

国产RISC-V处理器“黑马”跑分曝光！超过多数国内主流高性能处理器！

来源企业投稿 2010年&#xff0c;开源、开放、精简的RISC-V架构诞生。虽然距今仅有12年&#xff0c;但RISC-V迎来了众多玩家的积极参与&#xff0c;其技术、生态、应用都快速发展。在许多秉持匠心的技术人员的耕耘下&#xff0c;RISC-V也早已从传统强项物联网走出&#xff0c;…
阅读更多...
error: ‘uint8_t’,‘uint16_t’ ,‘uint32_t’ does not name a type

error: ‘uint8_t’,‘uint16_t’ ,‘uint32_t’ does not name a type

文章目录1、报错error: ‘uint8_t’,‘uint16_t’ ,‘uint32_t’ does not name a type2、解决办法3、uint8_t此类数据类型补充4、码字不易&#xff0c;点点赞1、报错error: ‘uint8_t’,‘uint16_t’ ,‘uint32_t’ does not name a type 在网络编程PING程序时遇到的小bug&am…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023