ngrok

• 在我們的項目中會使用很多工具的webhook，因此需要提供一個靜態(tài)域名方便webhook調(diào)用
• ngrok 可以將本地運行的服務(wù)用一個公網(wǎng)地址暴露出來
• 安裝： brew install ngrok，當(dāng)前版本 3.22.0
• 配置：ngrok config add-authtoken ***
• Domains => New Domain
• concurrently： 一個用于在同一個終端中并行運行多個命令的開發(fā)工具
  • 通常使用npm、yarn時也可以通過 && 實現(xiàn)串聯(lián)命令，但那是順序執(zhí)行；而 concurrently 可以并行執(zhí)行命令
  • bun add concurrently ，當(dāng)前版本 "concurrently": "^9.2.0"
  • 添加命令，*** 表示對應(yīng)的 ngrok domain
  • 每次啟動項目時，執(zhí)行bun run dev:all，就可以將項目運行在一個公網(wǎng)地址下了

    "scripts": {
      ...
      "dev:all": "concurrently \"bun run dev\" \"bun run dev:webhook\"",
      "dev:webhook": "ngrok http --url=*** 3000",
      ...
    },
  

Clerk dashboard 的展示信息

• users => 已登錄用戶
• Configure => Webhooks
  • End points 及詳情，當(dāng)前節(jié)點的調(diào)用情況，失敗、成功統(tǒng)計
  • Event Catalog 對應(yīng)事件的返回的數(shù)據(jù)結(jié)構(gòu)
  • Logs 節(jié)點請求日志

Clerk Webhooks

• 關(guān)于 Webhook 的文檔，Sync Clerk data to your app with webhooks
• Clerk dashboard: Configure => Webhooks => Add Endpoint，Subscribe to events 選擇 user
• 創(chuàng)建完成后添加環(huán)境變量配置：

CLERK_WEBHOOK_SIGNING_SECRET=***

創(chuàng)建api路由

• 參考 使用Webhook同步Clerk數(shù)據(jù) 的第5步對user事件進行監(jiān)聽
• 不同事件監(jiān)聽返回的數(shù)據(jù)格式，請查詢 Clerk dashboard => Configure => Webhooks下的Event Catalog
• 創(chuàng)建的api路由要與在 Clerk dashboard=>Configure=>Webhooks 中定義的 Endpoint 相匹配，并且文件名必須是 route.ts 或 route.js