token生成与过期机制 前端交互、token续期机制后端实现
2019-05-22 本文已影响0人
在路上phper
这节把前面几节学习的内容在前端进行展现 结合前面学习的axios的拦截器实现token的续期(如何续期呢 难道让用户手工点击续期 这样体验很差)如何实现token的自动续期呢
这节先说下后端token续期机制
在学续期机制前 把前两节学到的token过期机制在前台页面演示下
首先准备个页面
内容如下

其中login方法 里面 是请求获取token并且将token保存到localStorage里面
然后在axios的request拦截器里设置获取localStorage里的token
其中config参数里面的url是当前请求的具体url地址 不包括baseURL部分
然后在我们请求新闻地址时自动加上token参数 才能获取成功
这个在拦截器中配置的
具体代码如下


运行效果

首先点击获取token



在点击下面获取新闻 在法定时间内显示如上status为ok 但是在过几秒在点击获取新闻
出现如下 status为refresh_token表示超过了法定时间 但是redis里还没过期 这时前端需要续期(如何续期下节会接触到)

然后在过会再次点击获取新闻
出现如下

表示token过期了
同理如果我们运行页面时不点击获取token按钮直接获取新闻也是不能获取的
最后说下后端token续期做法
