gitlab-ci实现前端自动化部署

 

期望的效果

    在git向远程仓库 提交代码/打tag 时，git仓库可以监听到这一次提交，并触发我们预先写好的脚本，从而实现自动化部署。

 

将要使用的工具

gitlab-ci

即 gitlab提供的持续集成的功能。

持续集成：是一种软件开发实践，即团队开发成员经常集成它们的工作，集成每天可能会发生若干次。每次集成都通过自动化的构建（包括编译，发布，自动化测试）来验证，从而尽早地发现集成错误。

 

gitlab-runner

    gitlab-runner即项目自动化的运行者（驱动），它可以执行一个 .gitlab-ci.yml（YAML文件）的文件，当push代码后，会执行写好的脚本，由脚本再执行进一步的操作，从而实现自动化。

 

.gitlab-ci.yml

具体的语法可以参考-官方文档。

    .gitlab-ci.yml 文件的格式大致如下：

 

配置流程

下载git并配置ssh key公钥

使用yum下载git：

yum -y install git 

配置ssh key公钥

    配置ssh公钥是为了在服务器自动获取gitlab上的代码时，可以免输入密码，用https的方式clone的话要手动输入账号密码，这样实现不了想要的自动化效果。

查看有无.ssh文件:

ls -al ~/.ssh

执行以下命令：

  cd ~/.ssh/    （如果没有对应的文件夹，则执行  mkdir  ./.ssh）
  git config --global user.name "san.zhang"
  git config --global user.email "[email protected]"
  ssh-keygen -t rsa -C "[email protected]"

三次回车之后，会在 root/.ssh 目录下生成 id_rsa  、 id_rsa.pub 两个文件

用 cat id_rsa.pub 指令查看该文件 并复制出文件中的ssh公钥，粘贴到gitlab的SSH Keys 中，添加此公钥，即可完成配置。

添加完成之后，我们直接在linux服务器上直接使用git clone  [SSH url] 指令，来测试刚刚配置的ssh公钥是否有效。

若出现类似错误：

    The authenticity of host 'gitlab.xxx.net (192.168.1.41)' can't be established.

解决方法：

1）使用ssh连接远程主机时加上“-o StrictHostKeyChecking=no”的选项，如下：

 ssh  -o StrictHostKeyChecking=no  192.168.xxx.xxx     // 这里写的是本机地址

2）一个彻底去掉这个提示的方法是，修改/etc/ssh/ssh_config文件（或$HOME/.ssh/config）中的配置，添加如下两行配置：

StrictHostKeyChecking no
UserKnownHostsFile /dev/null

安装node.js（当前最新8.12.0）和yarn

首先下载node.js我们要借助wget，它是Linux系统下载文件的工具，具有非常强的稳定性

yum -y install wget

使用wget安装node.js

// 下载
wget https://nodejs.org/dist/v8.12.0/node-v8.12.0-linux-x64.tar.gz

// 解压
tar -zxvf node-v8.12.0-linux-x64.tar.gz

// 全局配置：（设置软链接）

// 注意：这里的 /home/node/ 是node解压出来的文件所在的路径。

ln -s /home/node/node-v8.12.0-linux-x64/bin/npm /usr/local/bin/npm

ln -s /home/node/node-v8.12.0-linux-x64/bin/node /usr/local/bin/node

（若建立了软连接后发现npm和node指令都无法使用，可尝试先用sudo chmod -R 777修改node文件夹权限）

安装yarn ，其目的是 能快速稳定地安装项目依赖——node_modules

// 通过 RPM 包仓库安装 Yarn
curl --silent --location https://dl.yarnpkg.com/rpm/yarn.repo | sudo tee /etc/yum.repos.d/yarn.repo
sudo yum install yarn

// yarn -v 查看yarn版本

若通过 sudo yum install yarn 安装yarn报以下错：

    

    可以执行以下步骤来解决：

sudo yum install epel-release
sudo yum install nodejs
sudo yum install yarn

 

安装Gitlab Runner

-- 移除旧版本仓库：

sudo rm /etc/yum.repos.d/runner_gitlab-ci-multi-runner.repo

-- 添加 GitLab's 官方仓库:

curl -L https://packages.gitlab.com/install/repositories/runner/gitlab-runner/script.rpm.sh | sudo bash

-- 下载最新版 GitLab Runner：

sudo yum install gitlab-runner

-- 安装 GitLab Runner 的特定版本:

yum list gitlab-runner --showduplicates | sort -r sudo yum install gitlab-runner-10.0.0-1

   gitlab-runner运行的过程中，报错ERROR: preparation failed时，可能就是gitlab-runner版本有误，所以尽量下载最新的、或者合适版本的gitlab-runner

注册gitlab-runner

安装好了gitlab-runner，还要进行注册，执行以下操作：

// 注册 gitlab-runner
sudo gitlab-runner register

// 注册 gitlab-ci-multi-runner
sudo gitlab-ci-multi-runner register

之后会为注册输入一系列信息：

Enter your GitLab instance URL:（填写GitLab的url）
Please enter the gitlab-ci coordinator URL (e.g. http://gitlab.com )

// 注：URL和token可在gitlab项目的Setting->CI/CD->Runners Setting->Expand中查看
http://gitlab.example.com/

Enter the token you obtained to register the Runner:（填写GitLab的token信息）
Please enter the gitlab-ci token for this runner

WgdB8849hjQwFAxxxxxx

Enter a description for the Runner, you can change this later in GitLab's UI:（runner的描述）
Please enter the gitlab-ci description for this runner

my-runner

Enter the tags associated with the Runner, you can change this later in GitLab's UI:（runner的标签，用逗号分开）
Please enter the gitlab-ci tags for this runner (comma separated):

// 多个tag使用英文逗号隔开
runner-tag,runner-tag2,runner-tagx

Enter the Runner executor: （runner的执行者）
Please enter the executor: ssh, docker+machine, docker-ssh+machine, kubernetes, docker, parallels, virtualbox, docker-ssh, shell:

shell

（gitlab-runner的文件夹会在 ~/.local/bin 目录下）

注册完成后，将gitlab-runner文件夹的用户所属修改为gitlab-runner，这样gitlab-runner对其才会有执行权限。

sudo chown -R gitlab-runner:gitlab-runner /home/gitlab-runner

修改文件读写权限：

sudo chmod -R 777 /home/gitlab-runner

权限不够会导致runner在执行的时候报错 permission denied，即不能对文件进行读写、编辑的操作  

注意：gitlab上clone下来的文件在linux环境中可能也会没有读写权限，进而也会报错 permission denied ，此时就要先把clone下来的项目执行 sudo chmod -R 777 /home/project_name ，使项目中的文件都可读写；再进行一个无关的修改，提交到远端分支，这样以后clone或者fetch下来的项目都是可读写的了。 

注册好之后如果在gitlab-ci的界面上看到runner的旁边不是绿点，而是黑色三角的感叹号，可以使用 gitlab-runner start 或者 gitlab-runner run 的指令来开启runner的service

6.编写要执行的shell脚本

接下来我们写脚本文件，因为我们采用的是linux系统，所以用的是shell文件。

shell 脚本要做的事情可以分为这些步骤：

    1. 从gitlab上git clone/fetch 项目资源；

    2.进入项目中，执行 yarn / npm install ，安装项目依赖

    3.执行npm run build 打包项目

    4.将打包好的dist文件放到服务器指定发布目录下

如果在发布后想要执行回滚的操作，可以在第4个步骤执行完成后将文件名按git的tag号来重命名，并且每次都把这个文件再拷贝到一个单独的目录下存放；再建立软链接将项目链接到服务器的发布目录下。这样一来，每次提交的文件都会保存在一个地方，发布的版本就取决于软链接所指向的文件，要更改发布版本的话，只要手动修改一下软链接指向的重命名后的dist文件就可以了

    5.将之前clone下来的文件删除，避免文件越来越多占据过多内存，同时也方便下次clone

注意：脚本自动执行时，其用户是 gitlab-runner， 会遇到无权操作的问题，这时要把gitlab-runner加入root用户，并使gitlab-runner可以免密使用sudo命令，并在脚本的命令前加上sudo

其配置可参考以下博客：

https://blog.csdn.net/qq1147093833/article/details/81384111

7.提交 .gitlab-ci.yml 文件

    在gitlab的CI/CD->Pipelines->点击Get start with Pipelines，可看到配置文档。文档告诉我们，在push到gitlab的项目的根目录中添加 .gitlab-ci.yml 文件，就可以开启pipelines。在pipelines中就可以看到我们gitlab监听到事件后执行.gitlab-ci.yml文件的过程，以及执行状态等。

    我们参考 #官方文档 的格式，在 .gitlab-ci.yml 文件写入要执行的步骤。

    其中在写job要执行的scripts时，就可以执行我们刚刚写好的shell脚本。我们在项目的与.gitlab-ci.yml文件的同级目录下创建一个 /ci 目录，用来存放要执行的.sh文件，这样就可以通过相对路径引入脚本 ，如：

stages:
  - deploy

deploy_develop:
  stage: deploy
  script:
    - ci/deploy_develop.sh
  only:
    - develop

deploy_stage:
  stage: deploy
  script:
    - ci/deploy_stage.sh
  only:
    - master

    保存后push到远程分支。

    此时我们再进入 CI/CD->Pipelines 中，可以看到gitlab的界面已经发生了变化：

   如果执行顺利的话，status列就会显示 passed 。

   点进去检查一下脚本是否也按预期的执行了，如果是的话，通过gitlab-ci实现的前端自动化部署/发布就大功告成了！