import axios from 'axios' import qs from 'qs' import Vue from 'vue' var vm=new Vue() import Element from 'element-ui' var ports=window.sessionStorage.ports; axios.interceptors.request.use(config => { return config }, resor => { return Promise.reject(resor) }) axios.interceptors.response.use(response => { return response }, resor => { return Promise.resolve(resor.response) }) function checkStatus (response) { // 如果http状态码正常,则直接返回数据 if (response && (response.status === 200 || response.status === 304)) { return response.data // 如果不需要除了data之外的数据,可以直接 return response.data }else if(response &&response.status === 400 ){ return { status: 400, message: '参数不匹配', result:false } } // 异常状态下,把错误信息返回去 return { status: -404, message: '网络异常', result:false } } export default { post (url,data) { return axios({ method: 'post', baseURL: ports, url, data: qs.stringify(data), timeout: 10000, }).then( (response) => { return checkStatus(response) } ).then((res)=>{ if(res.result){ return Promise.resolve(res.model) }else{ // vm.$alert(res.message,'错误提示') return Promise.reject(res) } }) }, postJson (url,data) { return axios({ method: 'post', baseURL: ports, url, data: data, headers:{ 'Content-Type':'application/json; charset=utf-8' }, timeout: 10000, }).then( (response) => { return checkStatus(response) } ).then((res)=>{ if(res.result){ return Promise.resolve(res.model) }else{ // vm.$alert(res.message,'错误提示') return Promise.reject(res) } }) }, postFormData (url,data) { return axios({ method: 'post', baseURL: ports, url, data: qs.stringify(data), timeout: 10000, headers: { 'Content-Type': 'application/x-www-form-urlencoded' } }).then( (response) => { return checkStatus(response) } ).then((res)=>{ if(res.result){ return Promise.resolve(res.model) }else{ // vm.$alert(res.message,'错误提示') return Promise.reject(res) } }) }, get (url,params) { return axios({ method: 'get', baseURL: ports, url, params, // get 请求时带的参数 timeout: 10000, }).then( (response) => { return checkStatus(response) } ).then((res)=>{ if(res.result){ return Promise.resolve(res.model) }else{ // vm.$alert(res.message,'错误提示') return Promise.reject(res) } }) } }
另一种封装方式:
import axios from 'axios' axios.defaults.timeout = 10000 axios.defaults.headers.post['Content-Type'] = 'application/x-www=form-urlencoded' let port = ''; //请求方法 export default{ fetchGet (url, params) { params = params?this.setParams(params):{}; return new Promise((resolve, reject) => { axios.get(this.getPocPort() + url, {params}).then(res => { resolve(res.data) }).catch(error => { reject(error) }) }) }, fetchQuickSearch (url) { return new Promise((resolve, reject) => { axios.get(this.getPocPort() + url).then(res => { resolve(res.data) }).catch(error => { reject(error) }) }) }, fetchPost (url, params) { params = params?this.setParams(params):{}; return new Promise((resolve, reject) => { axios.post(this.getPocPort() + url, params).then(res => { resolve(res.data) }).catch(error => { reject(error) }) }) }, fetchPostJson(url, params) { return new Promise((resolve, reject) => { axios.post(this.getPocPort() + url, params).then(res => { resolve(res.data) }).catch(error => { reject(error) }) }) }, setParams(params){ let fdata = new URLSearchParams(); for(let attr in params){ fdata.append(attr,params[attr]); } return fdata; }, getPocPort(){ if(!port){ port = localStorage.getItem('pocPort'); } return port; } }
js中引入方式:
import http from './public' const port = ''; // 考核类型 export const page = (params) => { return http.fetchPost(port + '/channel/channelPage', params) }