目录

后台前端 代码分享----


wx.getUserProfile

bindgetuserinfo

登录过程

小程序登录 | 微信开放文档 (qq.com)

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

说明调用 wx.login(Object object) | 微信开放文档 (qq.com) 获取 临时登录凭证code ,并回传到开发者服务器。调用 小程序登录 | 微信开放文档 (qq.com)auth.code2Session接口,换取 用户唯一标识 OpenID 、 用户在微信开放平台帐号下的唯一标识UnionID(若当前小程序已绑定到微信开放平台帐号) 和 会话密钥 session_key。之后开发者服务器可以根据用户标识来生成自定义登录态,用于后续业务逻辑中前后端交互时识别用户身份。注意事项会话密钥 session_key 是对用户数据进行 加密签名 服务端获取开放数据 | 微信开放文档 (qq.com) 的密钥。为了应用自身的数据安全,开发者服务器不应该把会话密钥下发到小程序,也不应该对外提供这个密钥。临时登录凭证 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
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;}

小程序服器配置

导入微信小程序SDK

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

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 {@Autowiredprivate WxProperties properties;
​@Beanpublic WxMaConfig wxMaConfig() {WxMaInMemoryConfig config = new WxMaInMemoryConfig();config.setAppid(properties.getAppId());config.setSecret(properties.getAppSecret());config.setMsgDataFormat(properties.getMsgDataFormat());return config;}
​@Beanpublic WxMaService wxMaService(WxMaConfig maConfig) {WxMaService service = new WxMaServiceImpl();service.setWxMaConfig(maConfig);return service;}
​
}

WxAuthController

@RequestMapping("/wx/auth")
public class WxAuthController {@Autowiredprivate 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及sessionKeyString sessionKey = null;String openId = null;try {WxMaJscode2SessionResult result = this.wxService.getUserService().getSessionInfo(code);sessionKey = result.getSessionKey();//session idopenId = 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,并保存到数据库中//如果存在,更新最后登录时间//....// tokenUserToken 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

后台前端 代码分享----

后台:ssm-oa.rar - 蓝奏云

前台:oa-mini.rar - 蓝奏云

微信小程序微信账号登录相关推荐

  1. 微信小程序获取手机号登录流程(个人开发者账号不支持)

    微信小程序获取手机号登录流程 所需条件 1. 非个人开发者账号 2. AppID+AppSecret 流程思路 **注意:** 代码实现 常见问题 所需条件 1. 非个人开发者账号 获取手机号文档 这 ...

  2. 小程序登录本地服务器,微信小程序实现用户登录模块服务器搭建

    我选用的是node.js来搭建服务器,没有安装的小伙伴可以参考我的node.js其他博客. 服务器安装与配置 初始化项目,将会自动创建package.json配置文件. npm init -y 安装E ...

  3. 微信小程序---微信信息授权登录以及手机号授权登录

    微信小程序-微信信息授权登录以及手机号授权登录 (小白 为了以后方便查看)点击微信信息授权登录后 再次点击按钮进行手机号授权登录 图片演示 wxml(login.wxml)代码 <view cl ...

  4. 微信小程序如何进行登录授权和获取用户信息

    微信小程序如何进行登录授权和获取用户信息

  5. 微信小程token_微信小程序开发之登录换取token

    本文将带你了解微信小程序开发之登录换取token,希望本文对大家学微信有所帮助 前言:这次主要是介绍些业务逻辑,技术点倒是没有多少.不过在开发中,优秀的编程思路同样是非常值得学习的. 最近小程序可以说 ...

  6. 微信小程序获取手机号登录流程

    微信小程序获取手机号登录流程 首先前端使用wx.login 获取code wx.login({success(res) {if (res.code) {that.setData({code: res. ...

  7. 微信小程序的详细登录(上)

    前段时间发布了一个微信小程序的简单登录,那段时间我一直在忙着项目,有一天,我清闲下来准备进入小程序群里面看一下来着,刚好有人问问题了,我一看这哥们的问题好像是我写的东西啊,我感觉是时候秀一波了,是时候 ...

  8. 微信小程序的安全登录

    一.微信小程序的安全登录 让用户登录,标识用户和获取用户信息,以用户为核心提供服务,是大部分小程序都会做的事情.我们今天就来了解下在小程序中,如何做用户登录,以及如何去维护这个登录后的会话(Sessi ...

  9. 微信小程序 如何保持登录状态

    问题 由于wx.request()发起的每次请求对于服务器来说都是不同的会话(wx.request()请求是先经过微信服务器再到达我们的服务器),这样会导致后续请求都相当于未登录的状态. 解决方案 将 ...

  10. 微信小程序之授权登录

    微信小程序之授权登录 之前微信授权登录时是直接可以通过getUserInfo接口 弹出授权弹窗.由于微信官方修改了 getUserInfo 接口,所以现在无法实现一进入微信小程序就弹出授权窗口,只能通 ...

最新文章

  1. python mysql ssh隧道_在python中使用ssh隧道连接mysql
  2. 【数据结构与算法】之深入解析“字符串转换整数 (atoi)”的求解思路和算法示例
  3. html时钟翻牌效果,干货满满!如何优雅简洁地实现时钟翻牌器(支持JS/Vue/React)
  4. How is OData selected implemented
  5. Linux 中断处理浅析
  6. Java虚拟机(二)——垃圾回收与内存分配
  7. php7安装redis扩展和memcache扩展
  8. mac下安装wxPython2.8.12.1方法
  9. 【最强宝典】后端面试知识点合集
  10. 第二十三期:你用的Windows操作系统是不是盗版?微软知道吗
  11. 日系PC厂商为问题希捷硬盘提供固件更新
  12. 不疯魔不成活,还是偏执狂?
  13. python 饼图笔记 两个饼图 双饼图 复合饼图 两个饼图 环形图
  14. 新西兰梅西大学有计算机专业吗,【新西兰梅西大学计算机专业】 - 教外新西兰留学网...
  15. scratch编程三级--小猫和笔合作画正方形
  16. 设计求二叉树高度的算法
  17. 疫情已经结束,快递行业现状如何
  18. Android获取设备的SerialNumber(SN)串号以及WIFIMac值
  19. 老版本Typora安装
  20. web服务器显示禁用,win10系统打开ppt提示默认情况下禁用对此web服务器的访问的处理办法...

热门文章

  1. function函数的各种写法
  2. unity学习路线参考——转载自csdn
  3. LVGL的多语言转换工具--MCU_Font_Release
  4. Python 3D绘图库pyecharts、matplotlib、openpyxl
  5. 零基础学习MySQL
  6. javascript短路运算
  7. 网络客户/服务器程序
  8. 自动化篇 | PC 端这款黑科技录制脚本,完爆按键精灵!
  9. Android 边边角角
  10. flutter 记录 问题