微信小程序开发 Jenkins 合并代码提交体验版本

发表于 更新于

微信小程序开发 Jenkins 合并代码提交体验版本

1. 起因

最近公司项目在做小程序开发,有多个小伙伴一起开发,测试的小伙伴也要加入测试,为了做到敏捷开发,我这个懒人就在想有啥办法可以做到这点,最后发现微信的小程序工具提供命令行调用,查看其文档发现了新大陆,也就有了这篇文章;

2. 流程

  1. 开发人员开发后代码推到 git 仓库;
  2. 测试人员或开发触发 Jenkins 构建;
  3. 通过微信的工具上传微信小程序最新代码,并通过钉钉机器人通知打包成功;
  4. 测试就可以打开微信小程序的体验版开始体验最新的修改;

3. Jenkins 配置

1. 配置参数化构建, 主要是配置了 接口请求环境,和打包的 Git 分支

2. Git 配置

3. Build 执行 shell 脚本

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
echo ------------ 构建分支 --------------
echo $BRANCH 
echo ------------ 打包环境 --------------
echo $ENV

# 导入 node 环境
export PATH=$PATH:/usr/local/bin 

# 执行 接口请求环境的 替换操作
node env.js $ENV

# 上传最新修改到微信小程序
/Applications/wechatwebdevtools.app/Contents/MacOS/cli -u 1.0.0@$PWD --upload-desc 'Jenkins 小程序更新最新代码了,快去体验版查看'
# 上传成功后发送钉钉通知
node index.js $ENV $BRANCH

4. 微信开发工具配置

  1. 微信开发工具登录并打开设置里面安全的服务端口,还有就是微信版本管理把这个上传的微信版本选为体验版,这样下次再上传上去体验版就可以下载最新的上传修改了;

本人手上是有一台 Mac 电脑专门用来打包 App 的,所以只讲了 Mac 的,但道理是差不多一样的,可以自己折腾 Windows 的系统,要在这台打包电脑安装 Jenkins 还有 微信开发工具;(因为自己脚本写的太差了,所以有两个地方用到了 node 来实现,所以还安装了 node 环境);

钉钉设置机器人

之前我已经写了几个涉及钉钉机器人的配置,直接看之前的配置

配置完成后,获取里面的 token

5. 主要代码配置

1. 配置环境的文件 './config/index.js' 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 全局配置文件
let HOST = '', USERHOST = '';

let ENV = 'DEV'; // 设置环境 测试 DEV, 正式环境 PROD

if (ENV === 'PROD') {
  // 正式环境 host
  HOST = 'https://api.prod.com';
  USERHOST = 'https://user.prod.com';
} else {
  // 测试环境 host
  HOST = 'https://api.dev.com';
  USERHOST = 'https://user.dev.com';
}

module.exports = {
  ENV: ENV,
  HOST: HOST,
  USERHOST: USERHOST,
}

2. 替换接口环境的文件 './env.js'

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
const fs = require('fs');
const ENV = process.argv[2];
console.log(`/************* 替换环境为 ${ENV} 开始 *************/`);
// 环境文本
const prodTep = `
// 全局配置文件
let HOST = '', USERHOST = '';
let ENV = '${ENV}'; // 设置环境 测试 DEV, 正式环境 PROD
if (ENV === 'PROD') {
  // 正式环境 host
  HOST = 'https://api.prod.com';
  USERHOST = 'https://user.prod.com';
} else {
  // 测试环境 host
  HOST = 'https://api.dev.com';
  USERHOST = 'https://user.dev.com';
}
module.exports = {
  ENV: ENV,
  HOST: HOST,
  USERHOST: USERHOST,
}
`;
process.chdir(`./config`); // cd $1
console.log(`/************* 前往 config 文件夹,并替换写入文件 *************/`);
console.log(prodTep);
fs.writeFileSync('index.js', prodTep);
console.log(`/************* 替换环境为 ${ENV} 成功 *************/`);
process.exit(0);

3. 发送钉钉消息的文件 './index.js'

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
const ENV = process.argv[2];
const branch = process.argv[3];

const ddtoken = 'you-dingding-token'; // 钉钉机器人 token
const qrurl = 'you-qrcode-url';  // 微信体验版的 二维码地址

let tokens = [
  wscUrl,
];
const env = ENV === 'PROD' ? '正式环境' : '测试环境';
var exec = require('child_process').exec;
//  git 最近 5 条修改的 commit 信息
const str = `git log -5 --date=format:'%Y-%m-%d %H:%M:%S' --pretty=format:"* %cd - %s "`;
function runExec(cmdStr) {
  return new Promise((resolve, reject) => {
    exec(cmdStr, function (err, stdout, stderr) {
      if (err) {
        console.log('runExec error:' + stderr);
        reject();
      } else {
        // console.log(stdout);
        resolve(stdout);
      }
    });
  });
}
let gitlog = '';
runExec(str).then(res => {
  for (let i = 0; i < tokens.length; i++) {
    let token = tokens[i];
    gitlog = res;
    sendDing(token, gitlog)
  }
});
function sendDing(token, gitlog) {
  var https = require('https');
  var options = {
    hostname: "oapi.dingtalk.com", // 呼叫的域名
    port: 443,				// 端口固定
    path: `/robot/send?access_token=${token}`,				// 请求的api名称
    method: "POST",			// get和post请求
    json: true,				// 此地方表示json
    rejectUnauthorized: true,  //请校验服务器证书，否则ssl没有意义。
    headers: {
      'Accept': 'application/json;version=2.0',
      'Content-Type': 'application/json',             //此地方和json很有关联，需要注意
    }
  };
  var post_data = {
    "msgtype": "markdown",
    "markdown": {
      "title": "小程序新包更新",
      "text": `# 小程序新包发布 \n \n > 分支: ${branch} \n \n > 服务器环境: ${env} \n \n > 更新内容: \n \n ${gitlog}  \n \n > 微信扫码体验小程序: ![](${qrurl})`
    }
  };
  var json = JSON.stringify(post_data);
  var req = https.request(options, function (res) {
    res.setEncoding('utf8');
  });
  req.on('error', function (e) {
    console.log('problem with request: ' + e.message);
  });
  req.write(json);
  req.end();
}

6. 最终钉钉消息效果

地址

GitHub 仓库地址

个人博客

博客地址:
https://gblog.ferryvip.com/