CHAPTER 25 · PRACTICE WORKSPACE

身份、uid 與權限模型(概念模擬)

完成明確標示非真實登入的 Auth 與權限概念模擬

03 Checkpoint 2 2/3
  1. 01Starter讀懂作品骨架
  2. 02Checkpoint 1加入第一項能力
  3. 03Checkpoint 2累積第二項能力
  4. 04Solution核對完整結果

TASK STATUS

三項任務目前狀態

TASK-01已完成

呈現登入與登出狀態

修改檔案:script.js

完成後看見:畫面清楚顯示目前 mock user 或未登入

TASK-02已完成

完成教學模擬登入流程

修改檔案:script.js

完成後看見:空白與錯誤 Email 不會登入,示範帳號取得固定 mock uid

TASK-03本階段處理

以 uid 判斷資料權限

修改檔案:script.js

完成後看見:只有資料 owner uid 可編輯

WORKSPACE

本階段實作區

已完成 TASK-02;先核對可見結果,再前往 TASK-03。

FOCUS TASK · TASK-03

現在只處理:以 uid 判斷資料權限

修改:script.js

完成後:只有資料 owner uid 可編輯

講解時展開:2 個小型比較

owner uid vs current uid|資料與使用者對照

比較:可編輯條件要比較資料 owner 與目前 user uid,不能只看登入按鈕。

現在做:在 Solution 先登入 [email protected],確認 auth-state=uid-guest、edit.disabled=true、permission=「目前不可編輯」;再登入 [email protected],確認 uid-student、edit 可用且 permission=「此 mock uid 可編輯」。

看預期與證據

預期:guest 與 owner 的 uid、edit.disabled、permission 三項結果相反;只有 owner uid 可編輯。

證據:留下 guest/owner 兩列 uid、按鈕狀態與 permission 證據,證明判斷比較的是 ownerUid 與 currentUser.uid。

canEdit vs 畫面控制|權限判斷集中

比較:canEdit 負責決策,畫面只依結果顯示可編輯或唯讀狀態。

現在做:在 Solution 先以 owner 登入並點擊編輯,記錄 permission=「允許編輯」;登出後在 DevTools 將 edit.disabled 設為 false,再點擊同一按鈕,記錄 permission=「拒絕編輯」,證明事件本身仍呼叫 canEdit(),不是只靠停用按鈕。

看預期與證據

預期:owner 路線允許編輯,unauth 移除 disabled 後仍拒絕;畫面控制與 canEdit 決策保持同一結果。

證據:留下 owner click 與移除 disabled 後的 unauth click 兩條 permission 證據,並說明 UI disabled 不是正式 Rules 安全邊界。

需要排錯時查看:任務循環(觀察 → 預測 → 實作 → 故障 → 驗收)
  1. A|觀察:在 Checkpoint 2 登入 [email protected] 與另一個合法 Email,記下兩個 mock uid;目前 canEdit 仍固定回 false。
  2. B|預測:切換不同 mock user,確認只有 owner uid 的資料出現編輯能力。
  3. C|實作:在 script.js 的 canEdit() 完成「以 uid 判斷資料權限」,一次只處理本任務責任。
  4. D|故障:若結果不一致,先依原操作重現,再檢查 canEdit() 與 script.js,最後重跑原操作。
  5. E|驗收:只有資料 owner uid 可編輯

完成條件:DONE-03:只有資料 owner uid 可編輯

教學模擬,不是真實登入沒有 Firebase SDK、token 或伺服器 Rules。

Auth 與 uid 權限

狀態尚未渲染

資料 owner:uid-student

尚未檢查權限

CONTINUE

繼續完成 TASK-03

前往 Solution,依要求完成「以 uid 判斷資料權限」。

前往 Solution:完成 TASK-03

CHAPTER HANDOFF

從 subscriber 身份,交棒到本機資料操作

接收第 24 章:沿用 subscriber trace、safe render、unsubscribe 與失敗重試的觀察證據;本章只承接概念,不搬同一份 runtime 資料,改判斷誰是誰、誰能編輯。

交給第 26 章:完成後帶著明確 mock uid、owner/guest/unauth 權限矩陣與「UI 隱藏不等於 Rules」證據;下一章直接做本機待辦事項的 render 與 localStorage,不重做 Auth 概念。

前往第 26 章:本機待辦事項 CRUD、render、localStorage