GitHub Actions 驱动的博客构建

此前已经使用GitHub账号创建了一个个人博客，想要保留先前的博客并重新创建一个博客，便只能通过项目创建GitHub Pages，但是这样的话就会出现一个问题，如果不将源码公开的话就无法将博客展示出来，但是我并不确定源码中什么东西是不能够公开的 （之前为了方便甚至将SSH公钥和私钥放在公开的博客仓库中，在同学提醒下才删除），于是想将源码和构建出来的代码仓库分离的想法。再者，为了便利的进行博客的构建发布，便考虑使用GitHub Actions自动化地进行持续集成开发。

Demands

1. 源码与生成网站代码分析，于我而言则是，源码在一个 private 的仓库，生成出来的网站文件存放在一个 public 的仓库中用以作为 GitHub Pages 的展示页面。
2. 使用 GitHub Actions 自动化地进行持续集成开发。

Requirements

• Git
• GitHub
• SSH

Procedure

不同于通过个人账号创建GitHub Pages，此处我是通过项目创建GitHub Pages，有些许方面不尽相同。

1. 将Hugo博客源码添加到GitHub仓库中

此步骤网上已有大量教程，此处就不过多赘述。

2. 创建一个用于GitHub Page的仓库

假如你是使用账号创建的GitHub Page，即创建<Your GitHub Account Name>.github.io的仓库；如果和我一样，只是通过GitHub项目创建GitHub Page则没有太多要求，只需简洁易记即可，对应的GitHub Page的地址为<Your GitHub Account Name>.github.io/<Your Repositoriy Name>。

3. 通过SSH连接GitHub

此处教程参见 Hexo教程 | Mlog (my0sotis.github.io) 的 5.1 创建GitHub Pages 处。

4. 创建Personal Access Token

由于我的代码构建是跨仓库的，常用的 GITHUB_TOKEN 没有权限访问外部仓库，所以需要使用 PERSONAL_TOKEN ^[1]。生成 Personal Access Token 的过程即进入到 GitHub ，登录到自己的账号上，点击右上角的头像，点选 Settings ，在出来的设置左侧的菜单中找到 Developer settings -> Personal access tokens ，点选 Generate new token，如图配置即可， Note 可以自定义， Expiration GitHub不建议选择永久有效，因而我选择了 90 days ，到期了再次重新生成即可， Select scopes 按如图设置即可。

◎ Personal Access Token

⚠一定要把生成 Personal Access Token 后得到的那个字符串复制下来，如果不记录下来的话，后续只能够重新生成。

5. 在源码的仓库中设置Personal Token

得到对应的Personal Access Token后，我们需要将这个Token设置到源码所在的仓库中。在博客源码的仓库中，选择 Settings -> Secrets -> New Repository secret 进行添加。

◎ 设置Personal Token

其中，Name可自己设置，此处我设置为 PERSONAL_TOKEN ，Value值即为上文中得到的 Personal Access Token 。

6. 添加GitHub Actions

终于到了关键的一步，网络上的教程大多是通过GitHub Actions将源码发布到仓库中，公开源代码，但是对于我而言，我更希望将源代码隐藏起来，将发布网页的代码公开，因而我使用了如下的GitHub Actions。需要在博客源码对应的仓库中找到 Actions 的菜单，点击并创建一个新的 Workflow ，将代码替换为如下代码。

 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

name: github pages

on:
  push:
    branches:
      - main  				# Set a branch to deploy
  pull_request:

jobs:
  deploy:
    runs-on: ubuntu-20.04
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true  # Fetch Hugo themes (true OR recursive)
          fetch-depth: 0    # Fetch all history for .GitInfo and .Lastmod

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: 'latest'
          extended: true	# Use Hugo-extended

      - name: Build
        run: hugo --minify

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        if: github.ref == 'refs/heads/main'
        with:
          personal_token: ${{ secrets.PERSONAL_TOKEN }}	# Use PERSONAL_TOKEN
          publish_dir: ./public		# Select the folder contain your website
          external_repository: <GitHub User Name>/<Github Repository>	# Select the repository you want to publish
          publish_branch: master  # Select the branch you want to publish

其中，on -> push -> branches 下选择源码仓库中对应的分支。在jobs -> deploy -> steps 下的 Setup Hugo 步骤中，extended 表明需要使用 Hugo-extended 包进行构建；在 Deploy 步骤中，publish_dir 是需要发布网站代码的位置，在 Hugo 中为 ./public ； external_repository 为存放网站代码的仓库，按照代码中的格式设置即可； publish_branch 即发布在网站代码的仓库中的分支名。详细的配置可以查看后面附带的文档。¹

修改完后，点击 Start Commit 就会自动进行代码的构建发布了！你可以在博客源码的仓库中选择 Actions ，查看你的 GitHub Actions运行的流程，不放心的话，还可以在博客源码的仓库进行一次 push 操作。