Firebase 無伺服器應用開發

課程概述

做一個需要登入、讀寫資料的 App，不一定得先架好整套後端。Firebase 把使用者認證、Firestore 和函式等服務接在一起。這堂課會看資料怎麼流動，也會特別留意：前端能直接存取資料時，權限該在哪裡擋。

你將學到

• 設定 Firebase 專案並連結 GCP
• 使用 Cloud Firestore 進行 CRUD 操作
• 實作 Firebase Authentication 使用者認證
• 部署 Cloud Functions for Firebase
• 使用 Firebase Security Rules 保護資料

核心概念

Firebase 核心服務

表格超出欄寬時，可左右捲動；鍵盤可聚焦表格後用左右方向鍵查看。

Firestore 資料模型

Firestore 使用 Collection → Document → Field 結構：

// 新增文件
db.collection('users').doc('user1').set({
  name: '小明',
  email: 'ming@example.com',
  createdAt: firebase.firestore.FieldValue.serverTimestamp(),
});

// 即時監聽
db.collection('messages')
  .orderBy('timestamp')
  .onSnapshot((snapshot) => {
    snapshot.docChanges().forEach((change) => {
      console.log(change.doc.data());
    });
  });

Security Rules

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /users/{userId} {
      allow read: if request.auth != null;
      allow write: if request.auth.uid == userId;
    }
  }
}

%%{init: {"flowchart": {"curve": "linear", "nodeSpacing": 24, "rankSpacing": 32}}}%%
flowchart TD
  REQUEST["Firestore 寫入請求"] --> SDK{"使用哪一種 SDK？"}
  SDK -->|"Client SDK"| AUTH{"Auth Token 有效？"}
  AUTH -->|"否"| CLIENT_DENY["拒絕：沒有可驗證的使用者身分"]
  AUTH -->|"是"| RULES{"路徑、uid 與欄位變更<br/>都符合 Security Rules？"}
  RULES -->|"是"| CLIENT_ALLOW["允許 Client 寫入"]
  RULES -->|"否"| RULE_DENY["拒絕：修正身分、路徑<br/>或資料驗證條件"]
  SDK -->|"Admin SDK"| IAM{"Service Account 的<br/>IAM 權限允許？"}
  IAM -->|"是"| ADMIN_ALLOW["直接授權寫入<br/>並稽核伺服器端操作"]
  IAM -->|"否"| ADMIN_DENY["拒絕：修正最小必要 IAM 權限"]

實作重點

• Firestore 的資料存取模式在建立資料庫時選定，資料庫有資料後就不能更改：Native mode（即時同步與離線快取）、Datastore mode（相容 Datastore API，官方只建議給依賴這組 API 的既有應用，沒有即時更新功能），以及 Enterprise edition 才有的 Firestore with MongoDB compatibility
• 建立 Firestore 資料庫時要選位置（每個資料庫各自設定），建立後無法更改
• 正式環境的 Security Rules 要依使用者身分和資料路徑限制讀寫
• Firebase Local Emulator Suite 可在本機模擬 Authentication、Firestore、Realtime Database、Cloud Storage for Firebase、Cloud Functions、Hosting 等核心服務；Analytics、Remote Config、Crashlytics 目前不支援

Skill Badge 指引

Lab 連結：Develop Serverless Apps with Firebase — 完成此 lab 可獲得 Skill Badge

延伸學習

• GenAI 結合：Agent Platform（原 Vertex AI）+ Flutter 打造 AI Agent
• 本系列下一課：部署應用到 Kubernetes