Gitea+Jenkins+webhooks-多分支触发+备份构建前端资源

Gitea+Jenkins+webhooks-前端自动化部署

jenkins中文汉化文档
https://blog.csdn.net/qq_37489565/article/details/104337073

安装Locale插件=>设置语言为zh_US=>重启=>设置语言为zh_CN=>刷新页面就可以了

Jenkins的插件安装,在插件管理中安装Generic Webhook Trigger用于gitea构建触发器,Blue Ocean可以理解为Jenkins的一个皮肤(个人感觉界面看起来和操作使用很舒服)

image-20220620164823770

安装插件
image-20220620164946351

第二个插件

image-20220620170714008

第三个插件

image-20220620170949689

关于Jenkins准备工作,已经基本做完,下一步将使用gitea中的webhooks与Jenkins进行联系,达到代码自动部署的效果

首先,我们先点新建任务,进入到任务列表,接下来,我将分享两种构建的方式,分别是批处理命令构建和pipeline流水线语法的方式构建

image-20220620165232454

创建任务

image-20220620165251798

自由风格项目构建

在任务配置中输入gitea clone的地址,并且点击新建验证方式,我这里用的是用户名密码

image-20220620170120462

构建触发器
http://JENKINS_URL/generic-webhook-trigger/invoke

image-20220620171316030

TOken
vue_vite

image-20220620171528992

然后在仓库设置中添加web钩子,设置请求的地址,地址与Jenkins构建触发器中示例地址一致

image-20220621140437029

web钩子设置

image-20220621140522060

配置选择
image-20220621140732105

触发条件

我选择的是推送,即当前仓库收到推送信息就会通过webhooks通知Jenkins构建项目,最后测试一下是否能正常请求,请求成功后就会执行构建

image-20220621140900262

image-20220621140908321

我的完整成功推送
http://192.168.2.202:8080/jenkins/generic-webhook-trigger/invoke?token=dajiba

image-20220621142255035

配置构建

构建内容

#指此脚本使用/bin/sh 来执,说明如果没有声明,则脚本将在默认的shell中执行,默认的shell是由用户所在的系统定义为执行shell脚本
#!/bin/bash -l

#进入jenkins工作空间下项目目录中
cd /root/.jenkins/workspace/webhook-111111

#安装项目中的依赖
npm  install 

#打包
npm run build

image-20220621142835129

更新代码,测试更新

随便更新一些代码上去

image-20220621152848169

上传代码

image-20220621152932404

发现jenkins在自动更新

image-20220621152953133

构建pipeline流水线语法

创建任务

image-20220621171422443

构建触发器

image-20220621171528456

配置一个参数,如果以后还有项目,构建的时候可以灵活选择
single_project_name

/root/.jenkins/workspace/webhooks-rock

image-20220622112411431

对应定义的值

image-20220622112439532

发布到服务器语法

image-20220622134003831

然后就是构建流水线脚本,这里放出我配置的一段供大家参考。
pipeline { 
   agent any 
   stages { 
      stage('拉取代码') { 
          steps { 
              checkout([$class: 'GitSCM', branches: [[name: '*/master']], extensions: [], userRemoteConfigs: [[credentialsId: '7f49313d-880d-4a5e-836f-cef4bf2ec37a', url: 'http://192.168.2.204:3000/aike/test.git']]])
            } 
        }
      stage('选择node版本编译打包') { 
             steps { 
              nodejs('node') {
                sh '''cd ${single_project_name}
                      npm  install 
                      npm run build
                      tar -zcvf  ./front.end-levee.tar.gz   ./dist'''
              }
            } 
        } 
      stage('发布到服务器') { 
             steps { 
              sshPublisher(publishers: [sshPublisherDesc(configName: '192.168.2.204', transfers: [sshTransfer(cleanRemote: false, excludes: '', execCommand: '''
            cd /a
            tar -xzf front.end-levee.tar.gz -C ./
            cp -r dist/* ./ 
            rm -rf   front.end-levee.tar.gz''', execTimeout: 120000, flatten: false, makeEmptyDirs: false, noDefaultExcludes: false, patternSeparator: '[, ]+', remoteDirectory: '/a', remoteDirectorySDF: false, removePrefix: '', sourceFiles: 'front.end-levee.tar.gz')], usePromotionTimestamp: false, useWorkspaceInPromotion: false, verbose: false)])
            } 
        }             
   }
}

构建可以选择对应目录

image-20220622112757619

最终完整构建

image-20220622134401026

测试推送更新代码

image-20220622135049321

最终成功图

image-20220622135208902

备份+触发+pipeline,完整版

这里讲一下我遇到的问题,
gitea仓库配置token,测试访问测试一直失败,连接超时

解决方法:确认jenkins是内网环境,gitea是公网环境,jenkins是能拉到公网的代码,需要设置内网穿透,把jenkins映射成公网

解决gitea仓库webhook钩子测试不成功问题

遇到问题:测试访问token     测试一直失败,连接超时
解决方法-1:采用小蝴蝶内网穿透,把jenkins映射成公网,配置gitea仓库-web钩子测试还是连接超时,
访问token是可以访问到的,猜想可能是跟gitea仓库有关系

解决方法-2:采用gitlab配置web钩子,去测试访问jenkins-token是可以正常访问的,把gitlab内网穿透
映射成公网,模拟gitea仓库进项配置访问测试,也是可以访问到Jenkins的

解决方法-3:配置公网gitee仓库  web钩子,去测试访问jenkins-token是可以正常访问的,
模拟gitea仓库进项配置访问测试,也是可以访问到Jenkins的

解决方法-4:把自己搭建的gitea仓库做个内网穿透,模拟公司gitea仓库放在公网,然后内网jenkins去拉取代码,
再把jenkins做个内网穿透,模拟gitea--web钩子测试token是否可以发送成功,测试是正常的

最终解决问题
把jenkins用花生壳做内网穿透,隐射成https去访问,配置公司gitea仓库的web钩子,再次测试token,
配置成映射的公网域名,访问不到,打开花生壳访问ip设置,把刚才的访问ip设置白名单,访问正常问题解决
jenkins-pipeline完成截图配置
这个方法是把jenkinsfile放到代码仓库里面,jenkins回去识别代码里面的jenkinsfile文件,然后按照内容去执行

image-20220629145016384

jenkinsfile文件存放在代码仓库位置

image-20220629145150243

jenkinsfile文件样本
pipeline { 
   agent any 
      triggers {
    GenericTrigger (
            // 构建时的标题
            causeString: 'Triggered by $ref',
            // 获取POST参数中的变量,key指的是变量名,通过$ref来访问对应的值,value指的是JSON匹配值(参考Jmeter的JSON提取器)
            // ref指的是推送的分支,格式如:refs/heads/master
            genericVariables: [[key: 'ref', value: '$.ref']],
            // 打印获取的变量的key-value,此处会打印如:ref=refs/heads/master
            printContributedVariables: true,
            // 打印POST传递的参数
            printPostContent: true,
            // regexpFilterExpression与regexpFilterExpression成对使用
            // 当两者相等时,会触发对应分支的构建
            regexpFilterExpression: '^refs/heads/(test1|release-test)$',
            regexpFilterText: '$ref',
            // 与webhook中配置的token参数值一致
            token: 'webhooks-river'
    )
}
   stages { 
    	stage("测试部署") {
            when {
                branch 'release-test'
            }
    	    steps {
                echo 'release-test branch'
    	    }
    	}
    	stage("生产部署") {
            when {
                branch 'test1'
            }
    	    steps {
                echo 'test1 branch'
    	    }
    	}
        stage('选择node版本编译打包') { 
             steps { 
              nodejs('node') {
                sh '''cd ${single_project_name}
                      npm  install 
                      npm run build
                      tar -zcvf  ./front.end-river.tar.gz   ./dist'''
              }
            } 
        } 
        stage('发布到服务器') { 
             steps { 
              sshPublisher(publishers: [sshPublisherDesc(configName: 'xxxxxxxxxx', transfers: [sshTransfer(cleanRemote: false, excludes: '', execCommand: 
            '''source /etc/profile
            bash /back/river/back.sh
            find /data/cnhuafas/html/bim  -type f -not -name \'*.gz\' -delete            
            cd /data/cnhuafas/html/bim
            tar -xzf front.end-river.tar.gz -C ./
            cp -r dist/* ./ 
            rm -rf   front.end-river.tar.gz''', execTimeout: 120000, flatten: false, makeEmptyDirs: false, noDefaultExcludes: false, patternSeparator: '[, ]+', remoteDirectory: '/a', remoteDirectorySDF: false, removePrefix: '', sourceFiles: 'front.end-river.tar.gz')], usePromotionTimestamp: false, useWorkspaceInPromotion: false, verbose: false)])
            } 
        }             
   }
}
gitea钩子设置

image-20220629145408188

测试通过

image-20220629145437144

jenkins做的内穿穿透

花生壳

image-20220629145554314

jenkins构建的备份shell脚本

备份前端静态资源脚本,自己看着修改

#!/bin/sh

dateTime=`date +%Y-%m-%d`
days=7
bakuser=user1
bakdir=/data/backupdata                 #备份文件在本地主机的路径
bakdata=${bakuser}_${dateTime}.tar.gz   #备份产生的文件名称,以当前时间命名
baklog=${bakuser}_${dateTime}.log       #备份产生的日志

baksrcdir=/db/mysql/data                #本地需要备份的文件

remotePath=/backupdata/dbdata           #远程备份机备份路径
remoteIP="192.168.56.66"

cd ${bakdir}
mkdir -p ${bakuser}
cd ${bakuser}

#备份开始,首先向备份日志文件写开始时间
echo "backup start at ${dateTime}" > ${baklog}  
echo "---------------------------" >> ${baklog}

#对指定的目录以及产生的日志文件进行备份
tar -zcvf ${bakdata} ${baksrcdir} >> ${baklog}

#删除备份过程中产生的日志文件
find ${bakdir}/${bakuser} -type f -name "*.log" -exec rm -rf {} \;

#删除7天前的备份
find ${bakdir}/${bakuser} -type f -name "*.tar.gz" -mtime +$days -exec rm -rf {} \;

#通过rsync传输本地备份到远程主机
rsync -avzPL ${bakdir}/${bakuser}/${bakdata} ${remoteIP}:${remotePath}
测试成功截图

image-20220629145749763

第二种直接写pipeline方式

完整版截图
image-20220629150115592

jenkins-pipeline语法
pipeline { 
   agent any 
   stages { 
      stage('拉取代码') { 
          steps { 
              checkout([$class: 'GitSCM', branches: [[name: '${branch}']], extensions: [], userRemoteConfigs: [[credentialsId: '100b584e-7f67-466f-8b93-9b9038e117a0', url: 'xxxxxx']]])
            } 
        }
      stage('选择node版本编译打包') { 
             steps { 
              nodejs('nodejs') {
                sh '''cd ${single_project_name}
                      cnpm  install 
                      npm run build
                      tar -zcvf  ./front.end-rock.tar.gz   ./dist'''
              }
            } 
        } 
      stage('发布到服务器') { 
             steps { 
            sshPublisher(publishers: [sshPublisherDesc(configName: 'xxxxxxx', transfers: [sshTransfer(cleanRemote: false, excludes: '', execCommand: '''source /etc/profile
            bash /back.sh
            find /data/cnhuafas/html/zeus  -type f -not -name \'*.gz\' -delete
            cd /data/cnhuafas/html/zeus
            tar -xzf front.end-rock.tar.gz -C ./
            cp -r dist/* ./ 
            rm -rf   front.end-rock.tar.gz
            ''', execTimeout: 120000, flatten: false, makeEmptyDirs: false, noDefaultExcludes: false, patternSeparator: '[, ]+', remoteDirectory: '/data/cnhuafas/html/zeus', remoteDirectorySDF: false, removePrefix: '', sourceFiles: 'front.end-rock.tar.gz')], usePromotionTimestamp: false, useWorkspaceInPromotion: false, verbose: false)])
            } 
        }             
   }
}

ck.tar.gz
‘’', execTimeout: 120000, flatten: false, makeEmptyDirs: false, noDefaultExcludes: false, patternSeparator: ‘[, ]+’, remoteDirectory: ‘/data/cnhuafas/html/zeus’, remoteDirectorySDF: false, removePrefix: ‘’, sourceFiles: ‘front.end-rock.tar.gz’)], usePromotionTimestamp: false, useWorkspaceInPromotion: false, verbose: false)])
}
}
}
}


脚本其他的都跟上面一样的,谢谢查阅此文章,此文章填坑很多,动动你发财小手关注一下吧
  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值