张家界网站定制网址域名查询ip地址

token是有时效时间的，存在一种情况：表单提交，不知道用户要提交多久时间，可能会有填了一个小时刚写完结果点击提交回到登录页面了。

为提升用户体验——token无感刷新

登录的时候返回短token（失效时间短）

401代表短token失效

请求拦截器：

service.interceptors.request.use(function (config) {// 对非登录和刷新Token的请求，添加Authorization头if (config.url !== "/login") {config.headers["Authorization"] = `Bearer ${localStorage.getItem("token")}`;}// 对刷新Token的请求，使用refresh_tokenif (config.url === "/refresh_token") {config.headers["Authorization"] = `Bearer ${localStorage.getItem("refresh_token")}`;}return config;},function (error) {return Promise.reject(error);}
);

config.headers["Authorization"]意思是添加到请求头的Authorization字段中，格式为Bearer <token>

响应拦截器：

service.interceptors.response.use(async function (response) {// 成功响应：保存新的 Token 和 Refresh Tokenif (response.data.code === 0) {response.data.data.token && localStorage.setItem("token", response.data.data.token);response.data.data.refresh_token && localStorage.setItem("refresh_token", response.data.data.refresh_token);return response.data.data;} // Token 过期（401 状态码）else if (response.data.code === 401) {// 尝试刷新 Tokenconst res = await getRefresh();if (res) {// 用新 Token 重发原请求response.config.headers.Authorization = `Bearer ${localStorage.getItem("token")}`;const result = await service.request(response.config);return result;}}},function (error) {return Promise.reject(error);}
);

这个写法的意思是如果前面为true，就走后面的逻辑；如果前面为false，后面就不走了

类似于：

这是在请求刷新token的时候携带长接口，然后就能拿到最新的短token

然后表单再提交的时候就携带这个短token就行

在调用getRefresh也是接口请求，也会走上面这段，还会把最新的短token放到localStorage里

为什么不直接设置一个长token？还要设置一个短token？

token一直不变会有安全性问题

总结：

1.获取后端数据的时候，安全性是怎么保证的？

token认证

2.token认证的过程？描述一下

短token失效，就携带长token去请求新的短token，然后再提交表单的时候携带短token去请求

3.token认证的token是怎么携带的？

通过header携带

4.header携带的好处？是不是一定要放在header携带？

符合http标准、不放在url更安全

也可以放在cookie里，但是存在跨域问题

5.token无感刷新有听过吗？应用场景？简单说一说过程？

如上