Jenkins 前端自动发布 [git 钩子]

摘要

Jenkins是一个插件平台,可以集成很多环境。很多时候我们是给前端人员配置的FTP提交代码,但是由于更新不方便。发布新的代码ftp会被清空,为节省前端开发时间,所以我们就需要Jenkins 配合git钩子使用

Jenkins 静态资源自动发布 [git 钩子]

Jenkins


一、Jenkins介绍及安装

安装和介绍都是老生常谈的内容了,说了N+1+2+3+4+5+.....的话题了,这里直接跳过了

Jenkins yum安装https://www.abcdocker.com/abcdocker/3174
Jenkins War安装https://www.abcdocker.com/abcdocker/2897

以前写过Jenkins 钩子的文章,很多就不具体说明了,可以查阅

持续集成+自动化部署[代码流水线管理及Jenkins和gitlab集成]
持续集成之Jenkins+Gitlab实现持续集成 [二]
Jenkins 自动化部署上线

二、Jenkins插件

1.Gitlab Hook #gitlab钩子,push代码后自动触发拉取操作
2.Publish Over SSH # scp拷贝插件 (主要是将包拷贝到web服务器上)
3.Build Authorization # 钩子触发器
需要提前安装好gitlab [Jenkins安装] [Git安装]

Gitlab插件安装 gitlab
image_1cr9ue0821ot2vh77b213mg12v39.png-186.3kB

SSH 插件安装 Publish Over SSH
image_1cr9vflp23apot41b131qn018g8m.png-81.3kB

Build Authorization
image_1cselgqj01jsvdn61cvj1ks3b1p9.png-105.5kB

三、配置Jenkins

我们需要新建一个node项目
image_1crp2sp5462i2ikrm814pk1n9v9.png-89.3kB

image_1crp31f22plcsci1l7qh8nun7m.png-190.4kB

设置部分一
123.png-326.1kB

源码管理配置部分二

333.png-286.4kB

image_1crp5144iqpe1lb116cn1ig43vp2t.png-110.6kB

44.png-199.2kB

构建触发器配置部分三

  1. #生成令牌
  2. [root@www.abcdocker.com]# openssl rand -hex 10
  3. 5c7e3ab062f63aaace06

下面的Build when a change is pushed to GitLab. GitLab webhook UR是我们把钩子插件安装上就有的我需要开启就可以了。 别忘记点保存,这里Jenkins目前就先结束了
image_1crp5cokrfrloqh1p2210gr1jmj54.png-178.5kB

接下来就是gitlab的配置,SSH插件是最后我们才用上,最后用来拷贝文件所使用~

三、配置Gitlab

1.登陆到gitlab项目中,点击Settings
image_1crp62oaj8fqs8v7lb3kp91e61.png-295.2kB
image_1cra1fl6l7rcuv12k51sba90l1g.png-160.3kB
image_1cra1ljca1sss1f3ra2c14nh5541t.png-198.2kB

钩子配置

  1. ##Jenkins地址填写
  2. 例子
  3. http://192.168.10.100:81/buildByToken/build?job=short-video-operation-release&token=ddecf363ce1c55a56d72a55d
  4. http://Jenkins地址(ip+端口)/buildByToken/build?job=JenKins项目名称&token=Jenkins配置的令牌

我的地址如下,然后我们在gitlab上点击Add Web Hook

  1. http://10.4.82.118/buildByToken/build?job=abcdocker-node&token=5c7e3ab062f63aaace06

image_1crp6k0bl1qvcs411nilav7h3d6e.png-157.4kB

44444.png-343.6kB

添加完成后,我们点击Test Hook进行测试
image_1crp70ssas9b1agg1m3f1jn81md880.png-250.3kB

四、SSH 插件配置

修改系统设置,配置ssh插件
image_1cse41sp81c4v1pa0u45phon9n9.png-166.3kB
image_1cse45pnu1bec190p124e1bh9c9fm.png-59.4kB

有两种认证方式
第一种:用户名密码认证
第二种:ssh免密认证 (只需将私钥放在目录下)

  1. [root@yzsjhl82-116 ~]# ssh-keygen
  2. [root@yzsjhl82-116 ~]# ssh-keygen
  3. Generating public/private rsa key pair.
  4. Enter file in which to save the key (/root/.ssh/id_rsa):
  5. Created directory '/root/.ssh'.
  6. Enter passphrase (empty for no passphrase):
  7. Enter same passphrase again:
  8. Your identification has been saved in /root/.ssh/id_rsa.
  9. Your public key has been saved in /root/.ssh/id_rsa.pub.
  10. The key fingerprint is:
  11. ce:df:f7:d8:f3:be:e9:5c:e5:18:bf:b7:cd:c2:44:a5 root@yzsjhl82-116.opi.com
  12. The key's randomart image is:
  13. +--[ RSA 2048]----+
  14. | |
  15. | .|
  16. | o |
  17. | E |
  18. | S .. .|
  19. | o .=.|
  20. | o o. +|
  21. | . . ==*|
  22. | . ..o@&|
  23. +-----------------+

我这里使用用户名密码进行操作
image_1cse5umgj1mtsj0uqu612041reb9.png-103kB

我们要测试用户密码是否正确,然后别忘记点最下边的保存
image_1cse5vhet1ko31jnf1h9cg24qrmm.png-59.9kB

返回配置Jenkins

image_1cse611kp1l5mq6b1gtvsn5u5e13.png-124.5kB

我这里使用Node Js项目作为演示
工程目录如下
image_1csemtv9tjj31v3e1pq11bue7h31g.png-187.4kB
Jenkins Shell配置如下

  1. #!/bin/bash
  2. echo "##################################"
  3. Dist=dist_`date +%F`
  4. cd $WORKSPACE
  5. if [ -d $Dist ];then
  6. rm -rf $Dist
  7. fi
  8. if [ -f $Dist.tar.gz ];then
  9. rm -rf $Dist.tar.gz
  10. fi
  11. echo "############################### NPM Install #############################"
  12. cnpm install
  13. npm run build
  14. mv dist $Dist
  15. tar zcvf $Dist.tar.gz $Dist
  16. if [ -f $Dist.tar.gz ];then
  17. echo "##################### Tar Is OK ###################"
  18. else
  19. echo "#################### Tar Is Error"
  20. fi

image_1csemnj3admv1kfp1943js9ka13.png-110.9kB

接下来是拷贝程序的步骤,找到增加构建后操作
image_1cse62ch312q2fd11rfb1l2r1a7r1g.png-83kB

Name        :这里是自定义的ssh远程服务器,如果有多台,点击add post-build step 继续添加
Source files    :源文件地址,相对地址 比如 /root/.jenkins/workspace/jobname/target/xx.war  直接写成 target/xx.war就行
Remove prefix   :这里指的是忽略前面的 target/   远程服务器直接显示就是xx.war
Remote directory    :远程服务器要保存的文件目录
Exec command    :这里直接写 bash 脚本名称 xx.sh    这里也是远程服务器的脚本

我的工程目录的Node Js,ssh 配置如下
image_1csemkq7f46rlrq1toemk21cujm.png-95.8kB

我们可以查

五、gitlab钩子测试

gitlab配置Jenkins钩子是需要有人push代码,现在我们push代码进行测试
555.png-187.5kB

  1. #先构建第一遍,以便生成目录
  2. [root@www.abcdocker.com]# git clone http://gitlab.fenqi.d.xiaonei.com/frontend/short-video-operation.git
  3. #git push提交文件进行测试
  4. echo "1234" >1.txt
  5. git add 1.txt
  6. git commit -m "text"
  7. git push origin master

image_1csen32pv1ksqntn1aq676nnc01t.png-112.2kB


新闻联播老司机