詳解SpringBoot+Vue項目用寶塔面板部署指南
更新時間：2025年08月22日 09:27:06 作者：每天學習一丟丟
本文提供了Spring Boot+Vue項目在寶塔面板上的完整部署指南實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
（示意圖：用戶請求 → Nginx → 靜態(tài)資源/Vue → 反向代理/SpringBoot API）
環(huán)境要求
- 服務器配置建議
- CPU: 2核+
- 內(nèi)存: 4GB+
- 系統(tǒng): CentOS 7+/Ubuntu 20.04+
一、環(huán)境準備
1. 寶塔面板安裝
# CentOS yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh # Ubuntu wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.sh
2. 軟件安裝清單
| 軟件 | 版本要求 | 安裝路徑 |
|---|---|---|
| Nginx | 1.20+ | /www/server/nginx |
| MySQL | 5.7+ | /www/server/mysql |
| JDK | 11/17 | /www/server/java |
| Node.js | 16.x LTS | /www/server/nodejs |
二、后端部署
目錄結(jié)構(gòu)
/www/wwwroot/backend/ ├── your-project.jar# 主程序 ├── config/# 配置文件目錄 │└── application.yml# 生產(chǎn)環(huán)境配置 └── logs/# 日志目錄
Java項目管理器配置
關(guān)鍵參數(shù)：
- 項目路徑：
/www/wwwroot/backend - JDK版本：需與本地開發(fā)環(huán)境一致
- 啟動參數(shù)示例：
-Xms256m -Xmx512m -Dspring.profiles.active=prod
三、前端部署
構(gòu)建流程
# 安裝依賴（使用淘寶鏡像加速） npm install --registry=https://registry.npm.taobao.org # 構(gòu)建生產(chǎn)包 npm run build
目錄結(jié)構(gòu)
/www/wwwroot/frontend/ ├── dist/# 構(gòu)建產(chǎn)物 │├── static/ │└── index.html ├── node_modules/ └── vue.config.js# 生產(chǎn)環(huán)境代理配置
四、Nginx核心配置
完整配置示例
server {
listen 80;
server_name example.com;
# 前端路由配置
location / {
root /www/wwwroot/frontend/dist;
try_files $uri $uri/ /index.html;
add_header Cache-Control "no-cache";
}
# 后端API配置
location /api/ {
proxy_pass http://127.0.0.1:8080;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_connect_timeout 60s;
proxy_read_timeout 300s;
}
# 靜態(tài)資源緩存
location ~* \.(js|css|png|jpg)$ {
expires 365d;
access_log off;
}
}
五、HTTPS配置
- 寶塔面板 → 網(wǎng)站 → SSL → Let’s Encrypt
- 勾選"強制HTTPS"
- 修改Nginx自動跳轉(zhuǎn)：
server {
listen 80;
server_name example.com;
return 301 https://$host$request_uri;
}
常見問題排查表
| 問題現(xiàn)象 | 可能原因 | 解決方案 |
|---|---|---|
| 502 Bad Gateway | Java服務未啟動 | 檢查journalctl -u java_project日志 |
| 接口404 | Nginx路由配置錯誤 | 檢查proxy_pass地址末尾是否帶/ |
| 靜態(tài)資源加載失敗 | Vue publicPath配置錯誤 | 確保設(shè)置為/或./ |
| 數(shù)據(jù)庫連接失敗 | MySQL用戶權(quán)限不足 | 執(zhí)行GRANT ALL ON db.* TO 'user'@'%' |
進階配置
1. 日志切割配置
# 在寶塔計劃任務中添加 0 0 * * * /usr/sbin/logrotate -f /etc/logrotate.d/java-app
2. 監(jiān)控配置
建議監(jiān)控：
- Java進程內(nèi)存占用
- MySQL連接數(shù)
- 磁盤空間使用率
提示：部署完成后建議進行壓力測試，可使用ab -n 1000 -c 50 http://example.com/api/test測試接口性能
到此這篇關(guān)于詳解SpringBoot+Vue項目用寶塔面板部署指南的文章就介紹到這了,更多相關(guān)SpringBoot Vue寶塔面板部署內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章給大家分享了vue檢測對象和數(shù)組的變化的相關(guān)知識點與實例代碼，有興趣的朋友參考下。2018-06-06
vue解決使用$http獲取數(shù)據(jù)時報錯的問題
今天小編就為大家分享一篇vue解決使用$http獲取數(shù)據(jù)時報錯的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-10-10
這篇文章主要為大家詳細介紹了Vue動態(tài)路由復制標簽頁空白問題的相關(guān)解決方法,文中的示例代碼講解詳細,感興趣的小伙伴可以了解一下2025-11-11
使用Vue構(gòu)建動態(tài)表單生成器的實現(xiàn)步驟
在前端開發(fā)中,表單是非常常見的交互元素,然而,當表單的結(jié)構(gòu)和字段需要根據(jù)不同的業(yè)務場景動態(tài)變化時,手動編寫每個表單的代碼會變得非常繁瑣,所以我們可以使用Vue實現(xiàn)一個動態(tài)表單生成器,本文將詳細介紹實現(xiàn)動態(tài)表單生成器的原理,需要的朋友可以參考下2025-04-04
vue3+elementui plus如何實現(xiàn)多選分頁列表的新增和修改
這篇文章主要介紹了vue3+elementui plus如何實現(xiàn)多選分頁列表的新增和修改問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2025-06-06
在?Vue.js?中主要通過第三方庫實現(xiàn)表格拖動排序功能,其中最常用的庫是?SortableJS,下面我們就來看看如何使用SortableJS實現(xiàn)表格拖動排序吧2025-01-01
Vue是構(gòu)建Web界面的JavaScript庫，原稱為Vue.js，它可以通過簡潔的API來提供高效的數(shù)據(jù)綁定和靈活的組件系統(tǒng)，本文詳細介紹了Vue的使用安裝和相關(guān)知識，有興趣的同學可以參考借鑒2023-03-03
Vue-Router基礎(chǔ)學習筆記(小結(jié))
這篇文章主要介紹了Vue-Router基礎(chǔ)學習筆記(小結(jié))，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-10-10
創(chuàng)建Vue3項目有兩種常見的方式,一種是想vue2版本一樣使用腳手架工具創(chuàng)建,創(chuàng)建vue3項目的腳手架必須是4版本以上的,另一種方法就是使用vite創(chuàng)建,這篇文章主要給大家介紹了關(guān)于如何使用vite創(chuàng)建vue3項目的相關(guān)資料,需要的朋友可以參考下2022-11-11
Vue+WebSocket頁面實時刷新長連接的實現(xiàn)
最近vue項目要做數(shù)據(jù)實時刷新，數(shù)據(jù)較大，會出現(xiàn)卡死情況，所以本文主要介紹了頁面實時刷新長連接，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06