使用 Github Action自动执行Vercel 部署

之前本网站部署在 Netlify 上的，有过一篇文章**使用 Github Action自动执行 Netlify 部署****。 **以解决每周自动部署网站的功能，详细可点击查看。

最近想查看下国内访问网站的速度情况，所以使用 itdog ping 工具进行了测试，发现国内的情况十分不理想。

所以萌生了起换到 vercel 上的想法，并且 vercel 也有 cdn 功能了，右边是切换到 vercel 上部署的情况，看起来好了很多。

切到 vercel 重新部署，域名重新解析配置好之后，对于之前 github action 定时部署的情况，需要重新写一份 workflow job。

搜索vercel 同样支持 Deploy Hook 的方式。那就简单了，复制一份 Netlify 的文件，简单修改即可。

1、配置创建 Vercel Build Hooks

参考 Creating & Triggering Deploy Hooks 官方文档。

官方说的清清楚，部署钩子允许您创建接受 HTTPPOST请求的 URL，以触发部署并重新运行**构建步骤**。这些 URL 与您的项目、存储库和分支唯一链接，因此无需使用任何身份验证机制或向请求提供任何有效负载POST。

此功能允许您将 Vercel 部署与其他系统集成。例如，您可以设置：

• 来自 Headless CMS 的内容更改的自动部署
• 通过配置第三方 cron 作业服务来触发 Deploy Hook 来进行计划部署
• 通过命令行强制部署

在vercel 项目设置→Git中找到 Deploy Hooks 创建的地方，输入 hooks 名字，和代码分支，即可创建。

2、创建 GitHub Actions secrets and variables

在Github 的项目Setting下设置 github actions 所需要的变量。 例如，创建VECEL_BUILD_HOOK变量，value 为上一步获得的 vecel build hook 地址。

3、实现 GitHub Actions

触发 hooks 的示例请求为：

curl -X POST https://api.vercel.com/v1/integrations/deploy/prj_98g22o5YUFVHlKOzj9vKPTyN2SDG/tKybBxqhQs

响应示例：

{
  "job": {
    "id": "okzCd50AIap1O31g0gne",
    "state": "PENDING",
    "createdAt": 1662825789999
  }
}

发送请求后，您可以在项目仪表板上看到它触发了部署。

那么，实现 github actions 代码就比较简单了，参考如下：

name: Trigger Vercel Build
on:
  schedule:
    - cron: '5 0 * * 2' # At 00:05 on 星期二.
  workflow_dispatch:  # 手动触发
jobs:
  build:
    name: Request Vercel Webhook
    runs-on: ubuntu-latest
    steps:
      - name: Curl request
        env:
          VERCEL_BUILD_HOOK: ${{ secrets.VERCEL_BUILD_HOOK }}
        run: curl -X POST $VERCEL_BUILD_HOOK

参考资料

Creating & Triggering Deploy Hooks 官方文档

使用 Github Action自动执行 Netlify 部署