标签：case 插件 Axios 封装 url break error message response

import axios from 'axios';
import { Message } from 'element-ui';

/**
 * 开发环境-专用
 * 本地代理
 */
// const baseURL = process.env.BASE_API;

/**
 * 生产环境-专用
 * Nginx代理
 */
const baseURL = process.env.API_ROOT;

/**
 * 1.创建axios实例
 */
const httpService = axios.create({
  baseURL: baseURL,
  timeout: 5 * 1000
});

/**
 * 2.设置请求拦截器
 */
httpService.interceptors.request.use(
  config => {
    /**
     * 根据条件可以让每个请求携带token
     * config.headers['User-Token'] = token;
     */
    // if (true) {
    //   config.headers['User-Token'] = '';
    // }
    return config;
  },
  error => {
    Promise.reject(error);
  }
);

/**
 * 3.设置响应拦截器
 */
httpService.interceptors.response.use(response => {
  const res = response.data;
  if (res.code !== 0 && res.code !== 1) {
    return new Error({
      status: res.code,
      message: res.msg
    });
  } else {
    return res;
  }
},
error => {
  if (error && error.response) {
    switch (error.response.status) {
      case 400:
        error.message = '错误请求';
        break;
      case 401:
        error.message = '未授权，请重新登录';
        break;
      case 403:
        error.message = '拒绝访问';
        break;
      case 404:
        error.message = '请求错误,未找到该资源';
        break;
      case 405:
        error.message = '请求方法未允许';
        break;
      case 408:
        error.message = '请求超时';
        break;
      case 500:
        error.message = '服务器端出错';
        break;
      case 501:
        error.message = '网络未实现';
        break;
      case 502:
        error.message = '网络错误';
        break;
      case 503:
        error.message = '服务不可用';
        break;
      case 504:
        error.message = '网络超时';
        break;
      case 505:
        error.message = 'http版本不支持该请求';
        break;
      default:
        error.message = '未知错误';
    }
  } else {
    error.message = '服务器连接超时';
  }
  /**
   * 全局提示请求异常
   * Message.error(error.message);
   */
  Message.error(error.message);
  return Promise.reject(error);
});

/**
 * GET
 * @param {} url
 * @param {*} params
 * @returns
 */
export function get (url, params = {}) {
  return new Promise((resolve, reject) => {
    httpService({
      url: url,
      method: 'get',
      params: params
    }).then(response => {
      resolve(response);
    }).catch(error => {
      reject(error);
    });
  });
};

/**
 * POST
 * @param {*} url
 * @param {*} params
 * @returns
 */
export function post (url, params = {}) {
  return new Promise((resolve, reject) => {
    httpService({
      url: url,
      method: 'post',
      params: params
    }).then(response => {
      resolve(response);
    }).catch(error => {
      reject(error);
    });
  });
}

/**
 * 文件上传
 * @param {} url
 * @param {*} params
 * @returns
 */
export function fileUpload (url, params = {}) {
  return new Promise((resolve, reject) => {
    httpService({
      url: url,
      method: 'post',
      headers: { 'Content-Type': 'multipart/form-data' }
    }).then(response => {
      resolve(response);
    }).catch(error => {
      reject(error);
    });
  });
}

export default {
  get,
  post,
  fileUpload
};

标签：case,插件,Axios,封装,url,break,error,message,response
来源： https://www.cnblogs.com/esaybook/p/16086136.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。