Docs
- OAuth2
OAuth 2.0 是行业标准授权协议。OAuth 2.0 注重客户端开发人员的简单性，同时为 Web 应用程序、桌面应用程序、移动电话和客厅设备提供特定的授权流程。
- JWT的加密解密原理，token登出、改密失效、自动续期
- 项目中前端如何实现无感刷新 token！
评论区很有意思，关于由前端来控制 Token 还是后端来控制 Token 吵的不可开焦。可以了解在前后端两个角度是如何看待 Token 刷新这件事情。
- 无感刷新token怎样实现？前后端案例代码手把手带你实现！
- axios如何利用promise无痛刷新token
axios 封装无感刷新 token 的案例参考。
- 复盘双token方案在项目中的实际应用
- jwt续签为什么要使用双token,没看明白啊，感觉单个token也可以啊?
通过问题回答方式去了解单双 Token 的优缺点。
需求点分析
- 登陆状态失效捕获
- 登陆状态无感刷新
- 支持多个网络请求重发
Token 认证方案分析
单 Token 方案
- 基础方案
- 设置过期时间范围 Time
- token 距离过期时间在 Time 时间范围内，就刷新过期时间。
- 如果 token 确认已经过期就拒绝请求。
基础方案问题
- 还是会出现用户在持续登录时出现 Token 失效问题
- token 30分钟，Time 1分钟
- 用户在 28分钟 操作触发一次网络请求
- 然后接着操作APP，用户在31分钟 操作触发一次网络请求，但是实际已经过期了。
- 可能多个网络请求同时触发服务端 Token 刷新处理
后端可以对 Token 做状态标记处理，如果 Token 确认失效需要加上状态标记，那么进行刷新 Token 步骤时，通过状态拒绝当前用户(相同 Token )其他的请求。
- 修改方案: 取消 Time ，每次接口请求都刷新 Token 过期时间。但是依旧会触发 Token 失效，因为有可能间隔操作超过一个 Token 时间。
- 修改方案: 延长 token 时间 为 1 天。但是存在 Token 滥用安全问题，前端已经无法控制，后端需要有足够的异常访问风险识别能力。
双 token 方案
基于 OAuth2 的 access tokens(访问令牌)、refresh tokens(刷新令牌) + JWT 的方案
基础概念
- access tokens
- access tokens 的生命周期相对较短，比如 30 分钟。
- access tokens 是客户端用于向资源服务器发出请求的字符串标识。
- refresh tokens
- refresh tokens 的生命周期相对较长，比如 3 天。
- refresh tokens 的存在是为了使授权服务器能够使用 refresh tokens 的短生命周期，而无需在 token 过期时让用户参与。
- tokens
- 令牌不限制任何特定格式，比如字符串、JWT。
- 基础方案
- 客户端发起登陆认证请求，服务端下发 access token 和 refresh token。
- 客户端将 refresh token 和 access token 保存。后续请求中如果 请求头都会带上 access token。
- 如果服务端报错 access token 过期。客户端请求刷新 access token，refresh token 作为请求内容。
- 服务端收到刷新请求，返回新的 refresh token 和 access token。
基础方案问题
- 假如有多个请求，那么如何更新请求头加入新的 access token，以及进行按发起顺序做重发处理。
封装实例
- webpack-react-cli/request.ts
- webpack-react-cli/cacheRequestTest.ts
刷新 token + 重试请求队列的模拟 Demo
总结
- 网页端 H5 不建议双 Token 方案，单 Token 机制就够用，只是部分用户体验稍差。因为网页端保存 refresh token 数据到本地 Storage 有一定安全风险。
- 客户端 App 可以使用双 Token 方案。因为客户端的缓存保存 refresh token 安全风险相对较小。
