搜索
简帛阁>技术文章>自动化运维记录之GitLab CI/CD 自动化部署入门教程

自动化运维记录之GitLab CI/CD 自动化部署入门教程

1.前端项目自动化部署需要的环境依赖

Node 安装项目依赖、打包都需要
Nginx web 项目部署必须「正向代理、方向代理、负载均衡等等」、 GitLab 也会用到 
Nginx(默认自动安装)
Git 自动化部署,需要拉取代码
GitLab 没啥好说
GitLab-Runner 配合 GitLab CI/CD 使用的应用程序

2.安装 Node

下载和解压

# 下载安装包,需要哪个版本,在url中修改就可以了
wget https://nodejs.org/dist/v12.9.0/node-v12.9.0-linux-x64.tar.xz 

# 解压
tar xf node-v12.9.0-linux-x64.tar.xz

# 复制
cp -rf /root/node-v12.9.0-linux-x64 /usr/local/node

#编辑配置文件
vim /etc/profile

#在文件的最后,加上下面的内容
export PATH=$PATH:/usr/local/node/bin

#重载系统配置文件
source /etc/profile

#测试 node 环境变量是否生效
[root@jumpserver node]# node -v
v12.9.0

3.安装 Git

Gitlab自动化部署需要拉取代码,需要用到 Git。尽量安装Git 2.x.x版本,不然新版的 GitLab 自动化部署无法拉取代码。

本人安装的是 Git 2.24.4 版本,其他版本请自行尝试

使用 IUS 仓库(yum源),执行完下面的命令,应该就能安装了git
yum -y install \
https://repo.ius.io/ius-release-el7.rpm \
https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm

#安装 Git
[root@jumpserver yum.repos.d]# yum install -y git
#查看 Git版本
[root@jumpserver yum.repos.d]# git --version
git version 1.8.3.1

4.源码编译nginx

# 安装依赖包
[root@jumpserver data]# yum install -y gcc pcre-devel openssl-devel zlib-devel
[root@jumpserver data]# useradd -r -s /sbin/nologin nginx
[root@jumpserver data]# tar -xvf nginx-1.18.0.tar.gz
[root@jumpserver data]# cd nginx-1.18.0
[root@jumpserver nginx-1.18.0]#  ./configure --prefix=/usr/local/nginx \
>  --user=nginx \
>  --group=nginx \
> --with-http_ssl_module \
>  --with-http_v2_module \
>  --with-http_realip_module \
>  --with-http_stub_status_module \
>  --with-http_gzip_static_module \
>  --with-pcre \
>  --with-stream \
>  --with-stream_ssl_module \
>  --with-stream_realip_module

[root@jumpserver nginx-1.18.0]# make && make install

# 创建软链接
[root@jumpserver nginx-1.18.0]# ln -s /usr/local/nginx/sbin/nginx  /usr/sbin/
# 启动nginx
[root@jumpserver nginx]# nginx

[root@jumpserver nginx]# curl 192.168.32.132
<!DOCTYPE html>
<html>
<head>
<title>Welcome to nginx!</title>
<style>
    body {
        width: 35em;
        margin: 0 auto;
        font-family: Tahoma, Verdana, Arial, sans-serif;
    }
</style>
</head>
<body>
<h1>Welcome to nginx!</h1>
<p>If you see this page, the nginx web server is successfully installed and
working. Further configuration is required.</p>

<p>For online documentation and support please refer to
<a href="http://nginx.org/">nginx.org</a>.<br/>
Commercial support is available at
<a href="http://nginx.com/">nginx.com</a>.</p>

<p><em>Thank you for using nginx.</em></p>
</body>
</html>

# 设置自启动
[root@jumpserver system]# cat /lib/systemd/system/nginx.service 
[Unit]
Description=nginx service
After=network.target

[Service]
Type=forking
ExecStart=/usr/local/nginx/sbin/nginx
ExecReload=/usr/local/nginx/sbin/nginx -s reload
ExecStop=/usr/local/nginx/sbin/nginx -s quit
PrivateTmp=true

[Install]
WantedBy=multi-user.target

# 防火墙开放80端口
[root@jumpserver system]# firewall-cmd --permanent --zone=public --add-port=80/tcp
success
# 重新加载防火墙
[root@jumpserver system]# firewall-cmd --reload

5.安装GIt Lab

# 安装 GitLab,需要的时间比较长
yum -y install https://mirrors.tuna.tsinghua.edu.cn/gitlab-ce/yum/el7/gitlab-ce-14.3.0-ce.0.el7.x86_64.rpm
#编辑配置文件
vim /etc/gitlab/gitlab.rb

#找到,external_url, 修改 gitlab 访问地址。可以是域名(请确保确定域名正确解析了),服务器IP,也可以加上端口。设置端口时,请确保自己开放了对应的端口。可以参考上面提到防火墙问题

# 192.168.32.132 对应的就是服务器的IP,端口为 1874 

external_url 'http://192.168.32.132:1874'

# 开放 1874 端口
firewall-cmd --permanent --zone=public --add-port=1874/tcp

# 重载防火墙
firewall-cmd --reload

#重载配置文件,需要的时间比较长
[root@jumpserver ~]# gitlab-ctl reconfigure

# 启动gitlab服务

sudo gitlab-ctl start

# gitlab服务停止

sudo gitlab-ctl stop

# 重启gitlab服务

sudo gitlab-ctl restart

# 首次登录gitlab 密码
[root@jumpserver ~]# cat /etc/gitlab/initial_root_password
# WARNING: This value is valid only in the following conditions
#          1. If provided manually (either via `GITLAB_ROOT_PASSWORD` environment variable or via `gitlab_rails['initial_root_password']` setting in `gitlab.rb`, it was provided before database was seeded for the first time (usually, the first reconfigure run).
#          2. Password hasn't been changed manually, either via UI or via command line.
#
#          If the password shown here doesn't work, you must reset the admin password following https://docs.gitlab.com/ee/security/reset_user_password.html#reset-your-root-password.
#密码在这里:
Password: fBy1bpzI/sQ8J5bks1KS41hsW0eD9f1P/PX7HdHc6Z4=

# NOTE: This file will be automatically deleted in the first reconfigure run after 24 hours.

# 修改密码
进入 GitLab 控制台
gitlab-rails console -e production
执行命令: user = User.where(id: 1).first,此 user 则表示 root 用户
执行命令:user.password = 'admin@sjy’修改密码, user.password_confirmation = ‘admin@sjy’ 确认密码
执行命令: user.save
执行命令: exit

5.部署CI/CD

安装 gitlab-runner

# 下载
wget -O /usr/local/bin/gitlab-runner https://gitlab-runner-downloads.s3.amazonaws.com/latest/binaries/gitlab-runner-linux-amd64

# 分配运行权限
chmod +x /usr/local/bin/gitlab-runner

# 创建用户
useradd --comment 'GitLab Runner' --create-home gitlab-runner --shell /bin/bash

# 安装
gitlab-runner install --user=gitlab-runner --working-directory=/home/gitlab-runner

# 运行
gitlab-runner start

新建 runner

# 注册 runner
gitlab-runner register

# 输入 gitlab 的访问地址
http://192.168.32.132:1874 

# 输入 runner token,打开 http://192.168.32.132:1874/admin/runners 页面查看
tZwc77sFFHRbX6ck9q9r

# runner 描述,随便填
测试webpack-vue项目部署

# runner tag
webpack-vue-cicd

# 输入(选择) shell
shell

# 注册 runner
[root@jumpserver /]# gitlab-runner register
Runtime platform                                    arch=amd64 os=linux pid=12332 revision=febb2a09 version=15.0.0
Running in system-mode.   

# 输入 gitlab 的访问地址                                                   
Enter the GitLab instance URL (for example, https://gitlab.com/):
http://192.168.32.132:1874   
# 输入 runner token,打开 http://192.168.32.132:1874/admin/runners 页面查看
Enter the registration token:
tZwc77sFFHRbX6ck9q9r
# runner 描述,随便填
Enter a description for the runner:
[jumpserver]: 测试webpack-vue项目部署

Enter tags for the runner (comma-separated):
webpack-vue-cicd

Enter optional maintenance note for the runner:
shell

Registering runner... succeeded                     runner=tZwc77sF
Enter an executor: custom, docker, ssh, virtualbox, docker-ssh+machine, kubernetes, docker-ssh, parallels, shell, docker+machine:
shell
Runner registered successfully. Feel free to start it, but if it's running already the config should be automatically reloaded! 

注册完成后,就可以在http://localhost:1874/admin/runners 页面查看创建的runner

6.nginx 配置项目访问地址

# 创建目录
mkdir -pv /www/wwwroot/webpack_vue_cicd

# 分配权限
chown gitlab-runner /www/wwwroot/webpack_vue_cicd/

# 开放 3001 端口
firewall-cmd --permanent --zone=public --add-port=3001/tcp

# 重载防火墙
firewall-cmd --reload
# 打开 nginx 配置文件
vim /usr/local/nginx/conf/nginx.conf

# 在第一个 server  下方 (nginx 默认的,端口为80),加上下面的内容
server {
    listen       3001; # 端口号
    server_name  localhost; # 服务器地址

    location / {
        root   /www/wwwroot/webpack_vue_cicd; # 项目存放目录
        index  index.html index.htm; # 默认访问的主页
    }
}
# 重新加载nginx
[root@jumpserver /]# nginx -s reload

7.push 项目到gitlab 新建项目下

git remote update origin --prune  刷新分支 如果有旧分支删除 创建新的分支 就刷新到最新的分支在提交代码到那个新的分支上面

git branch  查看本地分支

git branch -a 查看本地以及远程所有分支

git branch -r 查看远程分支

git checkout -b compile remotes/origin/compile 切换到你想要提交的分支

git add . 

git commit -m ''  提交代码

git status 查看状态

git pull origin compile     拉取远程指定分支

git log -3 --graph compile 查看本地提交commit的状态


操作步骤:
1.将gitlab上新建项目先拉取到本地
2.将文件夹内容复制进此目录下
3.执行相关git命令
# git branch  查看本地分支
# git checkout -b compile remotes/origin/compile 切换到你想要提交的分支
# git add .  添加当前目录下的文件到缓存区
# git commit -m ''  提交代码注释
# git push origin main 推送项目到main 分支下
# git status 查看缓存区内容
# git clean -d * 删除缓存区所有内容

8. 编写 .gitlab-ci.yml 文件

.gitlab-ci.yml 文件是存放在项目的根目录下的,要提交到gitlab上面,runner 会根据 .gitlab-ci.yml 编写的规则自动部署项目

新建 .gitlab-ci.yml,添加下面的内容

# 阶段
stages:
  - build
  - deploy
  # 缓存 node_modules 减少打包时间,默认会清除 node_modules 和 dist 
cache:
  paths:
    - node_modules/

# 拉取项目,打包
build:
  stage: build # 阶段名称 对应,stages
  tags: # runner 标签(注册runner时设置的,可在 admin->runner中查看)
    - webpack-vue-cicd
  script: # 脚本(执行的命令行)
    - cd ${CI_PROJECT_DIR}
    - echo "当前目录位置:"
    - pwd
    - echo "安装npm步骤"
    - npm install
    - npm run build
  only:
    - main #拉取分支
  artifacts:   # 把 dist 的内容传递给下一个阶
    paths:
        - dist/

# 部署
deploy:
  stage: deploy # 阶段名称 对应,stages
  tags: # runner 标签(注册runner时设置的)
    - webpack-vue-cicd
  script: # 脚本(执行的命令行)
    - rm -rf /www/wwwroot/webpack_vue_cicd/*
    - cp -rf ${CI_PROJECT_DIR}/dist/* /www/wwwroot/webpack_vue_cicd/ # 把包完成,复制 dist 下的文件到对应的项目位置

9.验收效果

每次出发流水线的条件:
1.当有新的代码提交到gitlab分支上时,就会自动触发流水线
2.自己通过gitlab上的请求合并选项手动点击流水线
3.浏览器输入192.168.32.132:3001 访问项目


参考链接

预期目标源代码管理借助GitLab实现源代码托管,私有化部署版本,创建项目,创建用户组,分配权限,项目的签入/牵出等。自动化部署源代码产生变更时(如签入),自动化编译并发布到指定服务器中部署,借助Gi
思索工作中的重复性工作有哪些?新服务器上架,与CMDB、监控、堡垒机联动同步;操作系统初始化,包括用户、内核、安装源、规范目录、安全基线等;基础组件初始化,包括Java环境、Pyhon环境、N
前言之前陆续写了Gitlab的安装使用还有GitlabCI/CD的配置使用,已经把AspNetCore的后端项目都做了持续集成了,尝到甜头之后,现在前端的项目也要加入自动化部署,所以经过一番折腾,有了
用过GitLab的同学肯定也对GitLabCI/CD不陌生,GitLabCI/CD是一个内置在GitLab中的工具,它可以帮助我们在每次代码推送时运行一系列脚本来构建、测试和验证代码的更改以及部署。R
前言:随着企业应用的不断迭代,不断扩大,应用的发布发布可能涉及多个团队,如pc端,手机端,小程序端等等。应用发布也就成为了一项高风险,高压力的超过过程,以及应用的开发迭代的沟通,测试成本也大大的变得不
打开你的vsonline,选择buildandrelease标签,进行自动化编译的开发。一新建,选择对应的源代码管理,我们以VSTSGIT为例二选择你的项目所应对的开发框架,如net,netcore
CONTINUOUSINTEGRATION/CONTINUOUSDEPLOYMENT/CONTINUOUSDELIVERY(CICD)持续集成/持续部署/持续交付第三方工具使用JenKins基础配置g
简介gitlabci全称是gitlabcontinuousintegration的意思,也就是持续集成。中心思想是当每一次push到gitlab的时候,都会触发一次脚本执行,然后脚本的内容包括了测试,
引言看过dockercompose真香的园友可能留意到当时是【把部署dll文件拷贝到生产机器】,即时打包成镜像并启动容器,并没有完成CI/CD。经过长时间实操验证,终于完成基于GitlabCI/CD
目录1docker上安装gitlab11拉取镜像12启动gitlab服务13配置root账号密码2docker上安装gitlabrunnerdocker基本配置及命令不熟的,看我这篇https://b