【token 和 refreshtoken】

一，token

1.响应拦截器拿到从浏览器获得的数据

2.响应拦截器把获得的数据return出去

3.浏览器拿到从响应拦截器return的数据

 响应拦截器的参数就是浏览器要打印的res内容 拦截器返回什么 浏览器就拿到什么

如果响应拦截器中没有return error参数 那服务器并不知道拦截器中是有错误的 依然会进入到.then里 并且在在.then里·打印error函数里返回到内容

那我们利用这个特性干的事情就是： 在响应拦截器中不返回error 这样即使程序出现了错误 但是继续进入到.then里 不影响程序的后续执行

 发送登陆请求时 是拿到了两个token

 

【模拟token过期】

  在应用的本地存储里 改变token值 再刷新一下 就可以让token失效 模拟token失效

 模拟token过期后 代码会报错 响应拦截器里面就会进入到error函数里 执行error函数里的内容，那我们就要在error函数里 去发送一次请求 把过期的token换成新的refresh_token

首先要去请求token

根据接口文档 刷新用户token也是需要请求头的 请求头中需要携带存放在store里的refresh—token 那就如上写，因为axios库是基于promise封装的 是异步代码 所以我们发送请求时 要使用async和await

 在请求处写await 在请求所在的函数处写async

 拿到了刷新token请求的数据 并打印这个res数据

 解决这个报错：把原本的已经封装好了基地址的request对象换成axios对象 并在请求中把基地址加上

 解决完报错后 我们就拿到了第三次请求获得的res内容

 从第三次请求中拿到的数据里 data里的token就是我们要的 刷新之后的token

我们就需要用这个新获取到的token替换掉存储在store里的老token

 我们之前在把token存在state里时 还定义里一个修改token的changeToken方法 所以我们现在要修改token是，就调用这个方法

 之前讲过 如果要调用mutation里的方法 语法是this.$store.commit(方法名，载荷)

 调用修改token的方法 用第三次请求得到的token替换掉存储在state里的老token

 这时在登陆页做一个路由参数的判断 如果我们进入登陆页时 是从另外一个页面 跳转到登陆页时 我们登陆之后 就回到之前那个页面 那如果 我们在登陆页 没有参数时 那就是直接去我的页面

 

 和制定路由规则相关的 都是路由信息对象 名词 route

和路由方法有关 比如说做路由跳转 动词 router

在登陆两个小时之后 token过期 在访问“我的”页面”时 会发送一个携带了过期token的错误请求 服务器就会返回一个401的错误 但是这个错误被响应拦截器拦截下来了 没有返回给浏览器

这个过程中 响应拦截器 亡羊补牢 去发送了一个更新token的请求 拿到新的token结果后 去替换掉原本旧的token 这个时候浏览器 再发请求请求 就可以顺利拿到数据了

 在state里存储的tokenObj对象里 有两个数据 一个token 一个refresh_token

二，refreshtoken

但是我们调用修改方法 只传了一个token 这样是不行的

 现在要在调用修改token的这个方法的载荷里 把token和refresh_token都写上 token就是从第三次请求中得到的token中来 refresh_token就是原本的refresh_token

 

如果token过期 那么就在响应拦截器中拦截错误 并发送请求 获取新的token 并把新的token替换掉原本的token；如果refreshtoken也过期 那么就让用户重新登陆

【无感刷新】

在我们第三次请求发送完成后 内存中获取到了最新的token 但是页面依然是没有内容的 需要手动的刷新一下 才可以获取页面内容

刷新是为了手动发送请求 获取数据。无感刷新是系统内部发送请求，悄咪咪的把数据更新好。

那么这个请求就用原本失败的请求来发（这里面 路径 方式 请求头都有）但是token用新的

 当token过期 发送请求失败时 服务器会返回401的错误 但是在这个错误的config中 存放了我们这次请求的所有内容

 【refresh_token】过期

【模拟refresh_token过期】就是在本地存储里修改refresh_token的值 然后刷新页面

 

 用try{} catch {} 来捕获请求错误的情况，把整段要检验正误的代码放在try代码块里 然后如果代码有错误 就会执行catch代码块里的内容

 现在把第三次请求的内容放进了try里 如果refresh_token也过期 就会报500的错误 这个时候就会进入catch里