這期內(nèi)容當中小編將會給大家?guī)碛嘘P(guān)利用vue怎么對服務器端的請求接口地址進行修改，文章內(nèi)容豐富且以專業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

成都創(chuàng)新互聯(lián)專注骨干網(wǎng)絡服務器租用十年，服務更有保障！服務器租用，德陽機房托管 成都服務器租用，成都服務器托管，骨干網(wǎng)絡帶寬，享受低延遲，高速訪問。靈活、實現(xiàn)低成本的共享或公網(wǎng)數(shù)據(jù)中心高速帶寬的專屬高性能服務器。

一個項目可能有很多環(huán)境，開發(fā)，測試，預生產(chǎn)，生產(chǎn)等環(huán)境，如果每一個環(huán)境都需要重新打包會顯得比較麻煩，那么如何解決這個問題呢

在vue和uniapp中以及其他框架下的都是可以按照如下操作來解決的

在靜態(tài)資源下新建一個env.json,vue項目是在public文件下新建，uniapp是在static下新建文件

文件格式如下

{
  "name": "development",
  "base": "/customer"
}

name，代表的是環(huán)境，方便直接在服務器上查看當前是什么環(huán)境的，base是請求的地址，如果服務器沒有做代理的話，這里的base應該是完整的請求地址http:// xxxxx.com/customer，類似這種

一般人在處理的時候總是獲取不到這個env.json里的地址，是因為，這里是因為異步導致的，如果要解決的話，可以在main.js或者是main.ts中如何操作

axios.get('./env.json')
 .then(function (res: any) {
  // handle success
　　　　Vue.prototype.BASE_URL = res.data.base;
  new Vue({
   router,
   store,
   render: h => h(App)
  }).$mount('#app')
 })

這樣有個問題就是一定是在請求這個json成功之后項目才會開始渲染的，這個時間可以做一個加載動畫，請求應該是很快的，如果請求失敗，你可以在axios里做一個catch操作，給一個友好的提示什么的，進行重新請求

那么如何獲取了？

可以在攔截器中進行獲取然后拼接請求地址

在攔截器的那個js文件中

function getBaseUrl() {
  return Vue.prototype.BASE_URL
}

最后在傳入url的時候進行拼接，如下
url: getBaseUrl() + opts.url, // opts是傳過來的參數(shù)對象

上述就是小編為大家分享的利用vue怎么對服務器端的請求接口地址進行修改了，如果剛好有類似的疑惑，不妨參照上述分析進行理解。如果想知道更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網(wǎng)頁名稱：利用vue怎么對服務器端的請求接口地址進行修改-創(chuàng)新互聯(lián)
文章網(wǎng)址：http://weahome.cn/article/gehps.html