Axios 是一個基于 promise 的 HTTP 庫，可以用在瀏覽器和 node.js 中。很多情況我們要對請求和其響應(yīng)進行特定的處理；如果請求數(shù)非常多，單獨對每一個請求進行處理會變得非常麻煩。好在強大的axios為開發(fā)者提供了這樣一個API：攔截器。攔截器分為 請求（request）攔截器和 響應(yīng)（response）攔截器。

安裝 axios,qs

npm install axios –save-dev

安裝 qs

npm install qs –save-dev

請求攔截器

//引入axios和 qs
import axios from "axios";
import qs from "qs";
/****** 創(chuàng)建axios實例 ******/
const serve = axios.create({
    baseURL: process.env.BASE_URL,  // api的基本url，也可以直接寫定好的url
    timeout: 5000  // 請求超時時間
});
serve.interceptors.request.use(config => {    
    config.method === 'post'        
        ? config.data = qs.stringify({...config.data})        
        : config.params = {...config.params};    
          config.headers['Content-Type'] = 'application/x-www-form-urlencoded'; 
    return config;
    }, error => {  //請求錯誤處理   
           
        Promise.reject(error)
    }
);

響應(yīng)攔截器

serve.interceptors.response.use(    
    response => {  //成功請求到數(shù)據(jù)        
           
        //這里根據(jù)后端提供的數(shù)據(jù)進行對應(yīng)的處理        
        if (response.data.result === 'TRUE') {            
            return response.data;        
        } else { 
            //打印錯誤信息
            console.error(response.data.data.msg)
             
        }    
    },    
    error => {  //響應(yīng)錯誤處理console.log('error');        
        console.error(error);        
        console.error(JSON.stringify(error));         
        let text = JSON.parse(JSON.stringify(error)).response.status === 404            
            ? '404'            
            : '網(wǎng)絡(luò)異常，請重試';        
        alert(text)        
        return Promise.reject(error)   
    }
)