动态更改 axios 代理 URL 的正确方法？答案

【问题标题】：Correct way to dynamically change axios proxy URL?动态更改 axios 代理 URL 的正确方法？
【发布时间】：2020-08-09 02:49:33
【问题描述】：

我的主 Vue 文件中有这段代码：

export default axios.create({
  baseURL: 'http://127.0.0.1',
  proxy: {
    '/api/': 'http://127.0.0.1',
    '/w0w/': 'http://192.168.1.12'
  }
})
Vue.prototype.$axios = axios;

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

在运行时将发出的代理请求的目标 URL 更改为 /w0w/ 的最佳做法是什么？

也就是说 - 让用户通过 UI 修改这些地址。

【问题讨论】：

标签： vue.js axios electron

【解决方案1】：

您可以将导出更改为接受 URL 并在需要更新时调用它的方法

const createAxios = (proxyURL) => {
 axios.create({
  baseURL: 'http://127.0.0.1',
  proxy: {
    '/api/': 'http://127.0.0.1',
    '/w0w/': proxyURL || 'http://192.168.1.12'
  }
 })
}

export default createAxios

现在你需要稍微不同地称呼它

Vue.prototype.$axios = axios(/*or custom proxy url here*/);

【讨论】：