使用GitHub Actions 自动化部署博客

发表于 更新于 分类于 阅读次数： 本文字数： 1.1k 阅读时长 ≈ 4 分钟

缘由

最近重新准备写博客的时候，发现hexo已经更新了，支持以包的形式引用主题，按照文档指引重新配置了主题。之前博客构建使用的是hexo官网的Travis Ci，配置直接复制过去改改就好了，这次更新主题看到仓库上大大的GitHub Actions,手痒痒，就想试一下用GitHub Actions 进行自动构建。

构建产物

GitHub Actions的快速上手文档异常的贴心，而且还是以npm构建为例子，前端基本可以很快上手~

GitHub Actions 的构建任务有四个层级

  • workflow： 工作流，整个运行过程
  • job： 任务，工作流可以包含一个或多个任务，每个任务都是独立的机器运行
  • step: 步骤。每一个任务可以执行一个或多个步骤，按顺序执行
  • action: 动作，每一个步骤可以运行一个或者多个命令

其中job是分别在不同机器上并发执行的，也可以通过needs参数和条件判断决定执行先后顺序，不过目前我们不需要多个机器并发执行。

上面其实是一些概念，实际写一个简单的构建配置是十分简单的。

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
name: Deploy
on:
  # 指定在main分支push时触发构建
  push:
    branches: [ main ]
  # 允许手动点击触发构建
  workflow_dispatch:

jobs:
  # 任务名称
  build-and-deploy:
    # 运行环境为最新稳定版本的
    # ubuntu
    runs-on: ubuntu-latest
    steps:
      # 拉取这次提交后的代码
      - uses: actions/checkout@v2
      # 安装并设置node版本为14，并启用缓存 
      - uses: actions/setup-node@v2
        with:
          node-version: '14'
          cache: 'npm'
      # 安装依赖并执行构建命令
      - name: Clean install dependencies and build
        run: |
          npm ci
          npm run build

其中use类似于npm包，可以使用其他人预先写好的构建指令及脚本，通过with传递参数。

对于自行编写的构建命令，直接使用run即可，如果有多条命令，需要使用| 进行换行。

发布到GitHub Pages

hexo自带发布到Github Pages插件，在本地机器发布时，直接执行hexo deploy即可，但是在GitHub Actions上，默认仅有当前仓库的权限，并且没有设置Git用户名称和邮箱，会得到以下错误

image-20220214212324285

这是因为我们在远程的执行虚拟机上执行Git命令，Git并没有相关配置，同时显而易见的，也没有为仓库提交的权限。

解决Git配置

Git配置很好解决,直接在发布前添加两行配置命令即可,这里使用GitHub Actions的上下文变量，访问触发构建的用户的用户名，并作为提交者。

1
2
3
4
5
- name: deploy to github
  run: |
    git config --global user.email "${{ github.actor }}@noreply.github-action.com"
    git config --global user.name "${{ github.actor }}.github-action"
    npm run deploy

添加具有写入权限的Token

作为一个很常用的功能，社区自然早早帮忙造好了轮子了，这里直接使用webfactory/ssh-agent@v0.5.4即可，然后在本地创建一对秘钥。

1
ssh-keygen

之后再把公钥上传到对应的目标发布仓库，这里需要注意构建写入权限，才能够进行提交操作。

image-20220214222645055

私钥需要上传到Gituhb Actions执行的仓库，操作类似，之后就可以顺利执行hexo deploy

image-20220214223118913

这里发布使用的是hexo自带的Git发布插件，整个发布流程实际也可以通过GitHub Actions实现，后面可以再改改。

发布到个人云服务器

为了方便国内访问，自己还有一个部署在国内的站点，希望在自动构建的时候，也直接发布到个人的云服务器上，搜索一下deploy关键字，直接就有相应的Actions了，这里直接用easingthemes/ssh-deploy@main，,填好参数，执行时通过rsync命令把文件同步到远程主机上。

image-20220214225137217

使用rsync的主要问题是GitHub Actions的主机在美国，远程同步的时间非常非常久，第一次同步耗时13m，以为是命令出了问题，强行结束了Actions任务，第二次同步依然执行了12m,直到第三次因为文件已同步了，执行时间才有显著的减慢。

最终配置

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
name: Deploy
on:
  push:
    branches: [ main ]
  workflow_dispatch:

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-node@v2
        with:
          node-version: '14'
          cache: 'npm'
      - name: Clean install dependencies and build
        run: |
          npm ci
          npm run build
      - uses: webfactory/ssh-agent@v0.5.4
        with:
          ssh-private-key: ${{ secrets.SSH_PRIVATE_KEY }}
      - name: deploy to github
        run: |
          git config --global user.email "${{ github.actor }}@noreply.github-action.com"
          git config --global user.name "${{ github.actor }}.github-action"
          npm run deploy
      - name: deploy to server
        uses: easingthemes/ssh-deploy@main
        with:
            SSH_PRIVATE_KEY: ${{ secrets.SERVER_SSH_KEY }}
            ARGS: "-rltgoDzvO --delete"
            SOURCE: "public/"
            REMOTE_PORT: ${{ secrets.REMOTE_PORT }}
            REMOTE_HOST: ${{ secrets.REMOTE_HOST }}
            REMOTE_USER: ${{ secrets.REMOTE_USER }}
            TARGET: ${{ secrets.REMOTE_TARGET }}

小结

这次使用GitHub Actions实际是自己第一次从零开始写构建流程，由于生态比较活跃，实际上各种想用的功能都有轮子，可以轻松实现自己的功能，比较大的缺点就是GitHub Actions是和GitHub强绑定的，并且提供的构建主机都在美国，连接速度比较慢，看文档也支持自托管的构建主机，有时间可以弄一个试试。