針對你遇到的 Umami 在本地端(localhost)正常,但部署到雲端(如 Vercel)後失效的問題,這裡為你總結核心原因與解決步驟:

核心問題:環境變數未同步

最直接的原因是 環境變數(Environment Variables)缺失。 • 本地端(Localhost): 你的電腦裡有 .env.local 檔案,Next.js 可以讀取其中的 Umami 配置,所以追蹤功能正常。 • 雲端(Cloud/Vercel): 為了安全,.env.local 通常被設定在 .gitignore 中,不會被推送到 GitHub。因此,雲端伺服器在編譯(Build)你的 NotionNext 網站時,找不到 Umami 的相關設定,導致網頁中沒有植入正確的追蹤腳本。

解決方案:三步驟修復

1. 在 Vercel 後台手動新增變數

請登入 Vercel 控制台,進入專案的 Settings > Environment Variables,新增以下兩組變數:變數名稱 (Key)對應數值 (Value)

image.png

2. 重新部署 (Redeploy)

這步至關重要! 僅僅儲存變數是不夠的,因為 Next.js 需要在「編譯階段」將這些變數注入程式碼中。 • 前往 Vercel 的 Deployments 頁籤。 • 找到最近的一次部署,點擊右側選單(三個點),選擇 Redeploy。

image.png

3. 驗證結果

部署完成後,打開你的正式網址並執行: • 按下 F12 打開開發者工具。 • 切換到 Network (網路) 標籤。 • 重新整理網頁,搜尋關鍵字 umami 或 collect(或 api/send)。 • 如果有看到請求發出且狀態碼為 200,就代表雲端版本已成功串接。

image.png