微信小程序集成内网应用架构设计 微信小程序持续集成

主要是通过小程序提供的miniprogram-ci，然后结合gitlab-ci，docker实现

解决测试，开发频繁找开发编译二维码导致开发效率低，测试到生产因人为导致配置错误等问题

1.需要了解miniprogram-ci

npm install miniprogram-ci --save
miniprogram-ci 目前提供以下能力：
1.上传代码，对应小程序开发者工具的上传
2.预览代码，对应小程序开发者工具的预览
3.构建 npm，对应小程序开发者工具的: 菜单-工具-构建npm
4.上传云开发云函数代码，对应小程序开发者工具的上传云函数能力
5.代理，配置 miniprogram-ci 的网络请求代理方式
6.支持获取最近上传版本的 sourceMap
7.支持 node 脚本调用方式和 命令行 调用方式

要使用这些功能需要在微信公众平台-开发-开发设置，获取代码上传秘钥，以及配置IP白名单，这里需要注意一下IP白名单暂时只能配置两个，建议配置测试和生产两个服务器IP

2.需要了解前端项目部署方式

可查看此篇：

3.编写miniprogram-ci脚本，通过node方式调用

这里是通过在gitlab-ci中执行  node  ci.js脚本方式调用，可传环境参数进来对应环境配置，测试环境会生成预览图片在项目目录下，然后DOCKERFILE文件中通过COPY命令将图片考到docker容器内形成静态资源。

// 小程序自动打包上传和预览脚本
const mpenv = {
    dev: `import configEnv from './config-dev.js'\n//import configEnv from './config-test.js'\n// import configEnv from './config-prod.js'\nconst config = configEnv\nexport default config`,
    test: `//import configEnv from './config-dev.js'\nimport configEnv from './config-test.js'\n// import configEnv from './config-prod.js'\nconst config = configEnv\nexport default config`,
    prod: `//import configEnv from './config-dev.js'\n//import configEnv from './config-test.js'\nimport configEnv from './config-prod.js'\nconst config = configEnv\nexport default config`
}
const dockerfile = {
    dev: `FROM nginx:alpine\n#COPY ./qrcode-test.jpg /var/www/html/\nCOPY ./mp.conf /etc/nginx/conf.d/\nRUN rm /etc/nginx/conf.d/default.conf\nEXPOSE 80\nCMD ["nginx","-g","daemon off;"]`,
    test: `FROM nginx:alpine\nCOPY ./qrcode-test.jpg /var/www/html/\nCOPY ./mp.conf /etc/nginx/conf.d/\nRUN rm /etc/nginx/conf.d/default.conf\nEXPOSE 80\nCMD ["nginx","-g","daemon off;"]`,
    prod: `FROM nginx:alpine\n#COPY ./qrcode-test.jpg /var/www/html/\nCOPY ./mp.conf /etc/nginx/conf.d/\nRUN rm /etc/nginx/conf.d/default.conf\nEXPOSE 80\nCMD ["nginx","-g","daemon off;"]`
}
const mpPreviewDesc = {
    dev: '开发环境二维码',
    test: '测试环境二维码',
    prod: '生产环境二维码'
}
const miniprogramRoot = './'
const ci = require('miniprogram-ci')
const projectConfig = require('./project.config.json')
const versionConfig = require('./version.js') 
const args = process.argv.splice(2)
if (args.length == 0) {
    throw new Error('node ci.js 缺少对应的环境参数！');
}
const fs = require("fs")
try {
    fs.writeFileSync('./config.js', mpenv[args[0]])
    fs.writeFileSync('./Dockerfile', dockerfile[args[0]])
} catch (error) {
    throw error;
}
// new ci实例
const project = new ci.Project({
    appid: projectConfig.appid,
    type: 'miniProgram',
    projectPath: miniprogramRoot,
    privateKeyPath: './ci-private.key',
    ignores: ['node_modules/**/*'],
});
 
/** 上传 */
async function upload({version, desc}) {
    await ci.upload({
        project,
        version,
        desc,
        setting: {
            es6: true,
            minify: true,
            autoPrefixWXSS: true
        }
      })
}
/** 预览 */
async function preview({desc}) {
    await ci.preview({
        project,
        desc,
        setting: {
            es6: true,
            minify: true,
            autoPrefixWXSS: true
        },
        qrcodeFormat: 'image',
        qrcodeOutputDest: './qrcode-test.jpg'
      })
}
if (args[0] == 'test') {
    preview({desc: mpPreviewDesc[args[0]]})
}
if (args[0] == 'prod') {
    upload({version: versionConfig.version, desc: versionConfig.desc})
}
4.可编写通知脚本，结合企业微信机器人等进行发版通知等
#!/bin/bash
messageurl="xxx"
version=`grep 'version:' ./version.js | sed -r 's/.*'\''(.+)'\''.*/\1/'`
desc=`grep 'desc:' ./version.js | sed -r 's/.*'\''(.+)'\''.*/\1/'`
contentStr=""
people=""
if [ "$1" == "success" ];then
    if [ "$2" == "dev" ];then
        contentStr="小程序开发环境二维码已更新，地址：http://47.115.170.133/mp/qrcode-test.jpg"
    elif [ "$2" == "test" ];then
        contentStr="小程序测试环境二维码已更新，地址：https://tcmvc.kwmzy.com/mp/qrcode-test.jpg"
    elif [ "$2" == "prod" ];then
        contentStr="小程序$version已上传到体验版，备注：$desc"
        people="@all"
    else
        contentStr="sh notify.sh缺少环境参数！"
    fi
 
elif [ "$1" == "fail" ];then
    contentStr="小程序CI失败，请前去查看原因！"
else
    contentStr="sh notify.sh缺少状态参数！"
fi
curl "$messageurl" \
    -H 'Content-Type: application/json' \
    -d '
    {
            "msgtype": "text",
            "text": {
                "content": "'"$contentStr"'",
                "mentioned_list":["'"$people"'"]
            }
    }'

5.设置gitlab日程表

因小程序二维码有时效限制，在gitlab项目的CICD的日程表中进行配置，

6.若因小程序CI导致内存不足，可采用定时调度进行清理

可在小程序项目的gitlab-ci配置中执行成功后执行docker rm $(docker ps -a | grep node | grep Exited | awk '{print $1}')命令进行指定清除，docker rm删除  括号中的docker ps进行筛选出容器ID  这里是筛选出 名称带node,然后状态已停止的容器，对应的清理镜像的 一样docker rmi $(docker images | grep test | awk '{print $3}')