背景

由于本博客源站部署在海外，此前的 CI 流程为：

1. 本地运行
2. 编写博客
3. 提交 Gitee
4. 触发 Jenkins 构建
5. 部署 Nginx

而在海外 Gitee 特别慢，常常拉取代码就要十几分钟，甚至超时。

打算改变一下 CI 的流程，计划改用：

1. 本地运行
2. 编写博客
3. 提交 Github
4. 触发 Github Actions 构建
   • 部署到 Cloudflare Pages
   • 执行站内搜索爬虫

正文

获取 Cloudflare Token

• 登录 Cloudflare dashboard (opens new window)

• 创建一个有 Cloudflare Pages 编辑权限的 token，备用

Github Actions

• 将 Cloudflare Token 放到想 Github 仓库的 secret 中

  • CLOUDFLARE_ACCOUNT_ID ：Cloudflare 账户 ID，在 首页 - Workers & Pages - Overview - 右侧 - Account ID
  • CLOUDFLARE_API_TOKEN ：Cloudflare API Token

• 创建文件： .github/workflows/pages-deployment.yaml

name: CICD
on: 
  push:
    branches:
      - master
jobs:
  deploy:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      deployments: write
    name: Deploy to Cloudflare Pages
    steps:
      # 拉取代码
      - name: Checkout
        uses: actions/checkout@v3
      # 切换 Node.js 版本
      - name: Change Node.js version
        uses: actions/setup-node@v2
        with:
          node-version: '16.x'
      # 缓存 node 依赖
      - name: Cache node modules
        id: cache-npm
        uses: actions/cache@v3
        env:
          cache-name: cache-node-modules
        with:
          # npm cache files are stored in `~/.npm` on Linux/macOS
          path: ~/.npm
          # 用于创建、搜索缓存的key，通过计算package-lock.json文件的hash来获取对应的缓存，当package-lock.json被更改后，hash值不一致也就无法击中
          key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
          # 当缓存不被击中时，从下列key中以此寻找最近创建的缓存
          restore-keys: |
            ${{ runner.os }}-build-${{ env.cache-name }}-
            ${{ runner.os }}-build-
            ${{ runner.os }}-
      # 当缓存不被命中时，执行npm list
      - if: ${{ steps.cache-npm.outputs.cache-hit != 'true' }}
        name: List the state of node modules
        continue-on-error: true
        run: npm list
      # 安装依赖，当缓存中没有时，从网络下载
      - name: Install dependencies
        run: npm install
      # 构建
      - name: Build
        run: npm run build
      # 推送到 Cloudflare Pages
      - name: Publish to Cloudflare Pages
        uses: cloudflare/pages-action@1
        with:
          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
          projectName: nipgeihou-blog # e.g. 'my-project'
          directory: docs/.vuepress/dist # e.g. 'dist'
          gitHubToken: ${{ secrets.GITHUB_TOKEN }}
      # 更新站内搜索爬虫
      - name: Run docs-scraper
        run: |
            docker run -t --rm \
              -e MEILISEARCH_HOST_URL="${{ secrets.MEILISEARCH_HOST_URL }}" \
              -e MEILISEARCH_API_KEY="${{ secrets.MEILISEARCH_API_KEY }}" \
              -v "$(pwd)/meilisearch/scraper-config.json:/docs-scraper/scraper-config.json" \
              getmeili/docs-scraper:v0.12.7 pipenv run ./docs_scraper scraper-config.json

参考

• Use Direct Upload with continuous integration · Cloudflare Pages docs (opens new window)
• 缓存依赖项以加快工作流程 - GitHub 文档 (opens new window)