[JavaScript知识库]vue2-封装axios请求并设置请求拦截器

在vue2的管理系统平台中，我们会遇到，如果是登陆之后，用户长期不操作，但是我们要提示用户登录已过期请重新登录之类的操作，页面重定向。

一般我们接口请求中都会一个token，这个token是在登陆成功之后，后端给你请求接口鉴权使用的，但是token是有服务期限的，即token超时后会失效，这个失效时间需要后端设置的，当然前端可以跟他商量一下。下面是全部代码，既有axios请求封装，又有拦截器，请看以下request.js：

import axios from 'axios'
// import {Message} from 'element-ui';
import Cookies from 'js-cookie'
import router from '@/router'
import qs from 'qs'
import store from '@/store'
import { clearLoginInfo } from '@/utils'
import isPlainObject from 'lodash/isPlainObject'

let cancelTokenArr = [] //储存cancel token
// request拦截器
const http = axios.create({
    baseURL: window.SITE_CONFIG['apiURL'],
    timeout: 1000 * 180,
    withCredentials: true
})

/**
 * 请求拦截
 */
http.interceptors.request.use(config => {
    config.headers[

开通VIP 解锁文章