vue線上部署請(qǐng)求接口報(bào)錯(cuò)net::ERR_CONNECTION_REFUSED
vue線上部署請(qǐng)求接口出現(xiàn)net::ERR_CONNECTION_REFUSED
問(wèn)題描述
使用springboot和vue開(kāi)發(fā)前后端分離項(xiàng)目時(shí)，在本地開(kāi)發(fā)環(huán)境訪問(wè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
遇到的問(wèn)題
Vue項(xiàng)目打包部署到線上后，刷新頁(yè)面會(huì)提示404。
這是因?yàn)榫W(wǎng)頁(yè)訪問(wèn)的是靜態(tài)絕對(duì)路徑，而服務(wù)器上沒(méi)有該路徑。
解決方法
方法一：
修改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ì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11
vue-virtual-scroll-list虛擬組件實(shí)現(xiàn)思路詳解
這篇文章主要給大家介紹了關(guān)于vue-virtual-scroll-list虛擬組件實(shí)現(xiàn)思路的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2023-02-02
這篇文章主要介紹了Vue.js路由管理器 Vue Router，主要介紹的是路由元信息，命名路由以及嵌套路由等使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-08-08
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使用踩坑記錄，文中通過(guò)示例代碼介紹的非常詳細(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的過(guò)程詳解
Vue.js?在其運(yùn)行過(guò)程中會(huì)將模板編譯成虛擬?DOM?(VNode),然后再將?VNode?渲染成實(shí)際的?DOM?節(jié)點(diǎn),這個(gè)過(guò)程是由?Vue?內(nèi)部的編譯器和渲染系統(tǒng)完成的,本文給大家介紹了Vue3中虛擬dom轉(zhuǎn)成真實(shí)dom的過(guò)程,需要的朋友可以參考下2024-09-09
這篇文章主要介紹了詳解vue+webpack+express中間件接口使用，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-07-07
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)表單驗(yàn)證小功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
Vue實(shí)現(xiàn)contenteditable元素雙向綁定的方法詳解
contenteditable是所有HTML元素都有的枚舉屬性，表示元素是否可以被用戶編輯。本文將詳細(xì)介紹如何實(shí)現(xiàn)contenteditable元素的雙向綁定，需要的可以參考一下2022-05-05