Docker与Jenkins实现RuoYi-Vue前后端分离项目的CICD全流程自动化
<div id="navCategory"><h5 class="catalogue">目录</h5><ul class="first_class_ul"><li><a href="#_label0">一、环境准备与架构设计</a></li><ul class="second_class_ul"><li><a href="#_lab2_0_0">1. 主机环境规划</a></li><li><a href="#_lab2_0_1">2. 核心技术栈</a></li><li><a href="#_lab2_0_2">3. Docker环境安装</a></li></ul><li><a href="#_label1">二、GitLab部署与代码管理</a></li><ul class="second_class_ul"><li><a href="#_lab2_1_3">1. GitLab容器部署</a></li><li><a href="#_lab2_1_4">2. GitLab配置修改</a></li><li><a href="#_lab2_1_5">3. 代码上传至GitLab</a></li></ul><li><a href="#_label2">三、Jenkins部署与配置</a></li><ul class="second_class_ul"><li><a href="#_lab2_2_6">1. 定制Jenkins镜像</a></li><li><a href="#_lab2_2_7">2. 启动Jenkins容器</a></li><li><a href="#_lab2_2_8">3. 初始化Jenkins</a></li></ul><li><a href="#_label3">四、基础服务部署</a></li><ul class="second_class_ul"><li><a href="#_lab2_3_9">1. MySQL部署</a></li><li><a href="#_lab2_3_10">2. Redis部署</a></li></ul><li><a href="#_label4">五、CICD流水线配置</a></li><ul class="second_class_ul"><li><a href="#_lab2_4_11">1. 后端服务流水线</a></li><ul class="third_class_ul"><li><a href="#_label3_4_11_0">① 项目配置修改</a></li><li><a href="#_label3_4_11_1">② 创建Dockerfile</a></li><li><a href="#_label3_4_11_2">③ 创建Jenkinsfile</a></li></ul><li><a href="#_lab2_4_12">2. 前端服务流水线</a></li><ul class="third_class_ul"><li><a href="#_label3_4_12_3">① 创建Nginx配置文件</a></li><li><a href="#_label3_4_12_4">② 创建Dockerfile</a></li><li><a href="#_label3_4_12_5">③ 创建Jenkinsfile</a></li></ul><li><a href="#_lab2_4_13">3. 配置自动触发</a></li><ul class="third_class_ul"></ul></ul><li><a href="#_label5">六、验证部署结果</a></li><ul class="second_class_ul"></ul></ul></div><p>在现代软件开发流程中,持续集成/持续部署(CICD)已经成为提升开发效率、保障代码质量的关键实践。本文将详细介绍如何利用Docker容器化技术结合Jenkins,搭建一套完整的CICD流程,实现RuoYi-Vue前后端分离项目的自动化构建、测试和部署,从代码提交到自动部署的全流程自动化。</p><p class="maodian"><a name="_label0"></a></p><h2>一、环境准备与架构设计</h2>
<p class="maodian"><a name="_lab2_0_0"></a></p><h3>1. 主机环境规划</h3>
<p>本次部署采用两台服务器(虚拟机)搭建CICD环境,具体配置如下:</p>
<table><thead><tr><th>主机IP</th><th>部署服务清单</th><th>配置要求</th></tr></thead><tbody><tr><td>192.168.10.13</td><td>Jenkins、Redis、MySQL、Spring Boot服务、Nginx</td><td>至少2核8G内存</td></tr><tr><td>192.168.10.80</td><td>Docker、GitLab</td><td>1核4G内存</td></tr></tbody></table>
<p class="maodian"><a name="_lab2_0_1"></a></p><h3>2. 核心技术栈</h3>
<ul><li><strong>版本控制</strong>:GitLab - 用于代码仓库管理</li><li><strong>持续集成</strong>:Jenkins - 实现自动化构建与部署</li><li><strong>容器化</strong>:Docker - 统一应用运行环境</li><li><strong>数据库</strong>:MySQL 8.0 - 存储应用数据</li><li><strong>缓存</strong>:Redis 7.4 - 提升应用性能</li><li><strong>Web服务器</strong>:Nginx - 部署前端应用并反向代理</li></ul>
<p class="maodian"><a name="_lab2_0_2"></a></p><h3>3. Docker环境安装</h3>
<p>所有服务器需先安装Docker环境,步骤如下:</p>
<div class="jb51code"><pre class="brush:bash;"># 安装依赖包
yum install -y yum-utils device-mapper-persistent-data lvm2
# 设置阿里云镜像源
yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo
# 安装指定版本Docker并设置开机自启
yum install -y docker-ce-20.10.18 docker-ce-cli-20.10.18 containerd.io
systemctl start docker.service
systemctl enable docker.service
# 配置华为镜像加速器
mkdir -p /etc/docker
tee /etc/docker/daemon.json <<-'EOF'
{
"registry-mirrors": [ "https://0a40cefd360026b40f39c00627fa6f20.mirror.swr.myhuaweicloud.com" ]
}
EOF
systemctl daemon-reload
systemctl restart docker
</pre></div>
<p class="maodian"><a name="_label1"></a></p><h2>二、GitLab部署与代码管理</h2>
<p class="maodian"><a name="_lab2_1_3"></a></p><h3>1. GitLab容器部署</h3>
<div class="jb51code"><pre class="brush:bash;"># 拉取GitLab镜像
docker pull beginor/gitlab-ce
# 创建数据卷目录并授权
mkdir -p /data/gitlab/etc/ /data/gitlab/log/ /data/gitlab/data
chmod 777 /data/gitlab/etc/ /data/gitlab/log/ /data/gitlab/data/
# 启动GitLab容器
docker run -itd --name=gitlab \
--restart=always \
--privileged=true \
-p 8443:443 \
-p 80:80 \
-p 222:22 \
-v /data/gitlab/etc:/etc/gitlab \
-v /data/gitlab/log:/var/log/gitlab \
-v /data/gitlab/data:/var/opt/gitlab \
beginor/gitlab-ce
</pre></div>
<p class="maodian"><a name="_lab2_1_4"></a></p><h3>2. GitLab配置修改</h3>
<div class="jb51code"><pre class="brush:bash;"># 修改修改外部访问地址
sed -i "/external_url 'GENERATED_EXTERNAL_URL'/a external_url\t'http://192.168.10.80' " /data/gitlab/etc/gitlab.rb
# 修改SSH主机地址
sed -i "/gitlab_ssh_host/a gitlab_rails['gitlab_ssh_host']= '192.168.10.80' " /data/gitlab/etc/gitlab.rb
# 修改SSH端口
sed -i "/gitlab_shell_ssh_port/a gitlab_rails['gitlab_shell_ssh_port'] = 222" /data/gitlab/etc/gitlab.rb
# 重启GitLab
docker restart gitlab
</pre></div>
<p class="maodian"><a name="_lab2_1_5"></a></p><h3>3. 代码上传至GitLab</h3>
<ol><li>从Gitee克隆RuoYi-Vue项目:<code>git clone https://gitee.com/y_project/RuoYi-Vue.git</code></li><li>在GitLab创建创建两个项目:<code>ruoyi-server</code>(后端)和<code>ruoyi-ui</code>(前端)</li><li>将代码分别推送至对应仓库:</li></ol>
<div class="jb51code"><pre class="brush:bash;"># 初始化本地仓库
git init
# 关联远程仓库
git remote add origin http://192.168.10.80/root/ruoyi-server.git
# 提交并推送代码
git add .
git commit -m "Initial commit"
git push -u origin master
</pre></div>
<p class="maodian"><a name="_label2"></a></p><h2>三、Jenkins部署与配置</h2>
<p class="maodian"><a name="_lab2_2_6"></a></p><h3>1. 定制Jenkins镜像</h3>
<p>为满足RuoYi项目构建需求,我们需要定制包含JDK、Maven和Node.js的Jenkins镜像:</p>
<div class="jb51code"><pre class="brush:bash;">FROM jenkins/jenkins:2.480-jdk21
EXPOSE 8080
# 添加依赖工具
ADD apache-maven-3.9.9-bin.tar.gz /usr/local
ADD jdk-8u421-linux-x64.tar.gz /usr/local
ADD node-v11.0.0-linux-x64.tar.gz /usr/local
# 覆盖maven配置
ADD settings.xml /usr/local/apache-maven-3.9.9/conf/
# 配置环境变量
ENV TZ=Asia/Shanghai
ENV M2_HOME=/usr/local/apache-maven-3.9.9
ENV NODE_HOME=/usr/local/node-v11.0.0-linux-x64
ENV PATH=$M2_HOME/bin:$NODE_HOME/bin:$PATH
</pre></div>
<p>构建镜像:<code>docker build -t jenkins .</code></p>
<p class="maodian"><a name="_lab2_2_7"></a></p><h3>2. 启动Jenkins容器</h3>
<div class="jb51code"><pre class="brush:bash;"># 创建数据目录
mkdir -p /data/jenkins/jenkins_home
chmod +777 /data/jenkins/jenkins_home
# 启动容器
docker run -d --name jenkins \
-p 0.0.0.0:8080:8080 \
-v /data/jenkins/jenkins_home:/var/jenkins_home \
-v /etc/localtime:/etc/localtime \
-v /run/docker.sock:/run/docker.sock \
-v /usr/bin/docker:/usr/bin/docker \
jenkins
</pre></div>
<p class="maodian"><a name="_lab2_2_8"></a></p><h3>3. 初始化Jenkins</h3>
<ol><li>获取初始密码:<code>docker exec jenkins cat /var/jenkins_home/secrets/initialAdminPassword</code></li><li>访问<code>http://192.168.10.13:8080</code>,输入密码并安装推荐插件</li><li>配置JDK环境:进入"全局工具配置",设置JDK安装目录</li></ol>
<p class="maodian"><a name="_label3"></a></p><h2>四、基础服务部署</h2>
<p class="maodian"><a name="_lab2_3_9"></a></p><h3>1. MySQL部署</h3>
<div class="jb51code"><pre class="brush:bash;">docker run -d \
--name mysql \
-p 0.0.0.0:3306:3306 \
-e MYSQL_ROOT_PASSWORD=123456 \
--restart=always \
mysql:8.0.39
# 导入初始化数据
docker exec -it mysql bash
mysql -uroot -p123456
create database ry-vue;
use ry-vue;
source /opt/ry_20250522.sql;
source /opt/quartz.sql;
</pre></div>
<p class="maodian"><a name="_lab2_3_10"></a></p><h3>2. Redis部署</h3>
<div class="jb51code"><pre class="brush:bash;">docker run -d \
--name redis \
-p 0.0.0.0:6379:6379 \
--restart=always \
redis:7.4.1
</pre></div>
<p class="maodian"><a name="_label4"></a></p><h2>五、CICD流水线配置</h2>
<p class="maodian"><a name="_lab2_4_11"></a></p><h3>1. 后端服务流水线</h3>
<p class="maodian"><a name="_label3_4_11_0"></a></p><h4>① 项目配置修改</h4>
<p>修改<code>ruoyi-admin/src/main/resources/application-druid.yml</code>中的数据库连接信息和Redis配置,确保指向正确的服务地址。</p>
<p class="maodian"><a name="_label3_4_11_1"></a></p><p class="maodian"><a name="_label3_4_12_4"></a></p><h4>② 创建Dockerfile</h4>
<div class="jb51code"><pre class="brush:bash;">FROM openjdk:8u342
ENV TZ=Asia/Shanghai
ADD ruoyi-admin/target/ruoyi-admin.jar app.jar
ENTRYPOINT ["java", "-jar", "app.jar"]
</pre></div>
<p class="maodian"><a name="_label3_4_11_2"></a></p><p class="maodian"><a name="_label3_4_12_5"></a></p><h4>③ 创建Jenkinsfile</h4>
<div class="jb51code"><pre class="brush:bash;">pipeline {
agent any
tools {
jdk 'jdk8'
}
environment {
APP_NAME = 'ruoyi-server'
APP_PORT = 9800
}
stages {
stage('build') {
steps {
script {
sh 'mvn clean package -DskipTests=true'
}
}
}
stage('deploy') {
steps {
script {
sh """
docker stop $APP_NAME || true
docker rm $APP_NAME || true
docker rmi $APP_NAME || true
docker build -t $APP_NAME .
docker run -d --name $APP_NAME \
-p 0.0.0.0:$APP_PORT:$APP_PORT \
--restart=always \
$APP_NAME \
--server.port=$APP_PORT
"""
}
}
}
}
}
</pre></div>
<p class="maodian"><a name="_lab2_4_12"></a></p><h3>2. 前端服务流水线</h3>
<p class="maodian"><a name="_label3_4_12_3"></a></p><h4>① 创建Nginx配置文件</h4>
<div class="jb51code"><pre class="brush:bash;">server {
listen 9801;
charset utf-8;
location / {
root /usr/share/nginx/html;
try_files $uri $uri/ /index.html;
}
location /prod-api {
rewrite ^/prod-api/(.*)$ /$1 break;
proxy_pass http://192.168.10.13:9800;
}
}
</pre></div>
<h4>② 创建Dockerfile</h4>
<div class="jb51code"><pre class="brush:bash;">FROM nginx:1.26.2
ENV LC_ALL=C.UTF-8
RUN rm -rf /etc/nginx/conf.d/default.conf
ADD nginx.conf /etc/nginx/conf.d
COPY dist/ /usr/share/nginx/html/
</pre></div>
<h4>③ 创建Jenkinsfile</h4>
<div class="jb51code"><pre class="brush:bash;">pipeline {
agent any
environment {
APP_NAME = 'ruiyi-ui'
APP_PORT = 9801
}
stages {
stage('build') {
steps {
script {
sh """
npm install
npm run build:prod
"""
}
}
}
stage('deploy') {
steps {
script {
sh """
docker stop $APP_NAME || true
docker rm $APP_NAME || true
docker rmi $APP_NAME || true
docker build -t $APP_NAME .
docker run -d --name $APP_NAME \
-p 0.0.0.0:$APP_PORT:$APP_PORT \
--restart=always \
$APP_NAME
"""
}
}
}
}
}
</pre></div>
<p class="maodian"><a name="_lab2_4_13"></a></p><h3>3. 配置自动触发</h3>
<ol><li>在Jenkins项目中启用"Build when a change is pushed to GitLab"</li><li>生成Secret token并在GitLab项目的Webhooks中配置</li><li>配置触发URL:<code>http://192.168.10.13:8080/project/项目名称</code></li></ol>
<p class="maodian"><a name="_label5"></a></p><h2>六、验证部署结果</h2>
<p>完成上述配置后,每次向GitLab推送代码时,Jenkins将自动触发构建流程:</p>
<ol><li>后端服务构建完成后,可访问<code>http://192.168.10.13:9800</code>验证API是否可用</li><li>前端服务构建完成后,通过<code>http://192.168.10.13:9801</code>访问前端页面</li><li>使用默认账号密码(admin/123456)登录系统,验证整体功能</li></ol>
<p><strong>总结</strong><br />通过这套CICD流程,我们实现了RuoYi-Vue项目从代码提交到自动部署的全流程自动化,极大地提高了开发效率和部署一致性,为团队协作和持续交付奠定了坚实基础。</p>
<p>到此这篇关于Docker与Jenkins实现RuoYi-Vue前后端分离项目的CICD全流程自动化的文章就介绍到这了,更多相关RuoYi-Vue代码提交到自动部署的CICD内容请搜索琼殿技术社区以前的文章或继续浏览下面的相关文章希望大家以后多多支持琼殿技术社区!</p>
頁:
[1]