axios 项目统一设置（实用）

vue项目多个接口地址axios封装

 

（1）index.js 文件  ，引入axios.

import axios from 'axios';           

(2) util文件写多个接口url地址：

export const baseUrl =

{

   ykapi:'http://ykXXXX.com,

   zjapi:'http://ziXXXXX.com'

};

（3）joggle.js接口地址使用 ，引入util 和index.js

import instance from './index';

import * as util from '../assets/util.js';

const ykapi = {

    r: params => {

     return instance.get(`${util.baseUrl.ykapi}/api/xx`, {params})

   } 

}

const doctorInfo = {

    r: params => {

    return instance.post(`${util.baseUrl.zjapi}/dict`, params)

    }

}

export {

      ykapi,

      doctorInfo

}

(4) 调用接口返回数据

import * as port from '../api/joggle';

port.doctorInfo.r({no:1014}).then(res=>{

    //返回res

})

 

ps:  配置axios 一些通用拦截index.js

axios.defaults.timeout=10000;

axios.defaults.headers.post['Content-Type'] = 'application/json';

axios.defaults.headers.common['Authorization'] = 'Bearer ' + util.session('token');

axios.interceptors.response.use(function(response) {

//返回响应信息

return response;

}, util.catchError);   //util.cathError   在util中拦截错误代码输出提示

 

export default axios;