# Vue axios 配置请求后端多个地址

Vue axios 配置请求后端多个地址

---

地址管理url.js

//不同的地址对应不同的的访问路径
module.exports = {
  domain: {
    Base_M1_URL: 'http://127.0.0.1:8014', //模块一接口地址
    Base_M2_URL: 'http://127.0.0.1:8015', //模块二接口地址
  }
}

main.js配置

//引入axios
import axios from 'axios'
//引入 utls.js
import {
  domain
} from './utils/url.js'

//配置axios
//url1,url2地址
axios.defaults.baseM1URL = domain.Base_M1_URL;
axios.defaults.baseM2URL = domain.Base_M2_URL;

分装Post、Get请求common.js

//1->common.js中引入axios
import axios from 'axios'

axios.defaults.timeout = 180000
//2->对get请求传递过来的参数处理
function paramsToUrl(url, params) {
  if (!params) return url
  for (var key in params) {
    if (params[key] && params[key] != 'undefined') {
      if (url.indexOf('?') != -1) {
        url += '&' + '' + key + '=' + params[key] || '' + ''
      } else {
        url += '?' + '' + key + '=' + params[key] || '' + ''
      }
    }
  }
  return url
}


//3->在common.js中封装公用方法-----封装请求的方法
export function requireData(url, params, type, item) {
  debugger;
  if (!url) return false
  switch (item) {
    case 'back':
      url = axios.defaults.baseM1URL + url
      break;
    case 'before':
      url = axios.defaults.baseM2URL + url
      break;
    default:
      url = axios.defaults.baseM2URL + url
  }
  if (type === 'get') {
    url = paramsToUrl(url, params)
    return new Promise((resolve, reject) => {
      axios.get(url, params).then(res => {
        resolve(res.data)
      }).catch(err => {
        reject(err)
      })
    })
  } else {
    return new Promise((resolve, reject) => {
      axios.post(url, params).then(res => {
        resolve(res.data)
      }).catch(err => {
        reject(err)
      })
    })
  }
}

使用封装的方法

created(){
    //调用http://127.0.0.1:8014/test/test1
    test1('/test/tes1','null','post','before').then(res =>{
        if(res.code == 200){
            alert(res.body)
        }else{
            alert(res.body)
        }
    })
}

created(){
   //调用http://127.0.0.1:8015/test/test1
    test1('/test/tes1','null','post','before').then(res =>{
        if(res.code == 200){
            alert(res.body)
        }else{
            alert(res.body)
        }
    })
}