多个baseURL axios的封装

分为三种方法

第一种

import axios from 'axios'

class Request {
  constructor(props) {
    this.init(props)
  }
  init(props) {
    let servicesList = {
      baseURL: props && props.baseURL props.baseURL : process.env.T_API,
      timeout: props && props.timeout props.timeout : 10000,
      withCredentials:
        props && props.withCredentials props.withCredentials : true,
    }
    // 创建axios实例
    const service = axios.create(servicesList)
    service.interceptors.request.use(
      (request) => {
        return request
      },
      (error) => {
        console.log('request error:' + error)
        return Promise.reject(error)
      }
    )

    service.interceptors.response.use(
      (response) => {
        if (response.status === 200) {
          return response.data
        }
        console.error('response status except:' + response.status)
        Promise.reject()
      },
      (error) => {
        console.log('response error:' + error)
        return Promise.reject(error)
      }
    )
    this.service = service
  }
}
class RequestOther extends Request {
  init(props) {
    super.init(props)
    return this.service
  }
}
const request = new Request().service
const requestOther = new RequestOther()
// debugger
export { request, requestOther }

//应用
import {requestOther} from "@/utils/request copy.js";
let servicesParams = {
  baseURL: process.env.T_API,
  timeout: 3000,
  withCredentials: true
}
let request = requestOther.init(servicesParams)
import {request} from "@/utils/request copy.js";

第二种

import axios from 'axios'

class AxiosCommon {
  static common(props) {
    let servicesParams = {
      baseURL: props && props.baseURL props.baseURL : '',
      timeout: props && props.timeout props.timeout : 10000,
      withCredentials:
        props && props.withCredentials props.withCredentials : true,
    }
    // 创建axios实例
    const service = axios.create(servicesParams)
    service.interceptors.request.use(
      (request) => {
        return request
      },
      (error) => {
        console.log('request error:' + error)
        return Promise.reject(error)
      }
    )

    service.interceptors.response.use(
      (response) => {
        if (response.status === 200) {
          return response.data
        }
        console.error('response status except:' + response.status)
        Promise.reject()
      },
      (error) => {
        console.log('response error:' + error)
        return Promise.reject(error)
      }
    )
    return service
  }
}
class Request {
  constructor(props) {
    return AxiosCommon.common(props)
  }
}
class RequestCustom {
  init(props) {
    return AxiosCommon.common(props)
  }
}
const request = new Request()
const requestCustom = new RequestCustom()
// debugger
export  { request, requestCustom }
//应用
import {requestCustom } from '@/utils/request_test2'
const props = {
  baseURL: process.env.T_API,
  withCredentials: true,
}
let request = requestCustom.init(props)

第三种

import axios from "axios";
let serviceParams = {
  baseURL: '',
  timeout: 3000,
  withCredentials: true
}
// 多个baseUrl的时候
export default function request(options,defaultParams) {
  return new Promise((resolve, reject) => {
    if(!!defaultParams){
      serviceParams = defaultParams
    }
    const service = axios.create(serviceParams);
    // 请求拦截器 添加token
    service.interceptors.request.use(
      (request) => {
        return request;
      },
      (error) => {
        //console.log('request error:' + error)
        return Promise.reject(error);
      }
    );
    // 响应拦截器即异常处理
    service.interceptors.response.use(
      (response) => {
        if (response.status === 200) {
          return response.data;
        } else {
          Promise.reject();
        }
      },
      (error) => {
        //console.log('response error:' + error)
        return Promise.reject(error);
      }
    );
    service(options,defaultParams).then(res => {
      resolve(res);
    }).catch(error => {
      reject(error)
    })
  });
}

//应用
import request from "@/utils/requestcopy.js";
const servicesList = {
  baseURL: process.env.T_API,
  timeout: 3000,
  withCredentials: true
}
export function ResourceList(requestData) {
  let data = requestData;
  return request({
    // url: '/v2/resources/released',
    url: `/v2/resources/released?vv=${vv}&clientId=${clientId}`,
    method: "get",
    params: data,
  },servicesList);
}

第四种

import axios from 'axios';

class Request {
  constructor(props) {
    const servicesList = {
      baseURL: props.serviceType === 'request'process.env.BASE_API : props.serviceType === 'request2' process.env.T_API : '""',
      timeout: 3000,
      withCredentials: true
    }
    // 创建axios实例
    const service = axios.create(servicesList);
    debugger
    service.interceptors.request.use(
      request => {
        return request;
      },
      error => {
        console.log('request error:' + error);
        return Promise.reject(error);
      },
    );

    service.interceptors.response.use(
      response => {
        if (response.status === 200) {
          return response.data;
        } else {
          console.error('response status except:' + response.status);
          Promise.reject();
        }
      },
      error => {
        console.log('response error:' + error);
        return Promise.reject(error);
      },
    );
    this.service = service;
  }

}

const request = new Request({ serviceType: 'request' }).service;
const request2 = new Request({ serviceType: 'request2' }).service;
const request_nocookie = new Request({ serviceType: 'request_nocookie' }).service;

export { request, request2, request_nocookie };

第五种

接口中加baseUrl 参数

import axios from "axios";
// 多个baseUrl的时候
export default function request(options) {
  return new Promise((resolve, reject) => {
    let baseUrl = options.baseUrl options.baseUrl : '""';
    let timeOut = options.timeout options.timeout : 3000;
    const config = { // 将用户传过来的参数与公共配置合并。
      baseURL: baseUrl,
      timeout: timeOut,
      withCredentials: true
    };
    const service = axios.create(config);
    // 请求拦截器 添加token
    service.interceptors.request.use(
      (request) => {
        return request;
      },
      (error) => {
        //console.log('request error:' + error)
        return Promise.reject(error);
      }
    );
    // 响应拦截器即异常处理
    service.interceptors.response.use(
      (response) => {
        if (response.status === 200) {
          return response.data;
        } else {
          Promise.reject();
        }
      },
      (error) => {
        //console.log('response error:' + error)
        return Promise.reject(error);
      }
    );
    debugger
    service(options).then(res => {
      resolve(res);
      return true
    }).catch(error => {
      reject(error)
    })
  });
}