实现代码审查、自动部署，不仅可以保证程序猿代码规范问题，还能省去很多上线部署的时间，这里我们需要达到的目的是：提交代码到线上仓库，当发起merge请求时，能审核代码规范并自动构建部署上线。
注：实现需要有一定编程基础，对git、linux操作系统、前端、后台有一定的基础底子

1、前言概述

先来理解下webhook是啥？首先需要将webhook分开，web+hook=》web+钩子，准确的说，这是一种web回调或者http的push API，是在应用时提供实时信息的一种方式，当数据产生或者某个事件发生时，webhook会向你的应用发起http请求，听起来有点类似于发布-订阅者模式，举个例子，合并github的代码webhook大体流程如下图：
这里写图片描述

2、前期环境准备

工作流程

即平时协作工作git提交的规范
这里写图片描述

服务器

1.线上仓库：gitHub、gitlab或者gitee
2.本地仓库：日常开发环境即可
3.服务器仓库：生产服务器；也可以用ngrok对本地服务器进行ip穿透，适合测试开发

语言：

node（服务器语言自选）、git、javascript、shell

工具：

mac系统、linux系统、chrome浏览器、item2、visual studio code、gitLab、ngrok、Jenkins

3、webhook配置

3.1 首先需要在gitlab上有一个属于自己的project，个人以ci-eslint项目做例子
这里写图片描述

3.2 有了项目之后，需要有一个能从gitlab访问的服务器即进行审核服务器的地址，简单的说就是能ping通的服务器
这里写图片描述
注：这里个人是使用node的express框架启动了一个本地服务器，并且使用ngrok进行ip穿透，将本地启动的服务器，代理到https://324d1852.ngrok.io 中，中间是md5乱码加密的域名

3.3 project的setting中有个webhook设置，在webhook中设置钩子服务器url，当前选中Merge Request events，即当代码发起merge时就会触发这个钩子，并发送post请求到/es5中
这里写图片描述

4、审核代码

审核流程
这里写图片描述
简单的说，node服务层那块需要包含三大模块，缺一不可，接下来我们来一个一个步骤的解析下：

4.1 获取gitlab中的private_token是为了能够有权限执行gitlab的API，也就是为了获取git merge的信息
这里写图片描述
注：最好要有一个公用的账户，不要使用个人的，不然哪一天个人的账户注销掉的时候，这个private_token又需要重新去修改

获取此次merge请求的数据，具体请求的url以及header如下：
1、根据webhook的post请求获取源id和目标target_project_id
2、传输headers为application/json

 let merge_url = gitlab_api
            + req.body.object_attributes.target_project_id + '/merge_request/'
            + req.body.object_attributes.id + '/changes?private_token=' + private_token
 let options = {
     hostname: 'git.haizhi.com',
     path: merge_url,
     method: 'GET',
     headers: {
         'Content-Type': 'application/json'
     }
 }

4.2 使用百度的eslint版本fecs对merge修改过的文件进行代码规范审核，个人实现是通过shell脚本实现的，具体shell编写如下：

# !/usr/bin/ bash
# $1 用户名
# $2 该用户分支在check机器上的目录
# $3 分支
# $4 项目git地址
# $5 diff文件
if [ ! -d eslint ]; then
    mkdir eslint
fi
cd eslint
if [ ! -d $1 ]; then
    mkdir $1
fi
cd $1
if [ ! -d $2 ]; then
    git clone -b $3 $4 > /dev/null
    cd $2
else
    cd $2
    git checkout $3 > /dev/null
    git pull > /dev/null
fi
../../.././node_modules/.bin/fecs $5

当然，这种规范是需要人工可配置的，而规范的配置可在https://github.com/ecomfe/spec/blob/master/javascript-style-guide.md中查询，人工配置.eslintrc.js以及整体文件目录如下：
这里写图片描述

4.3 在node层中执行了shell脚本后，exec(shell,(err, stdout, stderr)=>{}),返回的参数，其实err是一个对象，而stdout和stderr是字符串，stdout就是执行的子进程中使用标准输出的信息，而stderr就是子进程中错误输出流的内容。那么我们就可以通过这个进行判断或者异常捕获，进行想要操作的下一步。
修改merge的状态如图：
这里写图片描述
注：这是gitlab提供修改merge的API，根据这个当审核不通过的时候，我们可以直接关闭

增加提交说明打印：
这里写图片描述
注：这是gitlab提供增加comment的API，根据这个我们可以打印相应的日志

4.4 来看看效果，当我们发送一个不符合规范的merge请求时，会将merge请求关闭并且将错误日志打印在下面的comment中，实操如下：
这里写图片描述

当审核通过时，需要人工去查看merge的代码，如果说质量上、性能上都达到标准，ok，可以merge请求通过，通过后需要上线部署，个人暂时聊下前端使用Jenkins的自动部署，比较基础。
注：最好实施两人审核，相互监督，merge的时候最好加点备注，这样也可以保证审核的质量

5、Jenkins自动构建

jenkins是一个开源软件项目，是基于Java开发的一种持续集成工具，用于监控持续重复的工作，旨在提供一个开放易用的软件平台，使软件的持续集成变成可能。

5.1 因为是偏应用层面的使用，我们以最快方式上手，直接下载Jenkins的war包，这样可以直接使用，当然也要保证系统中有java。
这里写图片描述

5.2 启动使用java -jar jenkins.war，当然也要记住密码，或者记住存密码的位置，否则后面需要用到admin账户的时候，很狗血。jenkins默认是8080端口，接着本地打开localhost:8080，即可看到相对于的jenkins可视化界面，登录并安装对应的插件，创建一个个人账户
这里写图片描述