一、整体思路

yuque_diagram.jpg
利用语雀插件同步语雀云端的文章到博客源码 source/_posts/blog 文件夹下,利用 GitHub Actions 自动化部署将 GitHub 私有仓库的博客文件编译成静态博客文件并部署到静态博客仓库下,但是这样并不能解决语雀一发布文章就触发 GitHub 源码仓库的 GitHub Actions,所以需要中间 TencentCloud 云函数/Aliyun 云函数,云函数的作用就是,语雀文章一经正式发布就触发云函数,从而云函数再触发 GitHub 私有的源码仓库下的 GitHub Actions 达到编译静态博客的效果。

二、网站源文件配置

yuque-hexo 插件

在博客源码当中下载语雀插件

npm i --save-dev yuque-hexo

相关 hexo 命令

yuque-hexo clean # 清缓存删除yuque文件夹 删除yuque.json文件
yuque-hexo sync # 从云端拉取到本地
DEBUG=yuque-hexo.* yuque-hexo sync # Debug

特别需要注意的是:环境变量的传入

语雀为了防止用户恶意多次拉取数据,出于对知识库安全性的调整,使用第三方 API 访问知识库,需要传入环境变量 YUQUE_TOKEN,如果是本地使用建议使用环境变量,也可以是终端的方式输入,详见官方仓库
image.png
更详细使用参考官方官方仓库

最后的配置样式

  "yuqueConfig": {
    "baseUrl": "https://www.yuque.com/api/v2",
    "login": "nicaibandishuqing",
    "repo": "blog",
    "postPath": "src/_posts/blog",
    "cachePath": "yuque.json",
    "mdNameFormat": "slug",
    "onlyPublished": false,
    "onlyPublic": true,
    "adapter": "markdown"
  },
  "scripts": {
    "clean": "hexo clean",
    "build": "hexo generate",
    "server": "hexo server",
    "deploy": "hexo deploy",
    "clean:yuque": "yuque-hexo clean",
    "publish": "npm run clean && npm run deploy",
    "dev": "hexo s",
    "sync": "DEBUG=yuque-hexo.* yuque-hexo sync",
    "reset": "npm run clean:yuque && npm run sync"
  },
  "devDependencies": {
    "yuque-hexo": "^1.6.5"
  }

配置 GitHub Actions 文件

在博客源文件夹下新建如下 GitHub Actions 文件
.github/workflows/main.yml

文件内容配置如下

name: website to wztlink1013.github.io CI/CD

on: [repository_dispatch, watch]

jobs:
  Deploy-Pages:
    name: website to wztlink1013.github.io
    runs-on: ubuntu-latest

    steps:
      # check it to your workflow can access it
      # from: https://github.com/actions/checkout
      - name: Checkout Repository master branch
        uses: actions/checkout@main
      # from: https://github.com/actions/setup-node
      - name: Setup Node.js 10.x
        uses: actions/setup-node@main
        with:
          node-version: "10.x"

      - name: add Git infomations
        run: |
          git config --global user.name 'wztlink1013' 
          git config --global user.email '2550374815@qq.com'

      - name: submit commit infomations
        run: |
          git log --pretty=format:"%s from Github Actions at `date +"%Y-%m-%d %H:%M:%S"`" --date=short -n 1  > commit-message.log

      - name: npm istall hexo-cli、yuque-hexo、*
        env:
          YUQUE_TOKEN: ${{ secrets.YUQUE_TOKEN }}
        run: |
          npm install hexo-cli -g
          npm install yuque-hexo -g
          npm install

      - name: generate articles
        run: |
          hexo clean
          yuque-hexo clean
          YUQUE_TOKEN=**************** yuque-hexo sync
          hexo generate

      - name: push wztlink1013.github.io repository
        env:
          Github_Pages: github.com/wztlink1013/wztlink1013.github.io
          Github_Token: ${{ secrets.token_GithubAPI }}
        run: |
          git clone https://${Github_Token}@${Github_Pages} .github_pages
          mv .github_pages/.git/ ./build/
          cd ./build/
          git add .
          git commit -F ../commit-message.log
          git push --force --quiet "https://${Github_Token}@${Github_Pages}" master:master

有个尚未清楚并解决的问题:语雀 Token 的值,通过 GitHub 仓库密匙的方式传不进去,只能以“裸露的方式传进去”

三、Serverless 云函数配置

python2.7 的配置

# -*- coding: utf8 -*-
import requests

def main_handler(event, context):
    r = requests.post("https://api.github.com/repos/wztlink1013/website/dispatches",
    json={'event_type': "run-it"},
    headers = {"User-Agent":'curl/7.52.1',
              'Content-Type': 'application/json',
              'Accept': 'application/vnd.github.everest-preview+json',
              'Authorization': 'token ***********'})

    if r.status_code == 204:
        return "This's OK!"
    else:
        return r.status_code

触发器的设置

image.png

四、语雀云端的配置

在所需要拉取的仓库中 webhook 中填入云函数所留下的那串网址,勾选所需要触发的选项即可。
image.png

参考