Jenkins Gitlab 前端构建发布

流程:通常是从gitlab/github拉取项目,构建,把产出文件发到服务器。

一、环境

  • jenkins环境
  • Git 插件,用于拉取代码库中的代码
  • Publish Over SSH插件,用于SSH连接远程的服务器
  • NodeJS环境

创建任务之前,要先配置两项:

  • 拉取gitlab的凭据SSH (安装git/gitlab相关插件后,/credentials/store/system/下配置)
  • 发布服务器的凭据SSH (安装overSSH插件后,在 /configure下的SSH Servers配置)

问题1:jenkins credentials配置SSH

系统管理 -> Manage Credentials -> 全局凭据 (unrestricted) ->添加或者编辑


image.png

注意:这里的key是个大坑,最开始我纠结是填私钥还是公钥,发现粘贴进去都不对。(粘贴私钥时我粘贴的是正文,没有复制首尾两行,导致一直报错。)最后把私钥整个粘贴进去就对了。

问题2:GitLab Webhook插件测试触发Jenkins自动构建报错 Hook executed successfully but returned HTTP 403

原因:

由于Jenkins的安全策略配置了CSRF跨站点保护。

解决方案:

进入Jenkins,系统管理-->全局安全配置,勾选匿名用户具有可读权限和去掉CSRF防止跨站点请求伪造:


image.png

image.png

问题3:创建任务前,添加 Publish over SSH全局配置

在 /configure 下

image.png

注意设置了默认路径Remote Directory

问题4:创建任务页,Send build artifacts over SSH

这个插件是jenkins连接linux系统的时候使用。
以下针对插件的每个属性进行说明。

Name
SSH Server的Name属性就是你希望连接的服务器。

Source files
这里输入的是你希望传到服务器的文件夹和文件。路劲是相对jenkins的workspace的项目名称的。例如编译打包后的路径为dist文件夹下的jenkinszip.tar.gz,则Surce files填入dist/jenkinszip.tar.gz。

Remove prefix
如果Source files为dist/jenkinszip.tar.gz,但是不想把dist目录创建到服务器端,这个时候就可以在Remove prefix里填入dist

Remote directory
这里指定文件将被拷贝到服务器的路径。
PS:被拷贝文件在服务器上的完整路径=登录服务器账号的默认路径(就是全局设置的Remote Directory)+当前任务配置的Remote directory。
例如我的服务器路径是 /home/wwwroot/aaa
我全局配置Remote Directory 是 /home/wwwroot
当前任务配置的Remote Directory 是 /aaa/

Exec command
这里就是连接服务器之后需要执行的命令。

具体项目示例

image.png

image.png

image.png

注意:这里配置的Secret token和 webhook要填写到gitlab里面,路径如下:


image.png

image.png

构建shell脚本
echo -n "当前路径:"
pwd
echo "环境变量: ${PATH}"
echo -n "node版本:"
node -v
echo -n "npm版本:"
npm -v

echo "${BUILD_ID}"
 
git checkout develop
git pull
if [[ ! -d "node_modules" ]]; then
 echo "文件夹不存在"
 npm i
else
 echo "文件夹存在"
fi

echo "删除上一次构建..."
rm -rf ./dist/*
echo "开始编译..."
npm run build-test
echo "编译完成."
cd dist
rm -rf jenkinszip.tar.gz #删除上次打包生成的压缩文件
tar -zcvf jenkinszip.tar.gz * #把生成的项目打包成test方便传输到远程服务器
image.png

参考文章:https://blog.csdn.net/hou_ge/article/details/103507947

推荐阅读更多精彩内容