使用 GitHub Discussions 管理博客

我的博客

分享一下我搭建博客的方案：

使用 Astro 作为静态博客框架（本地启动速度快）。
部署在 GitHub Pages 服务上（免费）。
自动同步 GitHub Discussion 到博客内容（可以使用 GitHub 手机客户端编辑 Discussion）。
使用 giscus 做为博客的评论插件（直接评论到 Discussion，完美！）。

缺点：

仅支持标题搜索，无法根据博客内容搜索文章。Astro 可以集成 algolia 搜索，因为我的博客文章还很少，暂时没有研究。

创建 GitHub Pages 项目

参考 GitHub 官方文档创建 Pages 项目。

其中 Build and deployment 中的 Source 选择为 GitHub Actions，这是 Astro 发布到 GitHub Pages 的前提条件。

开启项目的 Discussion 功能。

将 giscus 配置到 GitHub Pages 项目。建议把用不到的 Category 删掉。创建几个 Announcement 类型的 Category，确保只有仓库的管理员有权限新增 Discussion，避免其他人发的帖子被同步到仓库。

创建 Astro 项目

参考 Astro 官网说明创建项目，有很多主题可以选择。

我使用的 AstroPaper 主题。

配置 Astro 发布到 GitHub Pages 的功能

官方文档

本博客的实例

编写将 Discussion 同步到本地目录的脚本

我在 scripts 目录中新建了 process-discussions.mjs 文件。

然后在 packages.json 文件里新增了一个命令。

json 复制代码

{
  "scripts": {
    "process": "node scripts/process-discussions.mjs"
  }
}

process-discussions.mjs 脚本接收一个文件参数，这个文件是 GitHub Action 的 Payload，具体的信息可以参考 GitHub 文档

因为 Payload 中的内容有限，所以又通过 GitHub 的 GraphQL API 查询出变更的 Discussion 的内容。

其中，在  之间的内容，是 Astro Markdown 文件的 front matter 的内容。

文章的标题、描述、发布时间和修改时间如果没有指定，会从 Discussion 的对应属性里取得。 Discussion 的 Label 会转为博客的 tag 属性。 Discussion 被置顶后，博客的 featured 属性会标记为 true。

例如：

markdown 复制代码

<!-----
slug: manage-blog-posts-with-github-discussions
description: 文章描述
----->

配置 Discussion 同步到仓库

写完前面的脚本后，还需要在 Discussion 有变更的时候，运行前面的脚本，把 Discussion 的内容转为 Astro 博客的 Markdown 文件，然后提交到仓库的主分支，触发博客的自动部署功能。

这样一来，编辑博客只需要在 GitHub Discussion 页面在线操作就可以了，图片和文件也是放到了 GitHub assets 里，不会增加仓库的体积。

新增一个 GitHub Workflow 配置文件。

yaml 复制代码

name: Generate blog based on discussions

on:
  discussion:
    types: [created, edited, deleted, pinned, unpinned, labeled, unlabeled, category_changed]

permissions:
  contents: write
  pages: write
  id-token: write

jobs:
  process-payload:
    # 只有这里配置的 Category 中的 Discussion 才会同步到仓库。多个 Category 用英文逗号 "," 分割。
    if: contains(fromJson('["release", "memo"]'), github.event.discussion.category.slug)
    name: Process payload
    runs-on: ubuntu-latest
    env:
      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
    steps:
      - uses: actions/checkout@v3
        name: Checkout
      - uses: actions/setup-node@v3
        name: Install Node.js
        with:
          node-version: 18
      - run: npm i -g pnpm
        name: Install pnpm
      - run: pnpm install --frozen-lockfile
        name: Install dependencies
      - run: pnpm run process "${{github.event_path}}"
        name: Process discussion payload
      - name: Commit & Push changes
        uses: actions-js/push@master
        with:
          branch: master
          github_token: ${{ secrets.GITHUB_TOKEN }}
      - name: Install, build, and upload your site
        uses: withastro/action@v1
        with:
          path: .
          node-version: 18
          package-manager: pnpm@latest

  deploy:
    needs: process-payload
    runs-on: ubuntu-latest
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    steps:
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v1

实例

这篇博客，就是先在名为 Draft 的 Category 里编辑，等觉得差不多可以发布了，再移动到 Release 这个 Category。

因为 Workflow 的配置，Category 是 release 或者 memo 时才会同步到仓库，然后正式发布到博客网站。