Vue打包程序部署到Nginx 點(diǎn)擊跳轉(zhuǎn)404問(wèn)題
Vue打包程序部署到Nginx 點(diǎn)擊跳轉(zhuǎn)404
我們講Vue打包后的程序 dist 目錄部署到Nginx服務(wù)中,在使用過(guò)程中,點(diǎn)擊了二級(jí)新的頁(yè)面;然后刷新就變成了404 無(wú)法找到目標(biāo)頁(yè)面問(wèn)題。
原因是vue的項(xiàng)目為單頁(yè)應(yīng)用,通過(guò)Nginx服務(wù)部署找不到項(xiàng)目路由導(dǎo)致的無(wú)法跳轉(zhuǎn)路由配置頁(yè)面。所以要在nginx服務(wù)器配置對(duì)所有的路徑或者文件夾進(jìn)行跳轉(zhuǎn)。
重定向到首頁(yè)index下,這樣就都能找到路由了
location / { ? ? ? ?# 需要指向下面的@router否則會(huì)出現(xiàn)vue的路由在nginx中刷新出現(xiàn)404 ? ? ? ?try_files $uri $uri/ @router; ? ? ? ?index index.html; ?} ? location @router { ? ? ? ?#對(duì)應(yīng)上面的@router,主要原因是路由的路徑資源并不是一個(gè)真實(shí)的路徑,所以無(wú)法找到具體的文件 ? ? ? ?#因此需要rewrite到index.html中,然后交給路由在處理請(qǐng)求資源 ? ? ? ?rewrite ^.*$ /index.html last; }
Vue打包后,用后端接口報(bào)錯(cuò)304、404
問(wèn)題描述
后端打包部署成功以后,更換了地址信息,前端修改vue.config,js中代理跨域的配置,但是前端打包后出現(xiàn)接口報(bào)錯(cuò)304、404
解決辦法
在axios請(qǐng)求中修改配置對(duì)象baseURL:
baseURL: process.env.NODE_ENV === "development" ? "" : "http://112.74.72.92:8085"
位置如下圖:
總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
解決vue-router 二級(jí)導(dǎo)航默認(rèn)選中某一選項(xiàng)的問(wèn)題
今天小編就為大家分享一篇解決vue-router 二級(jí)導(dǎo)航默認(rèn)選中某一選項(xiàng)的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-11-11Vue3學(xué)習(xí)筆記之依賴(lài)注入Provide/Inject
provide和inject可以實(shí)現(xiàn)嵌套組件之間進(jìn)行傳遞數(shù)據(jù),這兩個(gè)函數(shù)都是在setup函數(shù)中使用的,下面這篇文章主要給大家介紹了關(guān)于Vue3學(xué)習(xí)筆記之依賴(lài)注入Provide?/?Inject的相關(guān)資料,需要的朋友可以參考下2023-05-05vue新手入門(mén)出現(xiàn)function () { [native code]&nbs
這篇文章主要介紹了vue新手入門(mén)出現(xiàn)function () { [native code] }錯(cuò)誤的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-04-04尤雨溪開(kāi)發(fā)vue?dev?server理解vite原理
這篇文章主要為大家介紹了尤雨溪開(kāi)發(fā)的玩具vite,vue-dev-server來(lái)理解vite原理,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07使用 Vue-TCB 快速在 Vue 應(yīng)用中接入云開(kāi)發(fā)的方法
這篇文章主要介紹了如何使用 Vue-TCB 快速在 Vue 應(yīng)用中接入云開(kāi)發(fā),本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-02-02vue封裝自定義指令之動(dòng)態(tài)顯示title操作(溢出顯示,不溢出不顯示)
這篇文章主要介紹了vue封裝自定義指令之動(dòng)態(tài)顯示title操作(溢出顯示,不溢出不顯示),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11