服務(wù)器部署項目我們大家都會遇到，但是有些鐵子會遇到很多的問題，比如前端部署nginx如何操作？
前端有單純的靜態(tài)頁面、還有前后端分離的項目；這里博主直接分享最牛最到位的前后端分離項目的前端部署到nginx上面，以若依項目【springboot+vue】為例，實現(xiàn)將前端部署到nginx上并且能調(diào)用后端的接口；
有些鐵子部署若依項目會遇到404的問題，訪問不了后端接口，這個問題也能通過此博客解決，跟著博主操作，學(xué)不會你來打我；
目錄
1、前端項目部署的前期準備：
2、先通過寶塔可視化頁面安裝nginx
3、這里安裝好后，點擊網(wǎng)站，來到PHP項目，添加一個站點?
4、站點設(shè)置，如圖進行操作，然后點擊確定，在列表中就可以看到有一個正在運行的站點
5、瀏覽器訪問頁面
6、頁面是系統(tǒng)自帶的，這里我們需要換成我們自己的前端頁面
7、不用重啟項目，直接訪問
8、配置nginx代理，解決刷新404的問題
9、這個時候我們再訪問一下頁面：
1、前端項目部署的前期準備：
-
寶塔頁面【默認大家已經(jīng)準備好了】
-
后端springboot.jar包已經(jīng)部署好
2、先通過寶塔可視化頁面安裝nginx
在線自動安裝即可，無腦操作
3、這里安裝好后，點擊網(wǎng)站，來到PHP項目，添加一個站點?
4、站點設(shè)置，如圖進行操作，然后點擊確定，在列表中就可以看到有一個正在運行的站點
5、瀏覽器訪問頁面
6、頁面是系統(tǒng)自帶的，這里我們需要換成我們自己的前端頁面
1、對vue項目進行打包，我的命令是npm run build:prod;得到dist文件夾
2、 通過點擊根目錄來到文件里面
?3、將里面已經(jīng)存在的系統(tǒng)自帶的頁面刪完，然后將我們打包好的dist目錄下面的所有文件放到這下面，等待上傳完成，頁面就算是準備好了；
7、不用重啟項目，直接訪問
事情到了這里，那些不用訪問后端接口的純前端頁面就算是部署完成了，也能夠看到效果；
但是若依是前后端分離，需要調(diào)用后端的接口，我這兒后端的接口已經(jīng)部署好了，但是訪問一直報錯404，是因為接口沒找到；
?
?該怎么解決這個問題呢？不要慌，往下看
8、配置nginx代理，解決刷新404的問題
這個時候我們需要來到站點的配置中，對偽靜態(tài)的配置進行設(shè)置代理，如圖設(shè)置然后保存；
# 這里是表示 nginx 攔截所有 /prod-api 開頭的請求
location /prod-api {
# 去除 /prod-api 前綴
rewrite ^/prod-api/(.*)$ /$1 break;
# 反向代理到 java 服務(wù)器，ip加端口
proxy_pass http://3.*.*30:8082;
}9、這個時候我們再訪問一下頁面：
大功告成，這個驗證碼就是從后端來的；
文章來源：http://www.zghlxwxcb.cn/news/detail-780086.html
打完收工，看都看到這里了，留個三連唄！文章來源地址http://www.zghlxwxcb.cn/news/detail-780086.html
到了這里，關(guān)于服務(wù)器部署—若依【vue】如何部署到nginx里面？nginx刷新頁面404怎么辦？【完美解決建議收藏】的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
