用Github Action自动发布小程序

用Github Action自动发布小程序
Photo by Yancy Min / Unsplash

因为最近做了一个小程序,为了便捷的发版,就去研究了一下关于小程序的 CI。和几年前不同的是,由于官方提供了小程序的 CLI ,使得利用 Github Action 的自动发版变成了可能。

处理起来不算困难,先在小程序的后台获取自己的 Key,在 "开发" - "开发管理" - "开发设置" - "小程序代码上传" 中可以生成,主要用于 CLI 认证。另外记得关闭「IP 白名单」功能。

还需要在 Github 生成一个自己的 Personal Token,用于读写 repos 的状态,可以在 Github Docs 中学习如何生成。利用这个 Token,可以将小程序的预览二维码的 Base 64 代码追加到 commit 下。将这两个 Key 粘贴到 Github Reop 的 Secrets and variables 里,例如 PRIVATE_KEYPERSONAL_KEY

准备工作完毕之后,就可以使用 @crazyurus/miniprogram-action 来进行持续集成。需要注意的是,这个项目里的示例中由于缺少 Token,会运行失败。


03-21 Update: 这个Token主要是用来给Action权限去读写repo的,不然在执行Action时会报 Resource not accessible by integration 的error。又查了一些资料,有更简单的实现方式,不用去生成Token。在repo的 Settings -> Actions -> General -> Workflow Permissions 里修改默认权限为 -> Read and write permissions 即可。


我主要用了两个 Action,一个用来在 PR 中自动发布开发版的预览二维码,另外一个是用来将打了 tag 标签的版本自动上传到小程序后台。最后我也会把 PR 的 Action 贴出来。

Preview action

name: 提交 Commit 预览小程序
on:
  push:
    branches:
      - master
jobs:
  preview:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - id: preview
        name: Compile
        uses: crazyurus/[email protected]
        with:
          action_type: preview
        env:
          PRIVATE_KEY: ${{ secrets.PRIVATE_KEY }}
      - name: QR Code
        uses: peter-evans/commit-comment@v2
        with:
          token: ${{ secrets.PERSONAL_KEY }}
          body: |
            Copy the following content to the address bar of the browser to open the preview QR code

            ```
            ${{ steps.preview.outputs.preview_qrcode }}
            ```
            

Upload aciton

name: 上传小程序
on:
  push:
    tags:
      - "*.*.*"
jobs:
  upload:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - name: Upload
        uses: crazyurus/[email protected]
        with:
          action_type: upload
          version: ${{ github.ref_name }}
        env:
          PRIVATE_KEY: ${{ secrets.PRIVATE_KEY }}

PR action

PR 的我也贴一下,和 preview 几乎一样,只不过是换了一个 aciton,以便于在 pr 下留言。

name: PR 预览小程序
on:
  pull_request:
    branches: master
    types: [opened, synchronize, reopened]
jobs:
  preview:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - id: preview
        name: Compile
        uses: crazyurus/[email protected]
        with:
          action_type: preview
        env:
          PRIVATE_KEY: ${{ secrets.PRIVATE_KEY }}
      - name: QR Code
        uses: dannyskoog/pull-request-comment@v1
        with:
          token: ${{ secrets.PERSONAL_KEY }}
          message: |
            Copy the following content to the address bar of the browser to open the preview QR code

            ```
            ${{ steps.preview.outputs.preview_qrcode }}
            ```