Vue中怎么根据Token来进行跳转页面和axios请求拦截

首先我们来说一下怎么拦截axios请求并添加head请求头
首先我们找到main.js
在main.js里面进行判断

import {getToken} from '@/utils/auth'   //封装的缓存文件
axios.interceptors.request.use(config => {
  let token = getToken();
  if (token) {// 判断是否存在token，如果存在的话，则每个http header都加上token
    config.headers.Authorization = 'Token token="'+token+'"';     //这个地方的前面根据自己需要的api来进行修改
    config.headers.type="multipart/form-data";
    config.headers.contentType="multipart/form-data";
  }
  return config
}, error => {
  return Promise.reject(error)
})

然后我们来说一下怎么根据Token来进行跳转页面
首先我们的逻辑肯定是如果没有token的话跳转登陆页面如果有的话跳转首页

然后根据逻辑开始。还是在main.js中进行代码判断

router.beforeEach((to, from, next) => {
  let token = getToken();
  console.log(token)
    if(token){ //判断本地是否存在access_token
      next();
    }else {
      if(to.path === '/login'){
        next();
      }else {
        next({
          path:'/login'
        })
      }
    }
});