从零到一:在腾讯云服务器上全栈部署Spring Boot后端与Vue前端

发布时间:2026/6/29 0:26:33
从零到一:在腾讯云服务器上全栈部署Spring Boot后端与Vue前端 1. 腾讯云服务器选购与基础配置第一次部署全栈项目到云服务器时我踩过不少坑。记得当时为了省几十块钱选了1核1G的配置结果项目一跑就崩。后来才明白2核4G是最适合新手起步的配置既能流畅运行Spring Boot和Vue又不会造成资源浪费。在腾讯云控制台选购时注意这几个关键点地域选择优先选离你用户群体最近的机房比如华南地区选广州镜像版本CentOS 7.6/7.9最稳定实测与各类开发工具兼容性最好安全组设置提前放行80(HTTP)、443(HTTPS)、22(SSH)、8080(Spring Boot常用端口)拿到服务器后第一件事不是急着部署而是做好基础防护# 修改默认SSH端口降低暴力破解风险 vim /etc/ssh/sshd_config # 找到Port 22改为其他端口如5822 systemctl restart sshd # 添加新用户并赋予sudo权限避免直接使用root adduser deployer passwd deployer usermod -aG wheel deployer2. 开发环境高效配置指南很多教程会教你一个个手动安装环境其实有更高效的做法。我推荐使用自动化脚本完成基础环境搭建这是我积累的万能环境初始化脚本#!/bin/bash # JDK安装自动识别最新版本 JDK_VERSIONjdk-8u381-linux-x64 wget https://repo.huaweicloud.com/java/jdk/8u381-b09/$JDK_VERSION.tar.gz tar -zxvf $JDK_VERSION.tar.gz -C /usr/local/ echo export JAVA_HOME/usr/local/${JDK_VERSION%-linux-x64} /etc/profile echo export PATH$JAVA_HOME/bin:$PATH /etc/profile source /etc/profile # Maven安装 MAVEN_VERSION3.9.6 wget https://dlcdn.apache.org/maven/maven-3/$MAVEN_VERSION/binaries/apache-maven-$MAVEN_VERSION-bin.tar.gz tar -zxvf apache-maven-*.tar.gz -C /usr/local/ ln -s /usr/local/apache-maven-$MAVEN_VERSION /usr/local/maven echo export MAVEN_HOME/usr/local/maven /etc/profile echo export PATH$MAVEN_HOME/bin:$PATH /etc/profile # Node.js安装包含npm curl -fsSL https://rpm.nodesource.com/setup_18.x | bash - yum install -y nodejs传输文件时比起Xftp我更推荐用rsync命令它能自动同步差异文件# 本地到服务器的增量同步忽略node_modules rsync -avz --excludenode_modules ./vue-project rootyour-server-ip:/home/deployer/3. Spring Boot项目生产级部署直接java -jar运行虽然简单但在生产环境远远不够。分享几个实战经验1. 日志管理方案# 使用logrotate自动分割日志 sudo vim /etc/logrotate.d/myapp写入以下配置/home/deployer/app/logs/*.log { daily missingok rotate 30 compress delaycompress notifempty copytruncate }2. 服务化部署Systemdsudo vim /etc/systemd/system/myapp.service服务文件配置示例[Unit] DescriptionMy Spring Boot App Aftersyslog.target [Service] Userdeployer ExecStart/usr/bin/java -jar /home/deployer/app/myapp.jar SuccessExitStatus143 Restartalways RestartSec30 EnvironmentFile/home/deployer/app/config.env [Install] WantedBymulti-user.target3. 健康检查与监控在application.properties中添加management.endpoint.health.show-detailsalways management.endpoints.web.exposure.includehealth,metrics,info4. Vue项目性能优化部署Vue项目部署不只是npm run build那么简单我总结出三个优化层级1. 构建阶段优化// vue.config.js module.exports { chainWebpack: config { config.optimization.splitChunks({ chunks: all, maxSize: 244 * 1024, // 拆分包大小 cacheGroups: { vendors: { test: /[\\/]node_modules[\\/]/, priority: -10 } } }) } }2. Nginx深度配置server { listen 80; server_name your-domain.com; gzip on; gzip_types text/plain text/css application/json application/javascript text/xml; location / { root /home/deployer/app/dist; index index.html; try_files $uri $uri/ /index.html; # 缓存控制 location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ { expires 1y; add_header Cache-Control public, no-transform; } } # API反向代理 location /api { proxy_pass http://localhost:8080; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; } }3. CDN加速实践将静态资源上传至腾讯云COS并配置CDN修改vue.config.jsmodule.exports { publicPath: process.env.NODE_ENV production ? https://your-cdn-domain.com/ : / }5. 全链路监控与排错部署完成后这套监控组合拳能帮你快速定位问题1. 实时日志查看# 同时监控Spring Boot和Nginx日志 multitail -cS java /var/log/nginx/access.log -cS apache /var/log/nginx/error.log -cS spring /home/deployer/app/logs/application.log2. 端口检测脚本#!/bin/bash check_port() { netstat -tlnp | grep :$1 } check_port 80 # Nginx check_port 8080 # Spring Boot check_port 22 # SSH3. 性能瓶颈分析# 查看CPU占用最高的Java线程 top -H -p $(pgrep -f java) # 生成线程转储 jstack -l $(pgrep -f java) thread_dump.log记得第一次成功部署时我在Nginx配置里漏了个分号排查了整整三小时。现在养成了配置检查清单[ ] Nginx语法检查nginx -t[ ] Spring Boot启动参数java -jar --debug app.jar[ ] 文件权限检查ls -l /home/deployer/app[ ] 防火墙状态firewall-cmd --list-all