說明三方分工
能指出 Sheet、GAS Web App 與前端各自負責哪一段。
CHAPTER 21 · 180 MINUTES
GAS 與試算表資料流程（Mock／Live）
試算表像倉庫，GAS doGet 是出餐口；標準練習用 mock 保持可驗證，只有教師 live URL 才代表外部服務。
2種資料模式
3個明確任務
1份固定契約
LEARNING GOALS
本章結束時，你能做出什麼
固定資料欄位
把空值與原始 rows 正規化成 id、name、price。
誠實標示模式
分清 MOCK、LIVE 與 LIVE-FALLBACK，不以卡片出現冒充連線成功。
PROBLEM & ANALOGY
看見產品，不等於連到 Sheet
第 20 章會接資料；本章把 Sheet 當備料表、doGet 當出餐流程、ContentService 當 JSON 外帶盒、部署後的 /exec URL 當對外窗口。
本章要解決：外部授權或網路失敗時，課堂仍要有 mock 可練；但畫面必須說清楚資料究竟從哪裡來。
合回共同作品：正規化後的產品資料會交給第 22 章列表與分頁。
把名詞對回畫面與程式
- MOCK / LIVE / FALLBACK
- 分別代表教學資料、真實服務與失敗備援。
- /exec
- 部署後可被前端呼叫的 GAS Web App 入口。
- rows
- GAS 或 Sheet 回傳的資料列集合。
- normalize
- 在資料入口統一欄位與空值格式。
- 部署版本
- GAS 更新後需重新部署才成為可呼叫版本。
SCOPE
今天的學習邊界
能自己完成
辨識 doGet、ContentService、部署 URL、row、normalize 與 fallback。
看得懂即可
執行身分、存取權限與部署版本會影響誰能呼叫。
刻意延後
OAuth token、正式會員權限、複雜 Sheet 查詢與公開敏感資料。
CORE IDEAS
外部服務與課堂備援要分開說
- 流程固定為 Sheet → doGet → JSON → fetch → normalize → render。
/exec是部署後入口；編輯內容更新不代表部署版本已更新。- normalize 在資料入口統一欄位，不讓每張卡各自處理 undefined。
- mock 是可控教學資料，不是 live；fallback 發生時必須留在畫面證據中。
DEBUGGING
先單獨打開服務，再查前端
課堂刻意錯誤：貼錯部署 URL，或讓 GAS 回傳 {data:[...]}、前端卻直接期待陣列。
- 直接在瀏覽器開
/exec，確認不是/dev，而且回應是 JSON。 - 檢查部署版本、執行身分與存取權限。
- 到 Network 看 status 與實際回應內容，再確認前端模式設定。
- 確認 rows 是陣列，逐筆比對 normalize 前後欄位。
- 外部服務阻塞時切回 mock，並清楚顯示 fallback，不能靜默冒充 live。
/exec 不是 JSON
先查：直接開服務 URL，確認部署、權限與回應格式。
卡片出現 undefined
先查：檢查 rows 是否為陣列，再比對 normalize 前後欄位。
失敗卻顯示 LIVE
先查：確認 fallback 分支更新模式標籤，不能冒充 live。
PRACTICE CONTRACT
Starter 到 Solution 共用同一個資料服務
開始前先確認這四件事
- 我已確認目前資料模式與可接受證據。
- 我能說出 Sheet → GAS → JSON → normalize → render。
- 我不會放 token、私人 URL 或敏感資料。
- 我會測試 live 失敗的 fallback。
建立 mock 或 GAS 請求函式
檔案：script.js
位置：requestRows()
結果：頁面能取得固定欄位的回應
正規化並安全顯示 Sheet rows
檔案：script.js
位置：normalizeRows()、createRowCard()、renderRows()
結果：空值與 Live 文字都以安全文字節點顯示
顯示資料模式與失敗備援
檔案：script.js
位置：loadRows()
結果：畫面區分 mock、空資料、合法 GAS /exec 與其他 JSON，live 失敗時可改用備援
EVIDENCE
成果證據與檢核
30 秒說法可以直接照這個句型練習：
目前是 ______ 模式；資料從 ______ 經過 ______ 後顯示；失敗時畫面寫 ______。
MOCK 成功不等於 GAS 成功；live 證據必須包含實際 URL、回應與前端模式。
截圖需同時包含資料筆數與 MOCK／LIVE／FALLBACK 標籤；若宣稱 live，另附瀏覽器直接開 /exec 的 JSON 與 Network 證據。
下一章：把同一批產品依頁碼切成每頁三筆。