微信小程序CI机器人云构建详解（二）之jenkins一键发布

背景

相信长期在做小程序的同学都有过以下经历：

1.只有固定的几台机器能发版，换台机器总担心出现点问题 （心力成本）

2.多个小程序发版，切换多个仓库，甚至要用开发者工具去打开不同的项目（体力成本）

3.频繁发版 + 发版流程琐碎 + 可能存在的多个小程序，一天的时间被机械劳动的事耗掉半天(时间成本)

本文主要来分享一下我这边的一套解决，实现一键发布，统一管理，在读之前最好先看下上一篇文章，不然可能会有些阻碍（https://www.jianshu.com/p/fb521576bd56）

关于jenkins：https://www.jenkins.io/zh/

一、大纲

整个pipeline计划做到的事情

1.拉取代码

2.询问当前需要变更的版本号

3.构建（gulp, webpack，npm）

4.更改后的版本文件提交到git仓库

二、创建software project

首先我们打开jekins,创建一个software project

image

然后创建一个任务， 这里选择流水线（有兴趣可以了解下其他项）， 点击确定

image

点击流水线找到编辑script的地方

image

这里可以选择在服务器上编写，还是从项目代码中读取jenkinsfile文件，我这里为了方便调试直接在jenkins机器上编写了

pipeline script

流水线语法官方教程： https://www.jenkins.io/zh/doc/book/pipeline/，里面讲的比较详细，可以先按下面的代码运行，遇到问题再查教程

三、流水线结构

写流水线之前，先想好我们整个发布流程需要做什么？

以当前例的话，大致分为5个环节:

1.拉取代码

2.询问需要更改的版本号

3.安装npm包

4.执行发布

5.提交修改的版本号信息到仓库

每一个环节都是一个stage，先把stage列好，接下来我们一个一个补充

  agent any

  stages {

        // 拉取git代码

        stage('git pull') {

            steps {

            }

        }

        // 询问当前版本信息

        stage('inquirer version') {

            steps {

            }

        }

        // 构建

        stage('build') {

            steps {

            }

        }

        // 推送版本信息到git仓库

        stage('push version2git') {

            steps {

            }

        }

  }

}

四、流水线语法

很多插件的语法使用还是比较复杂和琐碎的，这里提供了一个自动生成pipieline语法的功能

image.png

以git为例，会自动生成相应的语法，避免很多查文档的时间

image.png

示例步骤选择git,填写我们的Git仓库，这时会显示连接不上git。

五、拉取git仓库代码

根据上文所述，我们需要生成流水线脚本，但是想要让仓库和jenkins建立ssh链接，需要配置git仓库的公钥和jenkins的私钥凭据。
本次示例我用的是coding仓库。

1. 配置git仓库公钥

image.png

2. 配置jenkins私钥

除了在git上配置公钥外，还需要在jenkins上配置下凭据，点击添加

image.png

选择类型为ssh username，其他input的可以自己定一下的，这里需要一下，关于private项填的是私钥，需要复制id_rsa的内容，填写完成后点击添加，并在 Credentials 一栏选择填入私钥

image.png

image.png

当前页面没有显示红色提示 表示添加成功~

image.png

3.pipeline code

// 拉取git代码
stage('git pull') {
    steps {
        git branch: 'master', credentialsId: '1', url: '[email protected]:lucky_lucy/test/xxxxxxxxx.git'
    }
}

添加到指定位置后，点击保存，尝试构建一次查看是否成功，点左下角#5可以查看当前构建进程

image.png

点击console output可以查看当前log，workspaces可以查看当前工作空间

image.png

可以看到当前工作空间为仓库代码

image.png

六、询问当前版本信息

jenkins是不支持交互式命令的，所以需要换一种实现，查了下文档jenkins是有api支持的，方法名为 input，不过在进行调用之前需要获取之前的版本信息，即读取version.config.json这个文件，整体代码如下：

// 询问当前版本信息
stage('inquirer version') {
    steps {
        script { 
            // 读取版本信息
            def versionJson = readJSON file: './version.config.json', text: ''

            // 设置问题描述
            def userInput = input(
                id: 'versionInput',
                message: '请设置版本信息', 
                parameters: [
                    [defaultValue: versionJson.version, description: '设置版本号', name: 'VERSION', $class: 'TextParameterDefinition'],
                    [defaultValue: 'jenkins CI is upload trial version as: ' + new Date().format('yyyy-MM-dd HH:mm:ss'), description: '设置版本描述(please use english)', name: 'VERSIONDESC', $class: 'TextParameterDefinition']
                ])

            // 设置全局变量
            env.VERSION = userInput.VERSION;
            env.VERSIONDESC = userInput.VERSIONDESC;

            // 重写本地版本文件（为后续进行版本提交做准备）
            writeJSON file: './version.config.json', json: [version:  env.VERSION, versionDesc: env.VERSIONDESC], pretty: 4;
        }
    }
}

运行下, 会发现会提示等待，鼠标点击后弹出模态框，可以看到里面有从本地文件里提取出来的上个版本的信息，手动修改下即可
注意：readJSON和 writeJSON方法依赖 Pipeline Utility Steps(https://plugins.jenkins.io/pipeline-utility-steps) 这个插件，没有的话会出现入下图报错

image.png

然后去jenkins的插件管理 安装这个插件

image.png

然后重新构建，你填写版本信息后点击继续，就表示这步可以成功进行了

image.png

七、执行构建

这里实际都是构建流程，直接统一用一个“build stage” 即可， 这里步骤很简单，可以想一下从git clone下来一个项目应该干什么，这里实际就是在做这样一件事情

stage('build') {
    steps {
        sh "npm install"
        sh "npm run build"
    }
}

不过这里依赖node环境，需要先处理下，不然会报npm not found

image.png

1.安装nodejs环境

这里的运行环境和本机没有关系，类似于一个沙盒，所以如果要安装node环境需要安装Config File Provider Plugin和NodeJS Plugin这两个插件

2.配置全局工具

安装完成后添加全局工具，找到"系统管理 -> 全局工具配置 -> NodeJS" ，点击nodejs安装，默认项即可，点击保存，重启jenkins服务，回到服务器，输入命令 service jenkins restart

image.png

3.pipeline code

        // 构建
        stage('build') {
            steps {
                sh "npm install -g yarn"
                sh "yarn install"
                sh "yarn wxci:upload"
            }
        }

4.上传成功

这时候如果没问题的话代码应该已经发布到体验版了，
这里如果报ip错误记得去微信公众后台添加一下上传的ip白名单

image.png

image.png

八、提交新的版本号信息到仓库

1.pipeline code

基本就是将之前手动输入的命令写到脚本里

// 推送版本信息到git仓库
stage('push version2git') {
    steps {
        sh "git config --local user.name ${GIT_USER_NAME} && git config --local user.email ${GIT_USER_EMAIL}"
        sh "git add version.config.json"
        sh "git commit -m 'docs: 更改版本号为${VERSION}'"
        sh "git push origin ${BRANCH_NAME}"
    }
} 

关于上面代码中的"${}"，其实是预设的环境变量，我们可以把一些固定的东西提出来，避免硬编码，例如：

pipeline {
   agent any
   // 环境变量 
   environment {
       GIT_USER_NAME = 'jenkinsCI'
       GIT_USER_EMAIL = '[email protected]'
       GIT_ADDRESS = '[email protected]:jinxuanzheng01/blog-xcx-ci-demo.git'
       BRANCH_NAME = 'master'
   }
}

2.更改jenkins账号权限

直接进行push的话，git会报权限不足，这里倒不是因为ssh秘钥有问题，而是jenkins在执行的时候使用的不是linux机器的root权限，而是一个jenkins的账号

3.运行pipeline

重新构建，jenkins无报错，查看git仓库，执行成功

九、Running success

到此为止，整个pipeline已经work，你可以很轻松的尝试一键发布小程序。
尤其是有多个小程序项目的时候，可以单独建个分组，方便集中管理，再也不需要手动切入不同的仓库，甚至使用小程序开发者工具去打开各个小程序。