留資表單:honeypot 與三態文案

漏斗的最後一步:PNG 已經免費給了,現在用「30 天行動追蹤模板」交換 email。這頁打的是真實部署的 Cloudflare Worker —— 送出後 email 真的會寫進 D1, 回應裡的模板連結當場兌現。

注意:你正用 file:// 直接開這頁。瀏覽器會以 null origin 發跨網域請求, Worker 的 CORS 白名單(localhost / yazelin.github.io)不會放行,送出會失敗。請在這個資料夾跑 python3 -m http.server 再用 http://localhost:8000 開啟,或改用線上版。

一、留下 Email,換 30 天行動追蹤模板

看原始回應(教學用)

(尚未送出)

二、Worker 端點設定

POST 目標(預設是課程部署的真 Worker;學員自部署後換成自己的網址)

送出的 JSON:{"email": "...", "company": "..."} —— company 是 honeypot,真人永遠是空字串。

三、這頁在教什麼

honeypot:表單藏一個叫 company 的欄位,用 CSS 移到畫面外(不能用 display:none,聰明一點的機器人會跳過隱形欄位)。真人看不到所以不會填;機器人習慣把每個欄位都填滿。Worker 看到有值就假裝成功但不寫入 —— 不回錯誤,免得機器人知道自己被識破。
三態文案:成功(寫入 D1)/ 重複(email 已存在,回 already: true 並照樣給模板 —— 不洩漏名單、對真人也友善)/ 錯誤(格式不對 400、太頻繁 429)。三種都要有明確的下一步,不能讓使用者對著轉圈圈發呆。
承諾即時兌現:註冊成功的回應直接帶 gift 連結,前端顯示成按鈕。不依賴寄信 —— 寄信系統(MailerLite/Brevo)是之後的加值,不是兌現的前提。
後端防線:這個端點還有每分鐘 5 次 + 每日 10 次/IP 的限流(跟 demo 04 同一套思路),email 正規化(trim + 小寫)後才進 D1,UNIQUE 衝突就是「重複」的判斷依據。

收進 D1 的名單去哪了?完整版有 admin.html:用 Bearer token 看名單、匯出 CSV, 丟進任何 EDM 工具都行 —— 名單是你的資產,不被任何平台綁架。