• vue配置请求拦截器和响应拦截器


    首先确保我们已经设置的store.js进行值的存取,这时候我们需要配置请求和响应的拦截器设置

    main.js

    import Vue from 'vue'
    import App from './App'
    import router from './router'
    import ElementUI from 'element-ui'
    import 'element-ui/lib/theme-chalk/index.css'
    import axios from 'axios'
    // 引入store 
    import store from './store'
    
    // 如何localStorage的token不存在或是空跳转到路由
    router.beforeEach((to, from, next) => {
      if (to.path === '/') {
        next();
      } else {
        let token = window.localStorage.token;
        if (token === 'null' || token === '' || token === undefined) {
          next('/');
        } else {
          next();
        }
      }
    
    })
    
    
    
    
    //与后端定义状态是100签名错误 跳转到登录界面
    axios.interceptors.response.use(
      response => {
        //当返回信息为未登录或者登录失效的时候重定向为登录页面
        if (response.data.status == 100 || response.data.message == '用户未登录或登录超时,请登录!') {
          router.push({
            path: "/",
            querry: { redirect: router.currentRoute.fullPath }//从哪个页面跳转
          })
        }
        return response;
      },
      error => {
        return Promise.reject(error)
      }
    )
    

      

  • 相关阅读:
    leepcode题目解析4
    Python爬虫6-利用ProxyHandler设置代理服务器
    Python爬虫5-利用usergent伪装访问方式
    Python爬虫4-URLError与HTTPError
    Python爬虫3-parse编码与利用parse模拟post请求
    中间件
    跨域
    ORM中的锁和事务
    cookie和session
    之Ajax
  • 原文地址:https://www.cnblogs.com/Jack-cx/p/12081745.html
Copyright © 2020-2023  润新知