axios拦截器，实现token认证和路由守卫_axios token

token的引入：

• token是在客户端频繁向服务端请求数据，服务端频繁的去数据库查询用户名和密码并进行对比，判断用户名和密码正确与否，并作出相应提示，在这样的背景下，token便应运而生。

token的定义：

• token是服务端生成的一串字符串，以作客户端进行请求的一个令牌，当第一次登录后，服务器生成一个token便将此token返回给客户端，以后客户端只需带上这个token前来请求数据即可，无需再次带上用户名和密码。

使用token的目的：

• 简单地说，token的使用就是为了数据安全，前台是通过接口路径（URL）的调用来获取数据的，如果恶意的第三方知道了某一个接口路径，那么，他便可以直接通过接口路径在网页上直接获取该接口的所有数据信息。如果添加了token，类似于这种恶意的行为便不会产生。

token的验证流程:

1. 客户端使用用户名跟密码请求登录
2. 服务端收到请求，去验证用户名与密码
3. 验证成功后，服务端会签发一个 token，再把这个 token 发送给客户端
4. 客户端收到 Ttoken 以后可以把它存储起来，比如放在 sessionStorage 里或者 localStorage 里
5. 客户端每次向服务端请求资源的时候需要带着服务端签发的 token
6. 服务端收到请求，然后去验证客户端请求里面带着的 token，如果验证成功，就向客户端返回请求的数据

axios的[拦截器] :

// Add a request interceptor
axios.interceptors.request.use(function (config) {
   
    // Do something before request is sent
    return config;
  }, function (error) {
   
    // Do something with request error
    return Promise.reject(error);
  });

// Add a response interceptor
axios.interceptors.response.use(function (response) {
   
    // Do something with response data
    return response;
  }, function (error) {
   
    // Do something with response error
    return Promise.reject(error);
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20