1、 代码提交
1.1 在服务器上创建一个web-demo的目录,用户web前端项目的开发目录
mkdir web-demo
# 在web-demo目录下 编辑一个index.html的文件
cat index.html
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>实例</title>
</head>
<body><h1>Hello k8s!</h1>
</body>
</html>
1.2 在Gitlab上位web前端项目创建一个仓库
Gitlab首页-》新建项目/仓库-》创建空白项目，在页面上输入项目名称，项目url以及选择关联的用户，其他选项保持默认即可
- 默认存在一个main的分支，在GitHub之前版本，这个默认分支被命名为master
- 在软件开发过程中，通常会基于分支来进行版本管理，这意味着每一个代码仓库中会存在多个分支，每个分支都有特定的用途和职责，以下是几种常见的分支类型
- 主分支（main-branch）：主分支通常被视为项目中的主要代码线，经过严格的测试和验证，符合生产环境的标准，既用户使用的代码版本
- 开发分支（develop-branch）：用于开发人员日常功能开发、修复和测试的代码版本
- 发布分支（Release-branch）：准备上线的代码版本。在准备上线前，开发人员会基于开发分支创建一个发布分支，在这个分支上进行全面测试，一旦测试通过就将其合并到主分支上
1.3 使用git将本地代码提交到GitHub上
# 进入到项目目录
cd /root/web-demo
# 初始化一个git仓库
git init
# 将所有文件添加到暂存区中
git add .
# 将所有文件提交到本地仓库中
git config user.name "suyajun"
git config user.email "suyajun"
git commit -m 'Initial commit'
# 关联远程仓库
git remote add origin http://172.16.99.82:88/root/web-demo.git
# 创建并切换到dev分支
git checkout -b dev
# 推送dev分支到远程仓库中
[root@cicd-82 web-demo]# git push origin dev
Username for 'http://172.16.99.82:88': root
Password for 'http://root@172.16.99.82:88':
Counting objects: 3, done.
Delta compression using up to 6 threads.
Compressing objects: 100% (2/2), done.
Writing objects: 100% (3/3), 303 bytes | 0 bytes/s, done.
Total 3 (delta 0), reused 0 (delta 0)
remote:
remote: To create a merge request for dev, visit:
remote: http://172.16.99.82/root/web-demo/-/merge_requests/new?merge_request%5Bsource_branch%5D=dev
remote:
To http://172.16.99.82:88/root/web-demo.git* [new branch] dev -> dev
- 代码提交成功后，在GitHub项目页面左上角选择dev分支，将看到该分支的代码文件
2 jenkins 创建项目
2.1 在jenkins上创建一个item（项目），为web前端项目配置CI/CD流程。
-
这里选择Freestyle project，这是一种经典的自由风格项目类型，具有高度的灵活性，可自定义构建过程、构建环境以及后续操作等
-
General：项目的基本设置，如项目名称、描述、参数化构建选项、并发构建数等
-
源码管理（Source Code Management）：代码仓库的配置，如URL、分支、认证等信息
-
构建触发器（Build Triggers）：表示在什么条件下自动构建项目，用户可以选择定时构建、代码提交触发构建、其他项目构建成功触发构建等
-
Environment：这个是Jenkins:2.491新加的功能
-
构建步骤（Build Steps）：配置实际的构建过程，用户可以添加多个构建步骤，每个步骤代表一个操作，该操作可以是代码编译、单元测试等。构建步骤是项目的核心，它定义了实际的构建流程
-
构建后操作（Post-build Actions）：在构建完成后执行的操作，用户可以添加多个操作，这些操作可以是发送通知、部署到服务器、触发其他项目等
2.2 项目配置
2.2.1 配置源代码管理(Source Code Management)
源码管理页面显示None或者无，因为该功能需要Git插件的支持，我们需要额外安装插件：Manage Jenkins》Plugins》Available plugins》》搜索关键字Git，选中Git，点击Install without restart按钮进行安装
- 安装完成后，可以看到与Git相关的配置选项
- Repository URL：指定代码仓库地址。这里输入http://172.16.99.82:88/root/web-demo.git
- Credentials:选择访问代码仓库的凭据。上述代码中仓库是私有的，既下载和上传代码都需要用户认证。点击下方的Add添加凭据，选择Jenkins，添加以下字段：
- Username：用户名，这里输入root
- Password：密码，这里输入Gitlab root用户的密码
- Description：凭据描述，输入Gitlab-auth
- Branches to build：指定构建的代码分支，这里输入*/dev
2.2 配置构建触发器(Triggers)
在Triggers 部分选择 Poll SCM，以定期轮询检查代码仓库中是否有新的提交。如果有，则自动触发构建。
每分钟执行一次检查，在Schedule字段中输入 Cron 表达式，如下图所示
2.3 配置构建步骤（Build Steps）
构建步骤的主要任务是将获取的代码文件推送到web服务器上并将其部署到网站程序的根目录中。这类需求可以使用scp、rsync等工具来实现 ，在Execute shell中定义具体的命令。这类需求还可以使用 Publish Over SSH插件来实现，并支持在目标服务器上执行shell脚本。该插件需要额外进行安装：Manage Jenkins》plugins》Available Pulgins》搜索关键字Publish Over SSH，选中Publish Over SSH 点击Install 进行安装
- 安装完成后，首先添加目标服务器：Manage Jenkins》System》Publish Over SSH，点击Add按钮添加服务器，配置如下：
- Name：服务器名称，可自定义，如web-server
- Hostname：主机名或IP地址
- Username：登录服务器的用户名
- Remote Directory：远程目录，这里设置为/tmp
- Advanced：点击此按钮。设置用户名对应的密码或者秘钥
配置完成后，可以点击Test Configuration按钮验证SSH连接是否成功，点击Save按钮保存配置
然后，在构建步骤部分选择Send files or execute commands over SSH，配置如下：
- Name：选择更添加的目标服务器
- Transfer Set Source files：指定传输文件的源路径，可以使用通配符来匹配多个文件。这里输入**/* 表示传输当前目录(代码目录)下的所有文件和目录
- Remove prefix：如果在Transfer Set Source files设置的源路径中包含路径信息，可以在这里指定移除路径的前缀
- Remote directory：远程目录。这个目录会与添加目标服务器那里的“Remote directory”目录进行拼接。例如，这里设置为web-demo，那么将传输到目标服务器的/tmp/web-demo目录中
- Exec command：传输完成后，在远程服务器上执行的命令。这里主要实现将/tmp/web-demo目录代码移动到网站程序的根目录/usr/share/nginx/html中
- Build Steps配置如下所示
2.4 验证与测试
项目配置完成后，手动执行一次构建以验证整个自动化流程。
点击项目名称web-demo，选择Build Now，开始执行构建流程。在项目的左下角会生成一个构建编号，从1开始递增，单机构建编号，选择Console Output以查看控制台输出，以确认每个步骤是否正常执行。如下图所示
在上述控制台输出中，显示了整个构建的过程。首先表明当前构建的工作空间（Building in workspace /var/jenkins_home/workspace/web-demo），既源代码所在目录，下面的所有操作都将在这个目录下进行。接着，将dev分支代码从代码仓库下载到当前目录中。然后，通过ssh将当面目录下文件（源代码）传输到目标服务器web-server上并执行命令
通过浏览器访问web服务器，将看到网站首页，内容为 Hello K8s
