建立網站表單本身不難，真正容易卡住的是「送出之後」：資料要去哪裡、怎麼驗證、怎麼防止機器人提交，以及網站要如何正確顯示成功或失敗狀態。這篇指南把這些工作拆成一條可以與 ChatGPT 協作完成的流程。
逐步完成整合
依序完成表單、GAS、reCAPTCHA、正式串接與測試；每個步驟都可以點擊展開。
先告訴 ChatGPT 你需要什麼表單描述欄位、操作狀態與後續串接需求。
請在我的 VIXNODE 網站建立聯絡表單，包含姓名、Email、電話與訊息。
表單需要送出按鈕、送出中狀態，以及成功與失敗訊息。
之後我要串接 Google Apps Script，並加入 reCAPTCHA。
透過 VIXNODE 完成表單前端先做好 UI、欄位驗證與手機操作體驗。
先處理 Label、必填欄位、Email 格式、Loading、成功／失敗狀態與 RWD。
請 ChatGPT 指引 Google Apps Script 設定與撰寫 Code.gs從 Google Sheet、Apps Script 專案到 Web App 部署。
把網站表單欄位交給 ChatGPT，請它依實際欄位產生完整 Code.gs，並一步一步指引設定與部署。
我有一個網站聯絡表單，欄位包含：
- name
- email
- phone
- message
- recaptchaToken
請一步一步指引我準備 Google Sheet、建立 Apps Script、撰寫完整 Code.gs、接收 POST、驗證欄位、伺服器端驗證 reCAPTCHA、寫入 Google Sheets、回傳 JSON，最後部署成 Web App。
使用 Google Drive Tool
已連接 Google Drive 時，可請 ChatGPT 協助建立或修改 Google Sheet、檢查欄位與相關檔案。
自行建立後提供網址
也可以自己建立 Google Sheet 或 Apps Script，完成後把網址交給 ChatGPT，請它依實際內容調整。
完成條件：Sheet、Code.gs、reCAPTCHA 驗證邏輯與 Web App 都已準備，並取得
/exec URL。準備 reCAPTCHA前端取得 token，真正驗證放在 Apps Script。
網站端取得 reCAPTCHA token，與表單一起送到 Apps Script，再由 Apps Script 進行伺服器端驗證。
重要：Secret 不要寫進公開的網站 JavaScript；驗證失敗時不要寫入 Google Sheets。
把 Web App URL 與 reCAPTCHA 資訊交給 ChatGPT讓網站端與 GAS 欄位格式對齊。
Google Apps Script Web App URL：
https://script.google.com/macros/s/xxxxxxxxxxxxxxxx/exec
請把目前聯絡表單串接到這個網址，送出 name、email、phone、message、recaptchaToken。成功後清空表單並重設 reCAPTCHA。
讓 ChatGPT + VIXNODE 完成正式串接處理 fetch、Loading、防重複提交與成功／失敗狀態。
- 必填與 Email 格式驗證
- 送出期間顯示 Loading 並停用按鈕
- 成功後清空欄位並重設 reCAPTCHA
- 失敗時恢復操作並顯示提示
測試、除錯，再正式發布成功與失敗案例都要測試。
完整測試：填表 → reCAPTCHA → 送出 → Apps Script 驗證 → Google Sheets 出現資料 → 網站顯示成功。
網站端與 Apps Script 的責任要分清楚
公開網頁只放前端需要使用的資訊；Secret、私密驗證資訊與安全判斷應留在 Apps Script 端。
常見問題
一定要會寫 Google Apps Script 才能完成嗎？
不一定。可以讓 ChatGPT 依欄位撰寫 Code.gs 並指引設定與部署。
Google Drive Tool 可以幫什麼？
可協助建立或修改 Google Sheet、檢查欄位與相關檔案；也可自行建立後提供網址。
reCAPTCHA 只放前端可以嗎？
不建議。前端取得 token，真正驗證應在 Apps Script 端完成。