基于Jenkins+Github的CI/CD

Sunny 6/17/2019 CI/CD

# 一、引言

老冯最近打算整理下做前端工程师这两年总结的笔记，以前用Hexo写博客，并部署到GitPage上，加载速度相当慢。最近VuePress兴起，老冯决定一探究竟，同时将新项目部署到自己的服务器上，顺带搞一下CI/CD。

CI/CD 解释

CI：Continuous Integration，也就是持续集成
CD：Continuous Delivery 和 Continuous Deployment，也就是持续交付、持续部署

工作流程

前提: 开发人员提交代码到 GitHub (也可以是 Gitlab 或者 SVN )
触发: Jenkins 通过 WebHock/人工/定时器 触发构建
构建: Jenkins 根据配置自动拉取代码、编译并打包项目
部署: Jenkins 根据配置自动部署到服务器

# 二、搭建CI/CD环境

购买阿里云服务器( ECS 和 轻应用服务器 都行，我的是之前搞活动低价购买的 轻应用服务器 )，系统镜像选用 CentOS7 ;

安装 Git
安装 Jenkins
安装 Nginx
安装 NodeJS

# 2.1 安装 Git

安装 git 是为了 Jenkins 拉取代码

$ yum install git -y

想知道git安装在了什么位置可以使用以下命令

$ whereis git

# 2.2 安装 Jenkins

Jenkins 依赖 jdk，所以需要先在CentOS7上安装Java8，再继续下列步骤。

# 方法一（太慢了）

安装自动选择最快源的插件

yum install yum-fastestmirror -y

添加 Jenkins 源

$ wget -O /etc/yum.repos.d/jenkins.repo http://jenkins-ci.org/redhat/jenkins.repo
$ rpm --import http://pkg.jenkins-ci.org/redhat/jenkins-ci.org.key

1
2

安装 Jenkins

$ yum install jenkins -y

启动 Jenkins

$ service jenkins start

# 方法二（国内镜像安装）

清华大学开源软件镜像站 (opens new window)

wget https://mirrors.tuna.tsinghua.edu.cn/jenkins/redhat/jenkins-2.233-1.1.noarch.rpm
rpm -ivh jenkins-2.233-1.1.noarch.rpm

1
2

启动

# 检查Jenkins服务状态
sudo systemctl status jenkins
# 设置为开机自启动
sudo systemctl enable jenkins
# 启动Jenkins服务
sudo systemctl start jenkins

1
2
3
4
5
6

安装 Jenkins 插件

这里你可能会遇到一些问题，Jenkins 默认端口是 8080，但阿里云默认不开启 8080 端口，需要手动添加。

（1）假设服务器IP是 120.130.140.150，在浏览器中输入 http://120.130.140.150:8080，根据提示获取指定文件中的密码，这里你可能需要在本地登录远程服务器后执行下述命令。

$ cat /var/lib/jenkins/secrets/initialAdminPassword

（2）安装推荐的插件，成功（或部分插件安装失败）后创建第一个管理员用户，输入 用户名 、密码、全名、邮箱 后点两次完成并保存 就OK了。

# 2.3 安装 Nginx

安装 Nginx

$ yum install nginx -y

启动 Nginx

$ service nginx start

配置 Nginx

$ vim /etc/nginx/nginx.conf

将root修改为前端代码部署的路径

location / {
    root /usr/local/feng-blog-vuepress/dist;
    index index.html;
}

1
2
3
4

检查配置文件是否有错误

$ nginx -t

刷新 Nginx 配置

$ nginx -s reload

# 2.4 安装 NodeJS

参考在CentOS7上安装NodeJS中的方法。

推荐方法一，理由是最简单最快最不容易出错，另外要注意自己项目依赖的 Node 版本。

# 三、Jenkins 全局配置

# 3.1 GitHub 生成 Personal Access Token

进入 Github - Setting - Developer Setting - Personal Access Token (opens new window)，点击 Generate new token （可能需要输入 GitHub 密码）后开始创建：

在 Note 一栏输入描述信息，看自己心情就好，比如：Jenkins-hook
在 Select scopes 一项中勾选 repo 和 admin:repo_hook
点击最下方 Generate token 完成创建
创建完成后，找个地方手动记录下生成的 Secret text，大概长这样：aa406d89b16c37d73e2beaec5e9bf8bdfcb52982

# 3.2 配置 GitHub 选项

进入 Manage Jenkins - Config System 配置 GitHub - Github 服务器。

添加一个服务器，名称看心情，可为空。

添加一个 Secret text 类型的 全局凭证。Secret中填入 3.1 中的 Secret text： aa406d89b16c37d73e2beaec5e9bf8bdfcb52982，描述简单写一下。

# 3.3 配置 Git 选项

进入 Manage Jenkins - Global Tool Configuration 配置 Git - Path to Git executable。

提示

可使用 whereis git 命令查看 Git 的位置。

# 四、自由风格项目的配置

创建一个新的项目，输入一个任务名称，选择 Freestyle project

# 4.1 General

分别配置 描述、GitHub项目、丢弃旧的构建策略 三个选项

# 4.2 源码管理

分别配置 Git、源码库浏览器 两个选项

这里需要添加一个 Username with password 类型的全局凭证，用户名和密码分别是 GitHub 的用户名和密码，描述简单写一下。

# 4.3 构建触发器

该部分可以独立于本节之外，单独配置

详见Jenkins与Github集成webhook配置 (opens new window)

# 4.4 构建环境

到目前为止，我们一共创建了两个 全局凭证，一个是 Secret text 类型的，一个是 Username with password 类型的。

勾选 Use secret text(s) or file(s)，并新增一个 Secret text 类型的绑定。

凭证选择已有的 Secret text 类型的 全局凭证。

# 4.5 构建

新增一个执行shell 类型的构建，并编写编译和部署项目的shell脚本。

一、到目前为止我们对服务器的操作都是以 root 用户的身份进行的，但是 Jenkins 的默认用户是 jenkins，而 jenkins 没有权限操作属于 root 的文件，所以我们需要修改 Jenkins 配置文件，将Jenkins 的默认用户 jenkins 改成 root

将配置文件中的 JENKINS_USER 的值修改为 root

$ vim /etc/sysconfig/jenkins

重启 Jenkins

$ service jenkins restart

二、此外我用了包管理工具 yarn，而不是 npm，故还需要全局安装一个 yarn

$ npm install yarn -g

拓展：其他集成工具

除了 Jenkins CI 还有 Travis CI (opens new window)、Circle CI (opens new window) 等 GitHub 十大 CI 工具 (opens new window)，其中

Travis CI 是基于 GitHub 的 CI 托管解决方案之一，由于和 GitHub 的紧密集成，在开源项目中被广泛使用。
CircleCI 是一款很有特色，也是比较流行的云端持续集成管理工具，目前仅支持 GitHub 和 bitbucket，它和其他工具的区别在于他提供服务的方式不同，CircleCI 需要付费的资源主要是它的容器。

老冯博客

Choose mode