业务需求
嵌入到三方原有系统中,用户数据不留存在本系统中,而是调取三方的接口实现登录判断
架构
一.登录的时序图
对方提供了登录页面,对面会员详细数据不存在本系统内。对方提供了4个接口,用来嵌入。以下为时序图
二.数据结构
Member
字段名 | 类型 | 备注 |
---|---|---|
memberId | String | - |
avatarUrl | String | 头像 |
cardNO | String | 会员号 |
String | 邮箱 | |
memberName | String | 会员昵称 |
memberPoint | Int | 积分 |
memberTypeID | String | 会员类型(会员卡等级) |
oldCardNO | String | 用户唯一标识 |
papersType | String | 证件类型 |
totalPoint | Int | 总积分 |
tel | String | 手机号 |
papersNo | String | 证件编号 |
applicationChannel | String | 渠道 |
三.源码
说明:此处仅展示预存款充值相关代码,其他关联业务不做具体展示
- 商城前端页面,加载一段JS。获取浏览器和被嵌入服务器的sessionid
- 拦截所有需要权限的访问,通过sessionid,调取被嵌入系统接口,查询是否存登录状态。
BuyerSecurityConfig.java
@Configuration
@EnableWebSecurity
public class BuyerSecurityConfig extends WebSecurityConfigurerAdapter {
@Override
public void configure(HttpSecurity http) throws Exception {
//过滤掉不需要买家权限的api ,在里面加上访问嵌入系统的API路径
http.authorizeRequests().antMatchers("/debugger/**"。。。).permitAll().and();
//定义有买家权限才可以访问
http.authorizeRequests().anyRequest().hasRole(Role.BUY.name());
}}
3.访问本系统连接第三方的API,通过接口查询登录状态,如果登录状态存在,那么继续调用接口。查询用户的基本信息,在本系统中,查询是否存在该用户基本信息
//查询是否在本地存在
Member member = memberManager.getMemberByID(ID);
if (member == null) {
//同步用户数据到本地
}
4.当用户数据同步完成或者已经存在,那么生成一个Buy权限的token ,并且返回给前端。
//新建买家角色
Buy buyer = new Buy();
//设置唯一ID,uuid为前端生成传值到后台
buyer.setUuid(uuid);
//名字为接口返回的用户名
buyer.setUsername(memberName);
//设置用户ID为
buyer.setUid(member.getMemberId());
//通过角色创建TOKEN
Token token = tokenManager.create(buyer);
String accessToken = token.getAccessToken();
String refreshToken = token.getRefreshToken();
5.前端中进行判断
/**
* 检查token:
* 1. user/accessToken/refreshToken都不存在。
* 表示用户没有登录,放行所有API
* 2. 不存在accessToken,但是user/refreshToken存在。
* 表示accessToken过期,需要重新获取accessToken。
* 如果重新获取accessToken返回token失效错误,说明已被登出。
* @param options
* @returns {Promise<any>}
*/
6.然后把accessToken 信息存入 COOKIE中。
四.注意事项
本系统前端 由VUE搭建。分为本地渲染和服务器渲染。
PC页面由本地渲染,不涉及跨域问题,所以存入的COOKIE有效
但是WAP由服务器渲染,无法通过
$store.dispatch('user/setAccessTokenAction', response.accessToken)
这种方式获取COOKIE中的信息
在VUE的package.json中,在dependencies 内,加入
"cookie-universal-nuxt": "^2.1.4",
通过该方法,可以使前端传入cookie 。并且通过app.$cookies 属性使用cookie:
app.$cookies.set(''uid'', res.uid);
app.$cookies.get('uid');
易族智汇(javashop)原创文章