昨天搞懂了 Webhook 的隨傳隨到,今天我們就拿它來接一個超級生活化的場景:資料收集與記帳。不管是課堂作業收集、活動報名表單,還是自己想隨手記下一筆花費,如果每次都要手動切開試算表一個個格子填,沒兩天就會想放棄。今天我們用昨天做好的接收端點,搭配線上表單,只要送出瞬間就自動幫我們把資料整整齊齊排進雲端表格。
第一站:準備記帳用表單與試算表
我們先在 Google Drive 開一份全新的試算表,第一列填好表頭欄位:例如「登記時間」、「消費項目」、「金額」、「類別」與「備註」。接著準備一個可以發送 Webhook 的前台介面,像是 Tally、Typeform,或是手機捷徑(iOS Shortcuts)自製的快速輸入彈窗。把表單送出後的轉發網址(Webhook URL)指向我們在 n8n 裡設定好的專屬端點。
第二站:驗收表單送來的包裹
回到 n8n 畫布,點擊 Webhook 節點的監聽測試按鈕,然後自己在表單隨意填寫一筆測試資料(比如「午餐便當」、「120」、「飲食」)並按下送出。回到畫布,你會看見這筆測試資料已經完整躺在接收面板裡,裡面的欄位名稱與填寫內容一目了然。
第三站:欄位清洗與時間格式化
表單送進來的時間戳記常常帶有一大串時區字串或微秒,直接寫進試算表會顯得很雜亂。我們在後面接一個資料整理節點,把系統自動抓到的送出時間轉成習慣的本地日期與時分秒,順便把金額字串轉成純數字型態,確保之後在表格裡能直接跑加總公式。
第四站:串接 Google Sheets 節點追加資料
搜尋並拉出「Google Sheets」節點,選擇之前綁定好的 Google 帳號憑證。動作部分選擇「Append Row(新增資料列)」,接著透過下拉選單選取剛才建立的記帳試算表與工作表名稱。n8n 會自動把我們剛才在第一列打好的表頭(消費項目、金額、類別等)全抓出來變成輸入欄位。這時候只要用滑鼠從左邊的表單資料裡,把對應的值拖曳填進右側各個格子就行。
第五站:自動回傳通知與防呆
資料成功寫進試算表後,最後可以順手連到通訊軟體節點,給自己回發一則簡短通知,比如「已成功記帳:午餐便當 120 元,本月累計又多一筆囉」。整個流程跑順後,只要在手機桌面點一下表單捷徑或捷徑按鈕,五秒內送出,後端自動完成清洗、建檔與通知,徹底告別傳統手動打開巨大試算表的遲鈍體驗。明天我們要來看看當內建節點算不出想要的結果時,如何在流程中寫幾行輕量 JavaScript 補足邏輯。