您的位置:首页 > 博客中心 > 前端开发 >

http.js 的封装

时间:2022-04-11 14:45

import axios from ‘axios‘; import iView from ‘iview‘; const baseApiObj = {   production: ‘https://imzt.bndxqc.com/api‘,   experience: ‘https://imztty.bndxqc.com/api‘,   test: ‘http://imzth5test.bndxqc.com/api‘,   development: ‘/api‘ } let baseApi = ‘/api‘; // 开发模式 if (process.env.NODE_ENV === ‘development‘){   baseApi = ‘/api‘; } else{   baseApi = baseApiObj[process.env.VUE_APP_TITLE] || ‘https://imzt.bndxqc.com/api‘; } // axios.defaults.timeout = 3000; // 请求拦截器 axios.interceptors.request.use(   config => {     // 每次发送请求之前判断是否存在token     // 如果存在,则统一在http请求的header都加上token,这样后台根据token判断你的登录情况     // 即使本地存在token,也有可能token是过期的,所以在响应拦截器中要对返回状态进行判断     // const token = sessionStorage.getItem("userToken");     // token && (config.headers.Authorization = ‘Bearer ‘ + token);     config.headers[‘Content-Type‘] = ‘application/json; charset=UTF-8‘;     return config;   },   error => {     return Promise.error(error);   }); // 响应拦截器 axios.interceptors.response.use(   response => {     // 如果返回的状态码为200,说明接口请求成功,可以正常拿到数据     // 否则的话抛出错误     if (response.status === 200) {       return Promise.resolve(response);     } else {       return Promise.reject(response);     }   },   // 然后根据返回的状态码进行一些操作,可自行扩展   error => {     if(error.message.includes(‘Network Error‘)){       iView.Message.error("网络错误,请检查网络连接");       return;      }     else if(error.message.includes(‘timeout‘)){       iView.Message.error("网络超时,请稍后重试");       return ;      }     else if (error.response && error.response.status) {       switch (error.response.status) {         //token过期,清除本地token         case 403:           iView.Message.error("token失效,请关闭重连");           // 清除token           localStorage.removeItem(‘userToken‘);           break;         //请求不存在         case 404:           iView.Message.error("网络请求不存在");           break;         //请求不存在         case 500:           iView.Message.error("服务器异常");           break;         //其他错误,直接抛出错误提示         //用户被登出         case 401:                      break;         default:           if(error.response.data && error.response.data.message){             iView.Message.error(error.response.data.message);           }       }       return Promise.reject(error.response);     }   } );
/**  * methods请求为GET  *  */ function getMethod(url, params) {   let headers = filterHeader();   headers[‘Content-Type‘] = ‘application/json; charset=UTF-8‘;   return new Promise((resolve, reject) => {     axios       .request({         url: baseApi + url,         method: "get",         params: { ...params },         headers       })       .then(res => {         resolve(res);       })       .catch(error => {         console.log(error);         reject(error);       });   }) }
/**  * methods 请求为POST  * data 请求格式  */
function postMethod(url, data) {   let headers = filterHeader();   return new Promise((resolve, reject) => {     axios.request({       url: baseApi + url,       method: ‘post‘,       // data: data,       params: { ...data },       transformRequest: [         function (data) {           data = JSON.stringify(data)         }       ],       headers     }).then(res => {       resolve(res)     }).catch((error) => {       console.log(error);       reject(error)     })   }) }

/**  * methods请求为POST  * data请求为JSON格式  */ function postJsonMethod(url, data, noUseToken, config={ timeout: 20 * 1000 }) {   const { timeout } = config;   let headers = filterHeader();   return new Promise((resolve, reject) => {     axios.request({       url: baseApi + url,       method: ‘post‘,       data: data,       timeout,       transformRequest: [         function (data) {           data = JSON.stringify(data)           return data         }       ],       headers     }).then(res => {       resolve(res)     }).catch((error) => {       console.log(error);       reject(error)     })   }) }
/**  * methods请求为DELETE  *  */ function deleteMethod(url, params) {   let headers = filterHeader();   return new Promise((resolve, reject) => {     axios.request({       url: baseApi + url,       method: ‘delete‘,       params: params,       headers     }).then(res => {       resolve(res)     }).catch(error => {       console.log(error);       reject(error)     })   }) }
/**  * methods请求为PUT  * data请求为JSON格式  */ function putMethod(url, data) {   let headers = filterHeader();   return new Promise((resolve, reject) => {     axios.request({       url: baseApi + url,       method: ‘put‘,       data: data,       headers     }).then(res => {       resolve(res)     }).catch(error => {       console.log(error);       reject(error)     })   }) }
/**  * @Description: 过滤请求头,默认加token和staffId  *               当noUseToken参数为true时,请求头不加参数  * @author lidonghui  * @date 2019/6/28 */ function filterHeader(noUseToken) {   const userToken = sessionStorage.getItem("userToken");   const staffId = sessionStorage.getItem("staffId");   if (noUseToken) {     return {}   } else {     return {       Authorization: "Bearer " + userToken,       staffId: staffId,     };   } }
export default {   postJsonMethod,   postMethod,   getMethod,   deleteMethod,   putMethod, }       使用  : import apiMethod from "@/libs/http";
//搜索联系人 export const imSearchMemberList = (data)=>{     return apiMethod.getMethod(‘/user/es/staffSearch/imSearch_v2‘,data) }

本类排行

今日推荐

热门手游