CHAPTER 27 · 120 MINUTES
TODO B:Mock 同步、失敗復原與 GAS 延伸
本章使用課次 27 前 120 分鐘,以 mock sender 練習失敗保留與重試;真實 GAS 必須另外提出 Network、queue 與 Sheet 證據。
1條 mock 主線
3個明確任務
3份 Live 證據
LEARNING GOALS
本章結束時,你能做出什麼
01建立待同步 queue
每次本機變更都加入有唯一 id 的 queue item。
02失敗不丟資料
成功項移除,失敗項保留,線上後可以重試。
03誠實完成預檢
Mock 預檢只證明流程,不宣稱 GAS 已部署或 Sheet 已寫入。
進場檢核與作品接力
可觀察目標:畫面顯示兩筆變更與兩個不同短 id,待同步數量為 2;離線時兩筆全保留;線上時兩筆全移除;重整後 queue 保留、模擬網路為線上,retry 後佇列清空並顯示 mock 預檢邊界。
- 具備第 26 章成果:完成可新增、切換與刪除且能保存的本機待辦事項 App:不看答案,展示或口述第 26 章成果,並說出一項可見證據。 需要補強時從這裡接回
- 能從 Starter、Checkpoint 與 Solution 中辨識目前工作階段:開啟本章主講義,指出 TASK-01 的修改檔案、可見結果與第一個 Checkpoint。 需要補強時從這裡接回
- 能用「操作後看見什麼」描述驗收證據:閱讀三個任務後,選一題說出操作條件與預期可見結果。 需要補強時從這裡接回
輸入:第 26 章產物:完成可新增、切換與刪除且能保存的本機待辦事項 App
本章輸出:完成可操作的 mock 同步原型;真實 GAS 串接列為有完整步驟的延伸
產物類型:prototype;後續用途:第 28 章
PROBLEM & ANALOGY
待寄區清空,不一定代表包裹送達
第 26 章證明單一瀏覽器可以保存;本章加入 enqueue、sender、失敗保留與 retry。queue 記的是待做動作,不是遠端完整資料。
本章要解決:catch 後清空 queue 會造成資料遺失,而 mock queue 歸零也不能冒充真實 Sheet 寫入。
合回共同作品:同步原型會作為第 28 章部署前的資料可靠性檢核。
必會Mock 主線
enqueue、逐筆 mockSend、成功移除、失敗保留、retry 與 preflight。
辨識GAS 延伸
doPost(e)、/exec、Network 回應與 Sheet 新列。
不教刻意延後
多人 conflict 合併、正式離線同步引擎與敏感資料公開寫入。
GAS 延伸實作與證據規格不取代標準 mock 練習。
Live Extension(選修):GAS POST 正式環境操作與 Network 證據不影響 Mock 必修主線。
開啟安全操作手冊
- 本機變更先 enqueue,每筆含 id、type 與必要資料。
syncQueue() 逐筆交給 sender;成功不再保留,catch 的項目放入 failed。- 重試只是再次嘗試 queue,不能在 offline 或未收到成功回應時清空。
- preflight 是出貨前檢查表,不是到貨證明;標準文案必須明寫 Mock。
- GAS Live 要同時有 Network POST/JSON、queue 狀態與 Sheet 新列三份證據。
DEBUGGING & SECURITY
用一次斷線跑完整復原閉環
課堂刻意錯誤:catch 後把 queue 清空;或只判 queue.length 為 0,讓 offline 空 queue 也顯示預檢通過。
- 確認 enqueue 後 queue 數量與 id。
- 確認 online 狀態,逐筆記錄 mockSend 成功或進入 catch。
- 檢查 failed 陣列與最後 queue,失敗項不能消失。
- 重跑「新增 → 離線失敗 → 保留 → 上線重試 → 歸零」。
- Live 延伸再查
/exec、response、部署版本與 Sheet;不公開 token、個資或真實 URL。
症狀 01
失敗後 queue 清空
先查:檢查 catch 是否保留 failed 項,成功才移除。
症狀 02
offline 空 queue 卻通過
先查:預檢不能只看 queue.length,還要看網路與結果。
症狀 03
mock 被說成 GAS 成功
先查:檢查模式文案,live 要另附 Network、JSON、Sheet 證據。
EVIDENCE
Mock 與 GAS 使用不同證據門檻
30 秒說法可以直接照這個句型練習:
變更 ______ 先進入 queue;offline 時 ______;成功回應後才 ______;本次模式是 ______。
GAS 延伸需另外驗 Network POST/JSON、queue 狀態與 Sheet 新列;三者缺一不可。
標準驗收:記錄同步前後 queue id,證明 offline 失敗保留、online 成功才移除;畫面文案必須寫「Mock,尚未驗證 GAS」。
交件前自我檢核
4 項 · 點選每一列完成自評
GAS 延伸另驗:Network POST 與 JSON 回應、同步後 queue 狀態、Sheet 新列,三者缺一不可。
下一章:部署真實 Production URL,並分開格式預檢與人工驗真。
下一步:前往第 28 章「Netlify 部署、證據格式預檢與期末展示」,帶著本章輸出繼續累積作品。