尧图建网站 尧图建网站 YAOTU WEB BUILD 免费咨询
ARTICLE DETAIL

资讯详情

深耕网站建设与建站编程的一线实战洞察。

宝塔面板部署RuoYi前后端分离项目实战:从环境配置到Nginx代理全解析

宝塔面板部署RuoYi前后端分离项目实战:从环境配置到Nginx代理全解析 1. 项目概述与核心痛点最近在帮一个朋友的公司部署一套内部管理系统他们选型了若依RuoYi这个前后端分离的开源框架。项目本身功能完善开发阶段在本地跑得也挺顺但一到生产环境部署就遇到了各种“水土不服”。他们之前为了运维方便服务器上装了宝塔面板本以为能一键搞定结果从环境配置、项目打包到服务启动每一步都踩了坑。这其实也是很多从开发转向运维部署的团队常遇到的问题本地开发环境和线上生产环境差异巨大而宝塔这种图形化工具虽然降低了入门门槛但一旦遇到框架特定的复杂配置图形界面背后的“黑盒”操作反而会让问题排查变得困难。这篇文章我就结合这次实战把用宝塔部署RuoYi前后端分离项目的完整流程以及我们遇到的那些典型坑和解决方案从头到尾捋一遍。无论你是刚接触生产部署的开发者还是负责运维的同事希望这些经验能帮你少走弯路。2. 环境准备与宝塔基础配置部署的第一步不是急着上传代码而是把服务器的“地基”打好。很多部署失败根源都在于环境不匹配或权限混乱。2.1 服务器与宝塔面板初始化我们用的是CentOS 7.9的云服务器。安装宝塔的过程很简单官方有一键脚本。但这里有个关键点安装完成后务必在宝塔面板的“安全”页面放行后续需要用到的端口。除了宝塔默认的8888我们至少需要放行80/443: HTTP/HTTPS访问端口。8080: 这是Spring Boot后端项目默认的启动端口当然你也可以改成别的。3306: MySQL数据库端口强烈建议仅在测试阶段临时开放部署完成后立即关闭并通过宝塔面板或phpMyAdmin进行管理。如果你的前端需要单独用Node.js运行例如开发环境可能还需要放行3000等端口。安装完宝塔通过面板安装必要的软件。对于RuoYi-VueSpring Boot Vue这套技术栈我们需要Nginx 1.20: 用于反向代理前端和后端以及配置SSL证书。MySQL 5.7 / MariaDB 10.2: 根据RuoYi官方文档推荐版本安装。建议直接用宝塔的MySQL省去手动编译的麻烦。Java项目管理器可选但推荐: 宝塔应用商店里的“Java项目管理器”插件对于管理Spring Boot的Jar包非常方便可以监控状态、查看日志、设置开机自启。注意它默认会安装一个特定版本的JDK如jdk1.8你需要确认这个版本与你的项目兼容RuoYi一般需要JDK8或JDK11。如果不兼容需要先通过SSH手动安装对应版本的JDK并配置好环境变量。踩坑记录1混乱的Java环境最初我们直接用了Java项目管理器自带的JDK8但项目打包用的是JDK11导致运行时出现不兼容的类版本错误。解决办法是通过SSH连接到服务器用yum或apt安装正确的JDK版本然后使用alternatives --config java命令切换系统默认的Java版本并确保JAVA_HOME环境变量正确设置。最后在Java项目管理器里指定自定义的Java路径如/usr/lib/jvm/java-11-openjdk/bin/java。2.2 数据库初始化与安全设置在宝塔面板的数据库模块创建一个新的数据库比如叫ry_cloud。字符集选择utf8mb4排序规则选utf8mb4_general_ci以支持完整的UTF-8字符包括emoji。然后需要导入RuoYi项目的SQL脚本。脚本文件通常在项目源码的/sql目录下可能有多个文件如ry_2021xxxx.sql存放业务数据表结构quartz.sql存放定时任务相关表。导入方式有两种通过宝塔的phpMyAdmin导入图形化操作适合小脚本。通过命令行导入推荐用于大文件mysql -u root -p ry_cloud /path/to/ry_2021xxxx.sql输入宝塔MySQL的root密码即可。踩坑记录2数据库连接失败后端服务启动后最常见的错误就是连不上数据库。原因可能有权限问题创建数据库时宝塔会自动生成一个同名的用户和随机密码。你需要确保后端配置application-druid.yml中的用户名、密码、数据库名与宝塔里创建的完全一致。不要使用root用户为安全起见应该使用为这个数据库单独创建的用户。连接地址问题在服务器上后端连接数据库可以使用localhost或127.0.0.1。但如果你的MySQL是单独安装在另一台服务器或者使用了Docker就需要填写正确的IP地址。密码加密方式新版MySQL可能使用了caching_sha2_password加密而旧版Java驱动可能不支持。如果遇到“Public Key Retrieval is not allowed”等错误可以在JDBC连接URL后加上参数useSSLfalseallowPublicKeyRetrievaltrue生产环境请谨慎评估SSL关闭的风险或者在MySQL中修改用户密码插件为mysql_native_password。3. 后端项目打包与部署详解后端是Spring Boot项目最终要打包成一个可执行的Jar文件。3.1 本地打包与配置调整在本地开发环境进入RuoYi后端项目根目录包含pom.xml的文件夹。打包前必须检查并修改生产环境配置文件。打开ruoyi-admin/src/main/resources/目录下的配置文件。修改application-druid.yml将数据库连接信息改为服务器上宝塔MySQL的信息。# 数据源配置 spring: datasource: type: com.alibaba.druid.pool.DruidDataSource driverClassName: com.mysql.cj.jdbc.Driver url: jdbc:mysql://localhost:3306/ry_cloud?useUnicodetruecharacterEncodingutf8zeroDateTimeBehaviorconvertToNulluseSSLfalseserverTimezoneGMT%2B8 username: your_bt_db_user # 替换为宝塔创建的数据库用户名 password: your_bt_db_password # 替换为对应的强密码修改application.yml关键修改有两处。服务器端口server.port默认是8080确保它与宝塔安全组放行的端口一致且未被其他程序占用。文件上传路径profile通常指向项目运行目录下的某个文件夹如/home/ruoyi/uploadPath。在宝塔部署时强烈建议将其改为一个绝对路径并确保运行Java项目的用户如root或www对该路径有读写权限。否则文件上传功能会失败。# 文件路径 file: profile: /www/wwwroot/upload/ruoyi # 示例在宝塔常用的网站根目录同级创建upload文件夹使用Maven或IDE进行打包# 在项目根目录执行 mvn clean package -DskipTests打包成功后在ruoyi-admin/target/目录下会生成ruoyi-admin.jar。3.2 上传Jar包与宝塔Java项目管理器配置将打包好的ruoyi-admin.jar上传到服务器。建议在宝塔面板的/www/wwwroot目录下创建一个专门的文件夹来管理Java项目例如/www/wwwroot/java/ruoyi。然后打开宝塔的“Java项目管理器”。添加项目点击“添加Java项目”。选择Jar包Jar包路径选择你刚刚上传的ruoyi-admin.jar。项目端口填写你在application.yml中配置的端口如8080。项目路径选择Jar包所在的目录如/www/wwwroot/java/ruoyi。这个路径会成为项目运行的“当前目录”配置文件里相对路径虽然不推荐用会基于此。JDK版本选择你之前配置好的正确JDK版本或自定义Java路径。其他参数在“命令行参数”或“JVM参数”中可以设置一些调优参数例如-Xms512m -Xmx1024m设置JVM堆内存初始值和最大值。-Dspring.profiles.activeprod如果配置了多环境这里可以指定使用生产环境配置通常我们会把生产配置直接做到默认配置里更安全。点击“提交”后管理器会尝试启动项目。重点来了不要只看面板上显示的“运行中”状态一定要点开“日志”标签查看实时日志和控制台输出。很多错误信息在这里才能看到。踩坑记录3宝塔Java项目管理器的“运行者”问题我们遇到一个诡异的问题项目显示运行成功但就是无法访问端口也没监听。查看系统进程ps aux | grep java发现Jar包是以root用户运行的这本身没问题。但查看宝塔Java项目管理器的日志发现其“运行者”显示为root而项目实际启动的用户却是www宝塔面板默认的Web服务用户。这导致了文件权限冲突我们的上传路径/www/wwwroot/upload/ruoyi目录权限是root:root但尝试写入文件的进程用户是www导致“Permission denied”。解决方案统一权限。有两种思路修改目录权限通过SSH将上传目录的所有者改为www用户和用户组并赋予写权限。chown -R www:www /www/wwwroot/upload/ruoyi chmod -R 755 /www/wwwroot/upload/ruoyi # 或 755根据实际情况调整修改项目运行用户更推荐在宝塔Java项目管理器中虽然界面没有直接提供修改运行用户的选项但你可以通过修改项目的启动脚本实现。不过更简单的做法是确保你的应用不依赖特定用户的文件系统权限。对于上传目录可以在项目启动时或通过代码检查并创建该目录并设置合适的权限。或者一劳永逸的方法是在服务器上创建一个专门用于运行Java服务的系统用户如javaapp并在宝塔面板的“计划任务”中使用sudo -u javaapp命令来启动Jar包从而绕过Java项目管理器。4. 前端项目构建与Nginx配置RuoYi-Vue的前端是一个基于Vue.js的单页应用SPA我们需要将其构建成静态文件然后用Nginx托管。4.1 前端项目构建与优化在本地进入RuoYi前端项目目录通常包含package.json和vue.config.js。修改接口地址打开vue.config.js文件找到devServer.proxy配置这是开发环境的代理。但生产环境我们通过Nginx代理所以这里更重要的是检查axios的默认baseURL。通常在src/utils/request.js文件中会设置一个baseURL。你需要将其改为你的后端API地址或者直接设置为相对路径/由Nginx统一转发。更常见的做法是保持其为/然后在Nginx配置中处理API请求的转发。安装依赖并构建# 安装依赖如果node_modules不存在 npm install --registryhttps://registry.npmmirror.com # 使用国内镜像加速 # 构建生产环境静态文件 npm run build:prod构建成功后会在项目根目录下生成一个dist文件夹里面就是所有的HTML、CSS、JS文件。4.2 Nginx配置与反向代理这是前后端分离部署的核心环节。我们将前端dist文件夹上传到服务器例如放到/www/wwwroot/ruoyi-ui目录下。接下来在宝塔面板的“网站”模块添加一个站点。域名填写你的域名或者暂时用服务器IP地址。根目录指向刚才上传的前端dist文件夹路径即/www/wwwroot/ruoyi-ui。FTP、数据库根据需求创建本项目不需要可以不用创建。添加站点后点击站点设置进入“配置文件”标签。我们需要修改Nginx配置以实现两个核心功能托管前端静态文件、将API请求代理到后端Spring Boot服务。一个典型的配置示例如下server { listen 80; server_name your-domain.com; # 替换为你的域名或IP index index.html index.htm; root /www/wwwroot/ruoyi-ui; # 前端静态文件目录 # 前端静态资源服务 location / { try_files $uri $uri/ /index.html; # 支持Vue Router的history模式 # 如果使用hash模式则不需要上面这行 } # 代理后端API请求 location /prod-api/ { # 注意RuoYi前端默认请求前缀是/prod-api/ proxy_pass http://127.0.0.1:8080/; # 代理到后端服务地址和端口 proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; # 以下配置用于解决WebSocket、超时等问题如果用到 proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection upgrade; proxy_read_timeout 300s; proxy_send_timeout 300s; } # 代理上传文件的访问路径与后端配置的profile对应 location /profile/ { proxy_pass http://127.0.0.1:8080/profile/; # 同上可以添加其他proxy_set_header } # 静态资源缓存设置 location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ { expires 1y; add_header Cache-Control public, immutable; } }踩坑记录4404与代理路径错乱这是最高频的坑。现象是前端页面能打开但登录时提示404或网络错误。检查点1代理路径。Nginx配置中的location /prod-api/必须与前端的axios请求的baseURL匹配。如果前端请求发到了/api/那么Nginx也要改成location /api/。关键在于前后端对请求路径的约定必须一致。检查点2proxy_pass结尾的斜杠。proxy_pass http://127.0.0.1:8080/;结尾的斜杠很重要。它意味着将/prod-api/xxx转发为http://127.0.0.1:8080/xxx。如果没有这个斜杠则会转发为http://127.0.0.1:8080/prod-api/xxx而后端Spring Boot应用可能并没有配置/prod-api这个上下文路径导致404。检查点3后端服务是否真的在运行。在服务器上执行curl http://127.0.0.1:8080看后端服务是否正常响应。检查点4Nginx配置语法与重载。修改配置后一定要在宝塔面板点击“重载配置”或“重启Nginx”并在“网站日志”中查看错误日志。5. 部署后常见问题排查与优化即使一切配置看似正确服务也可能出问题。这里记录几个我们遇到的“深坑”。5.1 前端访问后端跨域CORS问题在开发阶段我们通过Vue CLI的代理解决了跨域。但在生产环境Nginx代理已经将前后端请求统一到同一个域名和端口下理论上不会发生跨域。如果浏览器控制台仍然出现CORS错误那问题可能出在后端。排查步骤确认请求路径浏览器开发者工具的网络Network标签中查看请求的URL是否是像http://your-domain.com/prod-api/login这样的形式而不是直接请求http://ip:8080/login。如果是后者说明前端配置的baseURL不对没有走Nginx代理。检查后端CORS配置RuoYi框架通常在WebMvcConfigurer或通过CrossOrigin注解配置了CORS。确保生产环境下允许的源origin包含了你的前端域名或者设置为*仅限测试生产环境建议指定具体域名。检查Nginx代理头确保Nginx配置中正确传递了Host、Origin等头部信息如上文配置所示。5.2 静态资源如图片、文件无法访问用户上传的头像或文件无法在前端显示。原因我们在Nginx中配置了location /profile/代理到后端。但文件上传后存储的路径可能是绝对路径/www/wwwroot/upload/ruoyi/2023/xx/xx.jpg。当用户访问http://your-domain.com/profile/2023/xx/xx.jpg时Nginx将这个请求代理给了后端后端程序需要能根据请求路径找到磁盘上的文件并返回。解决方案确保两点后端application.yml中的file.profile配置的路径与文件实际存储的绝对路径一致。后端代码中文件访问控制器通常是ResourcesController配置的映射路径如/profile/**与Nginx中的location /profile/匹配。这样当Nginx将请求转发到后端http://127.0.0.1:8080/profile/2023/xx/xx.jpg时后端控制器才能正确响应。5.3 性能优化与安全加固部署上线不是终点还需要做些优化。开启HTTPS宝塔面板可以一键申请并部署Let‘s Encrypt免费SSL证书在网站设置中开启“强制HTTPS”提升安全性。Nginx性能调优可以在配置文件中调整一些参数如worker_processes工作进程数通常等于CPU核心数、worker_connections每个进程连接数、keepalive_timeout长连接超时等。JVM调优在宝塔Java项目管理器的JVM参数中根据服务器内存大小调整-Xms和-Xmx。例如4G内存的机器可以设置为-Xms1g -Xmx2g。添加-XX:UseG1GC使用G1垃圾收集器通常能获得更好的性能表现。数据库连接池优化检查application-druid.yml中的Druid连接池配置如initialSize、minIdle、maxActive、maxWait等根据实际并发量调整。防火墙与端口管理务必在宝塔安全面板和云服务器安全组中关闭不必要的端口如3306只开放80、443以及后端管理所需的端口如SSH的22端口、宝塔的8888端口。5.4 服务监控与日志管理日志Spring Boot的日志默认输出到控制台被Java项目管理器捕获。但生产环境最好将日志输出到文件并配置日志滚动策略。可以在application.yml中配置logging.file.path和logging.logback.rollingpolicy。监控宝塔面板本身提供了简单的服务器资源监控。对于应用监控可以考虑集成Spring Boot Actuator或者使用更专业的APM工具。备份定期备份数据库和上传的文件。宝塔面板提供了计划任务功能可以定时执行数据库导出和文件打包压缩命令并发送到远程存储或网盘。整个部署过程就像搭积木每一步都要严丝合缝。图形化工具带来了便利但也隐藏了细节。当遇到问题时最有效的调试方法就是“剥洋葱”从前端浏览器控制台看网络请求和响应到Nginx访问日志和错误日志再到后端Spring Boot的应用日志最后到数据库查询。顺着这条链总能找到问题根源。希望这篇超详细的记录能让你在部署RuoYi或类似Spring BootVue项目时心里更有底。
返回列表