当前位置： 移动技术网 > IT编程>开发语言>JavaScript > 164Vue工程化2-挂载路由导航守卫+退出清除token+axios请求拦截器添加携带token

164Vue工程化2-挂载路由导航守卫+退出清除token+axios请求拦截器添加携带token

2020年08月14日  | 移动技术网IT编程  | 我要评论
router文件夹的index.js// 挂载路由导航守卫router.beforeEach((to, from, next) => { // to 将要访问的路径 // from 代表从哪个路径跳转而来 // next 是一个函数，表示放行 // next() 放行 next('/login') 强制跳转 if (to.path === '/login') return next() // 获取token const tokenStr = win

router文件夹的index.js
在这里插入图片描述

// 挂载路由导航守卫
router.beforeEach((to, from, next) => {
  // to 将要访问的路径
  // from 代表从哪个路径跳转而来
  // next 是一个函数，表示放行
  //     next()  放行    next('/login')  强制跳转

  if (to.path === '/login') return next()
  // 获取token
  const tokenStr = window.sessionStorage.getItem('token')
  if (!tokenStr) return next('/login')
  next()
})

退出清除token

在这里插入图片描述

在这里插入图片描述

axios请求拦截器添加携带token

config.headers就是请求头
在这里插入图片描述

// 请求拦截器
axios.interceptors.request.use(config => {
  // console.log(config)
  config.headers.Authorization = window.sessionStorage.getItem('token')
  // 在最后必须 return config
  return config
})

本文地址：https://blog.csdn.net/Gy_9543/article/details/107946773

您可能感兴趣的文章:

如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网