1, the background

In order to simplify the process of some requests, I read and learned the documents on axios official website and configured them. Simple configuration based on personal VUE project // Import some necessary packages or modules (or libraries).Copy the code

import axios from ‘axios’;

import qs from ‘qs’;

import Cookies from “js-cookie”;

import {Toast} from ‘vant’;

import router from ‘@/router’

``` ``` /* Check whether the token exists */Copy the code

Token / / Settings

let cancelToken=axios.CancelToken; let source=cancelToken.source()

/ Set the header /

const http=axios.create({ baseURL:’/’,

timeout:4999,

headers:{ “Content-Type”: “application/x-www-form-urlencoded; charset=utf-8” },

responseType:’json’,

withCredentials:true,

Proxy: {/ / agent

Host :'127.0.0.1',// port: 9999, auth:{},Copy the code

},

MaxContentLength :9999,// Maximum response size})

// All requests wait 2.9 seconds before timeout

http.defaults.timeout=2999

/ response server side /

http.interceptors.request.use(config=>{

if(
  config.method.toLocaleLowerCase()==='POST'||
  config.method.toLocaleLowerCase()==='PUT'||
  config.method.toLocaleLowerCase()==='DELETE'||
  config.method.toLocaleUpperCase()==='post'||
  config.method.toLocaleUpperCase()==='put'||
  config.method.toLocaleUpperCase()==='delete')
{
  config.data=config.data
}
if(Cookies.get('Token')){
  config.headers['token'] = Cookies.get('Token')
}
Copy the code

return config

},error => {

 Toast.fail({
   message:error,
   duration:3*1000
 })
 return Promise.reject(error)
Copy the code

})

/ Sent to the server side /

http.interceptors.response.use(response=>{

const res = response.data

Toast.loading({

message:'loading',

duration:0,
Copy the code

})

if(res.data && ! res.success){

Toast.fail({

  message:res.data.errors,
  
  duration:3*1000
  
})

return Promise.reject('error')
Copy the code

} return res

},error => {

/ Check whether the token expires /

let lifeTime=JSON.parse(Cookies.get(‘TokenTime’))

let newTime=new Date().getTime()

if(newTime>lifeTime){

Toast({type:'fail', message:' Login information has expired, please login again ', Remove (' token ') cookie. remove('TokenTime') router.push({path:'/login'})Copy the code

}

/ All kinds of mistakes /

Else {/ status code 404 500/

if(error && error.response){ switch (error.response.status) { case 500: Toast({type:'fail', message:' Server under maintenance, please visit later ', duration:3*1000}) Router.push ({path:'/error/500'}) break case 404: Toast({type:'fail', message:' Current resource not found ', duration:3*1000}) Router.push ({path:'/error/404'}) break case 401: Toast({type:'fail', message:' access timeout, please login again ', duration:3*1000}) router.push({path:'/login'}) break default: Toast({type:'fail', message: 'connection failed ${error.response.status}, Duration :3*1000})}} else{Toast({type:'fail', message:' remote server connection failure ', duration:3*1000})}Copy the code

} return Promise.reject(error)

})

export default http “`

Relevant parameters are written on it, if you don't understand, you can leave a message, thank you, if there is any modification, I will modify it in the first timeCopy the code