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

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

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

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

錯(cuò)誤原因

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

運(yùn)行項(xiàng)目 npm run serve,

問(wèn)題解決

vue cli3 代理跨域 404（失敗）問(wèn)題

情景

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

接口地址

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

// .env.development 文件中

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

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

如：part2中。

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

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

瀏覽器中接口requestURL顯示

response中已返回?cái)?shù)據(jù)

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

//vue.config.js 文件中

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

輸出為：

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

總結(jié)

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

最新評(píng)論