vue-cli3設(shè)置代理無效

閑著無聊使用vue-cli3.0搭建了項目，在配置代理后運行的時候出現(xiàn)了如下情況：

但是這個接口直接拿地址拼接是能取數(shù)據(jù)的，如下（不好意思部分數(shù)據(jù)必須要隱藏哈）：

以下是我的vue.config.js,代理配置：

錯誤原因

pathRewrite中'^/api':’api‘i問題   // 冒號后面的api意思是用‘/api’代替target里面的地址，后面組件中我們掉接口時直接用api代替，改為如下：

運行項目 npm run serve,

問題解決

vue cli3 代理跨域 404（失?。﹩栴}

情景

在寫vue cli 中的代理時，百度了好久也沒代理上，最終的問題出在路徑重寫上。如果有跟我有一樣問題的小伙伴，歡迎前來參考，可根據(jù)各自情況和實際問題進行調(diào)試。

接口地址

代理地址為（開發(fā)環(huán)境）

// .env.development 文件中

VUE_APP_BASE_API 在不同環(huán)境（ .env.production文件， .env.staging等文件中）為不同地址。

如沒有此處，代理地址寫死的話，下面的proxy中也要將對應(yīng)代理地址改掉。

如：part2中。

注意：百度上搜的重新路徑都是  ‘’  (空路徑），一直代理不過去。找了半天發(fā)現(xiàn)需要代理到  '/' （根路徑）。卡了好久，距離就差了這一點點問題（啊 啊啊啊 啊?。?。

 *此處需要根據(jù)自己的接口狀況來調(diào)試代理路徑地址

瀏覽器中接口requestURL顯示

response中已返回數(shù)據(jù)

（part2）不需動態(tài)改變proxy需代理的路徑（即：下圖 'api' 位置處）

//vue.config.js 文件中

將地址中       '/api'    代理到      '/'       中.

輸出為：

http://127.0.0.1:8080/userInfo/getUserInfoList.do

總結(jié)

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

最新評論