zoukankan      html  css  js  c++  java
  • vue之axios拦截

    1 state: {
    2     token: db.get('USER_TOKEN')
    3   }

    二、axios设置

    // 统一配置
    let FT = axios.create({
      baseURL: '',
      responseType: 'json',
      validateStatus (status) {
        // 200 外的状态码都认定为失败
        return status === 200
      }
    })
    
    // 拦截请求
    FT.interceptors.request.use((config) => {
      let expireTime = store.state.account.expireTime
      let now = moment().format('YYYYMMDDHHmmss')
      // 让token早10秒种过期,提升“请重新登录”弹窗体验
      if (now - expireTime >= -10) {
        Modal.error({
          title: '登录已过期',
          content: '很抱歉,登录已过期,请重新登录',
          okText: '重新登录',
          mask: false,
          onOk: () => {
            return new Promise((resolve, reject) => {
              db.clear()
              location.reload()
            })
          }
        })
      }
      // 有 token就带上
      if (store.state.account.token) {
        config.headers.Authentication = store.state.account.token
      }
      return config
    }, (error) => {
      return Promise.reject(error)
    })
    
    // 拦截响应
    FT.interceptors.response.use((config) => {
      return config
    }, (error) => {
      if (error.response) {
        let errorMessage = error.response.data === null ? '系统内部异常,请联系网站管理员' : error.response.data.message
        switch (error.response.status) {
          case 404:
            notification.error({
              message: '系统提示',
              description: '很抱歉,资源未找到',
              duration: 4
            })
            break
          case 403:
          case 401:
            notification.warn({
              message: '系统提示',
              description: '很抱歉,您无法访问该资源,可能是因为没有相应权限或者登录已失效',
              duration: 4
            })
            break
          default:
            notification.error({
              message: '系统提示',
              description: errorMessage,
              duration: 4
            })
            break
        }
      }
      return Promise.reject(error)
    })
  • 相关阅读:
    算法学习——贪心篇
    Centos7下搭建LAMP环境,安装wordpress(不会生产博客,只是一名博客搬运工)(菜鸟)
    小白创建网站的曲折之路
    7.2.5 多层嵌套的if语句
    7.2.4 else与if配对
    7.2.3
    7.4 electirc.c -- 计算电费
    oracle数据库命令行查看存储过程
    Linux下如何查看进程准确启动时间
    7.2 if else 语句
  • 原文地址:https://www.cnblogs.com/yangshuzhong/p/11412113.html
Copyright © 2011-2022 走看看