## axios封裝和使用 ~~~ import axios from 'axios' import store from '@/store' import { Message } from 'element-ui' import {getCookie} from '@/utils/cookie' const CancelToken = axios.CancelToken var cancel; var service=axios.create({ baseURL:process.env.BASE_API, timeout:5000 }) //添加請求攔截器 service.interceptors.request.use(function(config){ if(store.getters.token){ config.headers['TOKEN']=getCookie('TOKEN') } return config },function(error){ return Promise.reject(error) }) //添加響應攔截器 axios.interceptors.response.use(function(response){ /** * 下面的注釋為通過在response里，自定義code來標示請求狀態 * 當code返回如下情況則說明權限有問題，登出并返回到登錄頁 * 如想通過xmlhttprequest來狀態碼標識 邏輯可寫在下面error中 */ // response => { // const res = response.data // if (res.code !== 20000) { // }) // // 50008:非法的token; 50012:其他客戶端登錄了; 50014:Token 過期了; // if (res.code === 50008 || res.code === 50012 || res.code === 50014) { // }).then(() => { // }) // }) // } // return Promise.reject('error') // } else { // return response.data // } // }, return response },function(error){ console.log('err'+error) Message({ Message:error.message, type:'error', duration:5*1000 }) return Promise.reject(error) } ) export default{ //get請求 get(url,param){ //promise示例 // axios.post('/user', { // firstName: 'Fred', // lastName: 'Flintstone' // }) // .then(function (response) { // console.log(response); // }) // .catch(function (error) { // console.log(error); // }); return new Promise((resolve,reject)=>{ service({ method:'get', url, params:param, cancelToken:new CancelToken(c=>{ cancel=c }) }).then(res=>{ //axios返回的是一個promise對象 resolve(res) //resolve在promise執行器內部 }).catch(err=>{ console.log(err,'異常') }) }) }, //post請求 post(url,param){ return new Promise((resolve,reject)=>{ service({ method:'post', url, data:param, cancelToken:new CancelToken(c=>{ cancel=c }) }).then(res=>{ resolve(res) }).catch(err=>{ console.log(err,'異常') }) }) } } // export default service ~~~