使用 Github Actions 自动部署 Hugo

随时随地上传或修改博文

回应痛点：

写作所用的设备不带环境，没有 Git，必须换回原来用的设备 hugo 生成网页并部署
只想好好写东西，不想再管我的终端/命令行
随时随地上传或修改博文

本文假设你已经在本地拥有一个用 Hugo 搭建的完整站点，且已经 push 到了 username/username.github.io 这个仓库。

1. 把源仓库传到一个新库

整体上传到一个新库后，我们可以使用 Git 方便地进行管理，相当于把原本在本地的博客系统传到网盘。在设置好 Github Actions 后，既可以整个库 clone 下来，也可以通过上传单个.md 文件到 content/posts 文件夹的手动 push 方式来自动部署，而这都不需要重新搭建 Hugo 环境。

在这里我们使用 Github Desktop：

点击菜单栏 File，选择 Create a new repository。
为了避免文件夹识别的混乱，在设置 local path 时，可以新建一个文件夹，之后再将博客系统文件（config.toml 所在的整个文件夹和子文件夹）复制进来。
复制后，回到 Github Desktop，填写 Summary， Commit to main，然后 Push。

2. 将新库和 Github Pages 仓库串起来

在 username/username.github.io 下是 public 文件夹内生成的静态网页（你一定记得的，在本地我们需要 cd public），而我们希望通过添加或修改源仓库的.md 来实现这一系列的生成和部署，这涉及到跨仓库的联动，需要通过 token 实现。

网页版，点击头像，进入 Github 个人的 Settings：

边栏最下方 Developer Settings，
- 选择 Personal access tokens 下的 Tokens (classic)
  - 点击右方 Generate a new token (classic)
输入密码后进入设置，在 Note 框中填写方便识别的名字，如 Deploy，有效期（Expiration）建议选择永不过期（No expiration），访问范围（Scopes）我们需要选中 repo和 workflow
点击生成后 token 即出现，注意它只会出现这唯一的一次，将其复制保存下来

得到 token 后，进入源仓库的 Settings：

选择 Secrets and variables 下的 Actions，在右侧选择 New repository secret
在 Name 中填入 PERSONAL_TOKEN
在 Secret 中填入刚才生成的 token，点击 Add secret 保存

3. 设置好 Github Actions

接下来我们进入源仓库的 Actions，若之前有使用过，点击左侧 New workflow；若无，默认会给出许多推荐，我们任选一个开始 configure 即可：

重命名.yml 为方便识别的名字，如 deploy.yml
修改编辑框内容如下：

name: deploy 
# 这个 action 的名字

on:
    push: 
    # 代表每次 push 都会 turn on action
    workflow_dispatch: 
    # 代表我们也可以手动 turn on

jobs:
    build:
        runs-on: ubuntu-latest
        steps:
            - name: checkout
              uses: actions/checkout@v2
              with:
                  submodules: true
                  fetch-depth: 0

            - name: setup
              uses: peaceiris/actions-hugo@v2.6.0
              with:
                  hugo-version: "latest"
                  extended: true 
                  # 按需选择是否使用 hugo-extended

            - name: build
              run: hugo

            - name: deploy
              uses: peaceiris/actions-gh-pages@v3
              with:
                  PERSONAL_TOKEN: ${{ secrets.PERSONAL_TOKEN }} 
                  # 生成的 token 就用在这里，因为下面用到 external repository
                  EXTERNAL_REPOSITORY: username/username.github.io 
                  # 修改为你的 Github Pages 仓库
                  PUBLISH_BRANCH: main 
                  # 以及对应的分支 main/master
                  PUBLISH_DIR: ./public 
                  # 指定将自动部署得到的 public 文件夹 push 上去
                  commit_message: ${{ github.event.head_commit.message }}

若点击保存，则将自动完成第一次 commit，注意提前备份原 Github Pages 仓库里的内容。（没备份也可以通过历史 commit 找到啦，哈哈）

4. 如果你还希望刷新 Cloudflare 缓存

我还使用 Cloudflare Pages 来加速访问。为了在更新博文后刷新 posts 页面的缓存，可以借助 Cloudflare Purge Cache，或者 Cloudflare Cache Purge Action 等。

以后者为例，在 deploy 之后加入：

- name: Purge cache
  uses: nathanvaughn/actions-cloudflare-purge@master
  with:
      cf_zone: ${{ secrets.CLOUDFLARE_ZONE }}
      cf_auth: ${{ secrets.CLOUDFLARE_AUTH_KEY }}
      files: |
         https://fanrongbin.com/posts/index.html
         https://fanrongbin.com/index.html
         https://fanrongbin.com/main.css

需要新增两个 secret：

CLOUDFLARE_ZONE：在 Cloudflare的 Dashboard 取得，即 Zone ID （区域 ID）
CLOUDFLARE_AUTH_KEY：在 API 页面配置一个专用于刷新缓存的 API，具体可以参考 Action 页面教程