vue線上部署請(qǐng)求接口報(bào)錯(cuò)net::ERR_CONNECTION_REFUSED
vue線上部署請(qǐng)求接口出現(xiàn)net::ERR_CONNECTION_REFUSED
問題描述
使用springboot和vue開發(fā)前后端分離項(xiàng)目時(shí),在本地開發(fā)環(huán)境訪問項(xiàng)目前端請(qǐng)求后端RESTfule接口正常,但部署到云端服務(wù)器時(shí),請(qǐng)求后端接口出現(xiàn)net::ERR_CONNECTION_REFUSED錯(cuò)誤。
調(diào)用瀏覽器控制臺(tái)發(fā)現(xiàn)no-referrer-when-downgrade

解決方法
將下圖請(qǐng)求的baseurl修改為localhost就行

vue項(xiàng)目部署后,刷新提示404
遇到的問題
Vue項(xiàng)目打包部署到線上后,刷新頁(yè)面會(huì)提示404。
這是因?yàn)榫W(wǎng)頁(yè)訪問的是靜態(tài)絕對(duì)路徑,而服務(wù)器上沒有該路徑。

解決方法
方法一:
修改src/router/index.js文件中的mode屬性,設(shè)置為hash。(這種調(diào)整,會(huì)使url出現(xiàn)"#")

方法二:
調(diào)整nginx.conf配置文件

總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
Nuxt.js nuxt-link與router-link的區(qū)別說(shuō)明
這篇文章主要介紹了Nuxt.js nuxt-link與router-link的區(qū)別說(shuō)明,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2020-11-11
vue-virtual-scroll-list虛擬組件實(shí)現(xiàn)思路詳解
這篇文章主要給大家介紹了關(guān)于vue-virtual-scroll-list虛擬組件實(shí)現(xiàn)思路的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2023-02-02
vue項(xiàng)目中使用AvueJs的詳細(xì)教程
Avue.js是基于現(xiàn)有的element-ui庫(kù)進(jìn)行的二次封裝,簡(jiǎn)化一些繁瑣的操作,核心理念為數(shù)據(jù)驅(qū)動(dòng)視圖,主要的組件庫(kù)針對(duì)table表格和form表單場(chǎng)景,這篇文章給大家介紹了vue項(xiàng)目中使用AvueJs的相關(guān)知識(shí),感興趣的朋友跟隨小編一起看看吧2022-10-10
詳解element-ui 組件el-autocomplete使用踩坑記錄
最近使用了el-autocomplete組件,本文主要介紹了element-ui 組件el-autocomplete使用踩坑記錄,文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-03-03
vue項(xiàng)目打包清除console.log的4種方法
項(xiàng)目打包的時(shí)候想要?jiǎng)h除console.log,本文主要介紹了vue項(xiàng)目打包清除console.log的4種方法,具有一定的參考價(jià)值,感興趣的可以了解游戲2023-11-11
Vue3中虛擬dom轉(zhuǎn)成真實(shí)dom的過程詳解
Vue.js?在其運(yùn)行過程中會(huì)將模板編譯成虛擬?DOM?(VNode),然后再將?VNode?渲染成實(shí)際的?DOM?節(jié)點(diǎn),這個(gè)過程是由?Vue?內(nèi)部的編譯器和渲染系統(tǒng)完成的,本文給大家介紹了Vue3中虛擬dom轉(zhuǎn)成真實(shí)dom的過程,需要的朋友可以參考下2024-09-09
Vue實(shí)現(xiàn)contenteditable元素雙向綁定的方法詳解
contenteditable是所有HTML元素都有的枚舉屬性,表示元素是否可以被用戶編輯。本文將詳細(xì)介紹如何實(shí)現(xiàn)contenteditable元素的雙向綁定,需要的可以參考一下2022-05-05

