import axios from 'axios' import store from '../vuex/store' import router from '../router/index' import { stringify } from 'qs' //qs模塊 // axios 配置 axios.defaults.timeout = 5000; axios.defaults.baseURL = ''; // http request 攔截器 axios.interceptors.request.use( config => { if (store.state.token) { config.headers.Authorization = `token ${store.state.token}`; } return config; }, err => { return Promise.reject(err); }); // http response 攔截器 axios.interceptors.response.use( response => { return response; }, error => { if (error.response) { switch (error.response.status) { case 401: // 401 清除token信息並跳轉到登陸頁面 //store.commit(types.LOGOUT); router.replace({ path: 'login', query: {redirect: router.currentRoute.fullPath} }); break; case 403: break; case 504: break; case 500: //store.dispatch(types.AJAX_ERROR,500); break; case 404: //store.dispatch(types.AJAX_ERROR,404); break; } } console.log(JSON.stringify(error));//console : Error: Request failed with status code 402 return Promise.reject(error.response.data) }); /*{ type:type, params:params, }*/ // 封裝請求 export function fetch (url, options) { var opt = options || {} return new Promise((resolve, reject) => { axios({ method: opt.type || 'post', url: url, params: opt.params || {}, // 判斷是否有自定義頭部,以對參數進行序列化。不定義頭部,默認對參數序列化爲查詢字符串。 data: (opt.headers ? opt.data : stringify(opt.data)) || {}, responseType: opt.dataType || 'json', // 設置默認請求頭 headers: opt.headers || {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'} }).then(response => { if (response.data.code === 0) { resolve(response.data) } else if (response.data.code === '000') { resolve(response.data) } else { reject(response.data) //store.commit('SET_LOADING', false) } }).catch(error => { console.log(error) reject(error) //store.commit('SET_LOADING', false) }) }) } export default axios;
使用axios封裝的功能vue
import { fetch } from '../../util/api' //用戶登陸 export const userLogin= (data)=> fetch('/api/users/api/userLogin',{ data, 'type':'post' });