詳解SpringBoot+Vue項(xiàng)目用寶塔面板部署指南
(示意圖:用戶(hù)請(qǐng)求 → Nginx → 靜態(tài)資源/Vue → 反向代理/SpringBoot API)
環(huán)境要求
- 服務(wù)器配置建議
- CPU: 2核+
- 內(nèi)存: 4GB+
- 系統(tǒng): CentOS 7+/Ubuntu 20.04+
一、環(huán)境準(zhǔ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項(xiàng)目管理器配置
關(guān)鍵參數(shù):
- 項(xiàng)目路徑:
/www/wwwroot/backend - JDK版本:需與本地開(kāi)發(fā)環(huán)境一致
- 啟動(dòng)參數(shù)示例:
-Xms256m -Xmx512m -Dspring.profiles.active=prod
三、前端部署
構(gòu)建流程
# 安裝依賴(lài)(使用淘寶鏡像加速) 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
- 勾選"強(qiáng)制HTTPS"
- 修改Nginx自動(dòng)跳轉(zhuǎn):
server {
listen 80;
server_name example.com;
return 301 https://$host$request_uri;
}
常見(jiàn)問(wèn)題排查表
| 問(wèn)題現(xiàn)象 | 可能原因 | 解決方案 |
|---|---|---|
| 502 Bad Gateway | Java服務(wù)未啟動(dòng) | 檢查journalctl -u java_project日志 |
| 接口404 | Nginx路由配置錯(cuò)誤 | 檢查proxy_pass地址末尾是否帶/ |
| 靜態(tài)資源加載失敗 | Vue publicPath配置錯(cuò)誤 | 確保設(shè)置為/或./ |
| 數(shù)據(jù)庫(kù)連接失敗 | MySQL用戶(hù)權(quán)限不足 | 執(zhí)行GRANT ALL ON db.* TO 'user'@'%' |
進(jìn)階配置
1. 日志切割配置
# 在寶塔計(jì)劃任務(wù)中添加 0 0 * * * /usr/sbin/logrotate -f /etc/logrotate.d/java-app
2. 監(jiān)控配置
建議監(jiān)控:
- Java進(jìn)程內(nèi)存占用
- MySQL連接數(shù)
- 磁盤(pán)空間使用率
提示:部署完成后建議進(jìn)行壓力測(cè)試,可使用ab -n 1000 -c 50 http://example.com/api/test測(cè)試接口性能
到此這篇關(guān)于詳解SpringBoot+Vue項(xiàng)目用寶塔面板部署指南的文章就介紹到這了,更多相關(guān)SpringBoot Vue寶塔面板部署內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue2.0基于vue-cli+webpack Vuex的用法(實(shí)例講解)
下面小編就為大家?guī)?lái)一篇Vue2.0基于vue-cli+webpack Vuex的用法(實(shí)例講解)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
vue.js實(shí)現(xiàn)圖書(shū)管理功能
這篇文章主要為大家詳細(xì)介紹了vue.js實(shí)現(xiàn)圖書(shū)管理功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-09-09
Vue中的Token過(guò)期驗(yàn)證與動(dòng)態(tài)路由重定向詳解
這篇文章主要為大家詳細(xì)介紹了如何在 Vue 項(xiàng)目中實(shí)現(xiàn) Token 過(guò)期驗(yàn)證,并根據(jù) Token 的有效期動(dòng)態(tài)重定向用戶(hù)到首頁(yè)或登錄頁(yè),感興趣的小伙伴可以了解下2025-03-03
Vuex如何獲取getter對(duì)象中的值(包括module中的getter)
這篇文章主要介紹了Vuex如何獲取getter對(duì)象中的值(包括module中的getter),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-08-08

