jenkins构建微信小程序并展示二维码教程

2023-12-0411:46:05APP与小程序开发Comments823 views字数 3956阅读模式

分享一下利用Jenkins去构建微信小程序二维码，并在jenkins上展示最新的二维码图片方便扫描测试。

操作步骤简介

安装 Jenkins 插件，例如 Jenkins Plugin for WeChat Mini Program Builder（微信小程序构建器插件）。创建新的 Jenkins Pipeline，或者在现有的 Jenkins Pipeline 中启用 WeChat Mini Program Builder 插件。配置 Jenkins 构建步骤，添加微信小程序构建相关任务。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

测试您的微信小程序。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

以下是详细的步骤说明：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

1、安装 Jenkins 插件文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

单击 Manage Jenkins -> Manage Plugins -> Available.文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

搜索 WeChat Mini Program Builder 插件并安装。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

2、创建新的 Jenkins Pipeline文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

单击 New Item，选择 Pipeline。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

输入 Pipeline 名称和其他相关信息。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

选中 Enable Pipeline 功能框，勾选 Enable Scm Polling 并输入 Git URL。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

单击 OK 按钮完成Pipeline 设置。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

启用 WeChat Mini Program Builder 插件文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

单击 Configure System -> Global Tools Configuration.文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

添加微信小程序构建器插件，输入必要的信息（如 App ID, Secret Key）并保存。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

3、添加微信小程序构建器插件到 Jenkins Pipeline 中。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

配置 Jenkins 构建步骤文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

单击 New Item -> Build with Parameters.文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

添加微信小程序相关的步骤到 Jenkins Pipeline 中，例如微信小程序构建任务、打包任务等。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

单击 Save.文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

4、测试您的微信小程序文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

在 Jenkins 控制台上单击 Build Now 开始构建。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

查看 Console Output ，确认没有错误消息。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

在移动设备或微信开发者工具中测试您的小程序。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

5、请注意，由于微信小程序有一些限制，请务必遵守相关要求，例如大小、格式等。在微信小程序官方文档中有更多详细信息。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

示例

以下是一个 Jenkins Pipeline 的示例，用于构建微信小程序：

pipeline {    agent any    parameters {        string(name: 'APP_ID', defaultValue: '', description: 'Your Wechat Mini Program APP ID')        string(name: 'SECRET_KEY', defaultValue: '', description: 'Your Wechat Mini Program Secret Key')    }    stages {        stage('Checkout') {            steps {                checkout scm            }        }        stage('Build') {            steps {                echo 'Building your WeChat Mini Program...'                script {                    node {                        sh """                        npm install                        npm run build                        """                    }                }            }        }        stage('Deploy') {            steps {                script {                    node {                        def buildDir = '/var/tmp/build'                        dir(buildDir) {                            // 将构建目录移动到临时位置                            sh 'mv dist/* .'                            // 安装 WeChat Mini Program Builder 插件                            wechatmp init ${params.APP_ID} ${params.SECRET_KEY}                            // 构建微信小程序                            wechatmp build                        }                    }                }            }        }    }}

在上述 Pipeline 中，首先从 SCM 检出代码，然后构建小程序，并最终构建微信小程序。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

注意：您需要设置一些 Jenkins 参数，例如 APP_ID 和 SECRET_KEY。这些参数可以在微信开放平台找到。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

此外，在构建时，必须正确安装 WeChat Mini Program Builder 插件，并将其添加到 Jenkins 中。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

在构建过程中，可以添加额外的步骤，例如测试、发布等。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

展示微信小程序二维码

要在 Jenkins 上展示微信小程序的二维码，请按照以下步骤操作：使用 Jenkins 插件生成 QR Code，并将其作为 JUnit XML 结果的一部分发送到微信小程序中。使用 Jenkins 插件解析 JUnit XML 文件，并在微信小程序中显示 QR Code。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

以下是详细的步骤说明：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

生成 QR Code文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

安装 QR Code Generator 插件，参见官方文档。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

使用该插件生成 QR Code，并将其添加到 JUnit XML 文件中。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

解析 JUnit XML 文件文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

安装 Jenkins 的微信小程序插件，如 Jenkins Xcode Integration。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

添加一个 Jenkins 步骤，在构建完成后发送 JUnit XML 文件给微信小程序。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

在您的 Jenkins 实例中打开一个二维码，指向 JUnit XML 文件。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

在微信小程序中打开此二维码，使其解析 JUnit XML 文件。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

请注意，在显示 QR Code 之前，您需要先获取微信小程序的凭证。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

Java 代码示例，演示如何在 Jenkins 中生成 QR Code：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

import com.google.zxing.BarcodeFormat;import com.google.zxing.EncodeHintType;import com.google.zxing.WriterException;import com.google.zxing.client.j2se.MatrixToImageWriter;import com.google.zxing.common.BitMatrix;import com.google.zxing.qrcode.QRCodeWriter;import com.google.zxing.qrcode.decoder.ErrorCorrectionLevel;import javax.imageio.ImageIO;import java.awt.image.BufferedImage;import java.io.File;import java.io.IOException;import java.nio.file.Files;import java.nio.file.Path;import java.nio.file.Paths;import java.util.HashMap;import java.util.Map;public class QrCodeGenerator {    public static void main(String[] args) throws WriterException, IOException {        String content = "Hello, World!";        int width = 300; // 二维码宽度        int height = 300; // 二维码高度        QRCodeWriter qrCodeWriter = new QRCodeWriter();        Map hints = new HashMap<>();        hints.put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.L);        BitMatrix bitMatrix = qrCodeWriter.encode(content, BarcodeFormat.QR_CODE, width, height, hints);        Path file = Paths.get("/tmp/test.png");        MatrixToImageWriter.writeToFile(bitMatrix, "PNG", file.toFile());        System.out.println(file.toString());    }}

在上述代码中，我们将字符串转换为 QR Code，并将结果保存为 PNG 图片。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

在 Jenkins Pipeline 中，您可以使用 Jenkins Pipeline 变量来保存生成的 QR Code 文件路径，并将其作为构建结果的一部分发送给微信小程序。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

您可以参考 Jenkins 的微信小程序插件文档以了解更多详细信息。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

升级版-Python

from PIL import Imagefrom pyqrcode import create as qrcodedef generate_qrcode(image_path):    qr_code_data = 'Hello, World!'    qr_code_image = qrcode.create(qr_code_data)    qr_code_image.save(image_path)def build_wechat_app():    # 获取参数    APP_ID = input("Enter your APP_ID:")    SECRET_KEY = input("Enter your SECRET_KEY:")    # 清理目录    subprocess.call(['rm', '-rf', 'dist'])    # 构建小程序    subprocess.call(['npm', 'run', 'build'])    # 移动构建目录    subprocess.call(['mv', 'dist', '/var/tmp/build'])    # 初始化微信小程序    subprocess.call(['wechatmp', 'init', APP_ID, SECRET_KEY])    # 生成二维码    generate_qrcode('/tmp/qrcode.png')if __name__ == '__main__':    build_wechat_app()

在上面的示例中，我们调用 generate_qrcode() 函数，用于生成 QR Code。该函数接受一个图像路径作为参数，并将其保存为 PNG 格式。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

注意：为了更好地兼容不同的微信小程序插件，请参阅官方文档以了解如何正确处理图像尺寸和格式。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/57811.html

jenkins构建微信小程序并展示二维码教程

小程序备案详细操作流程

微信小程序备案怎么做？5步极简教程版

小程序开发是什么价格？贵不贵？

广东、湖北、内蒙古多地通管局：4月1日起未备案APP小程序将被下架

微信小程序简便注销方法及流程（无需对公打款免备案烦恼）

App备案流程、时间要求和常见问题

企业、商家和工作室抖音小程序备案流程步骤教程

商城小程序开发功能有哪些？

微信小程序制作教程：自开或外包

小程序开发多少钱？

Comment