Jenkins+gradle+npm+gitee自动化部署前后端分离项目

866 阅读6分钟

项目背景

因公司网络和测试服务器带宽有限,每次打包jar包后上传到服务器速度很慢(100多兆的包差不多上传10分钟),所以决定弄一个自动化部署,每次代码提交(pull request)发起自动部署,经测试第一次打包比较慢(需要下载依赖),之后就很快了,基本上几十秒不到1分钟。

项目结构

  • 服务器端项目为springboot项目,gradle构建(一直用maven,也是这个项目才接触这个)
  • 后台前端项目为npm项目,里面具体是什么架构不知道
  • 微信小程序前端项目不需要部署服务器

安装jenkins

服务器为centos7,已有的java版本为1.8,不能动,查了下,找了个最新的能支持到1.8的版本。

wget https://mirrors.tuna.tsinghua.edu.cn/jenkins/redhat/jenkins-2.346-1.1.noarch.rpm #我能找到的最新的支持1.8版本jdk的包
rpm -ivh jenkins-2.346-1.1.noarch.rpm #安装
vim /usr/lib/systemd/system/jenkins.service
# 修改 User=root Group=root  ,其实这样是不安全的,测试环境可以,生产环境一定不要这样做。以下目录权限一样不建议,但是可以在测试或开发环境快速部署,绕过很多坑
chown -R root:root /var/log/jenkins
chown -R root:root /var/lib/jenkins
chown -R root:root /var/cache/jenkins
chown -R root:root /var/lib/jenkins
systemctl start jenkins.service  #启动服务,默认8080端口,可以在jenkins.service中修改

访问网页地址,这时候就能看到页面了。我当时忘了截取了,从别的地方拷贝了一张,主要是密码需要上服务器去查

image.png 安装系统推荐的所有插件,安装完成后有一个用户设置页面,建议设置一个用户,不要用超管用户登录。

jenkins基础配置和插件安装

  • 源代码托管在gitee,所以需要加一个gitee插件
  • 后端用gradle构建,所以需要安装gradle
  • 前端需要安装npm
  • 需要配置一些凭证用于拉取代码,还需要配置一个hook用于通知jenkins自动构建代码

安装和配置插件

安装插件

点击:系统管理->插件管理进入插件管理界面 我这个是已经安装的,选择“可选插件”然后搜索相应名称,就可以进入安装界面,等一会儿安装好jenkins自动重启,然后就可以用了

image.png 所有插件安装方式都是一样的,不再赘述。

配置插件

点击:系统管理->全局工具配置进入工具配置界面,gradle和npm配置如下,别名自己随便起,自己能记住就行,后面要用到,一定要记得点保存。这一步相当于在服务器上安装你需要的编译环境。

image.png

image.png

项目配置

完成以上工作后开始项目配置,点击新建任务,如下图所示:

image.png 首先我们新建一个文件夹,最后一个选项,然后输入一个名字,文件夹的好处是能把一个项目的多个子项目放到服务器的一个工作目录下,防止服务器上的源代码文件夹乱。

然后新建两个“构建一个自由风格的软件项目”,一个是后端代码,一个是前端代码。

关于源码拉取

我在网上查到很多源码拉取用的gitee插件,然而我用尽浑身解数也没成功,不纠结了,拿gitee当一个普通git服务器操作就可以了,提供两种成功的拉取源码方式:

方式一:直接使用用户名、密码

因为我公司的gitee企业版上有一个超管账号平时是不提交代码的,只做管理用,所以直接用这个账号就可以,配置如下: image.png 其中URL,使用https:// 方式,认证新建如下,直接输入用户名和密码即可,别的不用填 image.png

方式二:使用rsa秘钥

与服务器拉取账号密码一样,首先在服务器生成秘钥

ssh-keygen -t rsa  #如果以前生成过,直接跳过这一步
cat /root/.ssh/id_rsa  #这个是私钥,配置到jenkins上
cat /root/.ssh/id_rsa.pub #这个是公钥,配置到gitee仓库上

使用秘钥拉取代码,git仓库地址URL配置为git@xxxxx,ssh这种地址,而不是https:// 地址,一定要注意 image.png 配置访问秘钥选项,类型ssh username with private key username 字段无限制,自己起一个

image.png 选择直接填写秘钥,然后把上面服务器查到的私钥粘贴进去,要粘贴完整,首尾不要有空格 然后上gitee平台,进入项目代码管理页面,将服务器查到的公钥粘贴到项目的部署公钥中,如下图所示:

image.png 标题随便填,公钥粘贴完整,首尾不要有空格

两种方式都是可以的,对任何git服务器通用,都可以这样做。

构建触发配置

gitee的webhook可以实时通知jenkins开始构建项目,对任何项目都一样,配置如下:

image.png 标红位置为需要复制到gitee平台配置的接收通知的接口地址

image.png 首次配置的时候,需要点生成来生成一个密码

然后将上面两张图中的接口地址和密码复制到gitee对应项目的WebHook配置中,进入对应项目代码仓库,设置,选择新建webhook,如果是企业版会跳转到这样一个页面,个人版的应该也类似

image.png 填写url和密码,选择需要通知jenkins的事件,具体的设置根据自己项目自动化构建的触发条件设置即可。

后端项目配置

拉取代码和webhook配置不再赘述

image.png

如上图所示:

  • 选择gradle,在上文中全局工具配置中设置的名称;
  • 设置任务,就是在idea中执行的gradle命令名称,直接复制过来就行(设置完这一步就已经可以在服务器上生成可运行的jar包了)
  • 执行shell,这一步主要是在服务器上发布jar包,我给一个示例代码,大家可根据自己需要改
sudo /{jar包发布路径}/{服务命令脚本}.sh stop  # 停止正在运行的服务器端服务
sleep 2
sudo rm -rf {jar包发布路径}/{jar包名称}.jar  #删除旧的jar包
sleep 2
sudo mv /var/lib/jenkins/workspace/{jenkins项目工作路径}/build/libs/{生成的jar包名称}.jar   {jar包发布路径}/{jar包名称}.jar  #将生成的新jar包移动到项目发布路径
sleep 2
sudo /home/gxtvmall/server/mall.sh start  #启动服务器端服务器

前端项目配置

拉取代码和webhook配置不再赘述

image.png 首先选择 “Provide Node & npm bin/ folder to PATH NodeJS Installation” 然后选择nodejs版本,为上文中全局工具配置中配置的nodejs名称 image.png 然后构建部分一定选择执行shell,之前我这里弄错了,搞了好久,提供一个示例脚本,大家根据自己需要看着改

node -v        
npm -v     #没意义,就是看日志防止出问题
npm install   #项目路径下限安装依赖
npm run build  #  编译
sleep 2
sudo rm -rf {前端发布路径}/*  # 我用的nginx,这个路径是nginx的静态资源地址
sleep 2
mv /var/lib/jenkins/workspace/{jenkins项目工作路径}/{dist编译输出路径}/*  {前端发布路径}/  #将新编译输出的dist目录下文件移动到nginx的静态资源发布路径

打完手工!