將 Firebase SDK 與您的網路應用程式整合

Firebase App Hosting 非常適合用於使用 Firebase JavaScript SDK 和 Node.js 的 Firebase Admin SDK 建構的動態網頁應用程式。在功能完整的網頁應用程式中，Firebase SDK (例如 Authentication、Cloud Firestore 和 App Check) 扮演著重要的角色。本指南將說明一些重要策略，協助您最佳化 Firebase SDK，並開始在 Firebase App Hosting 的網頁應用程式中建構 Firebase。

自動初始化 Firebase Admin SDK 和網頁 SDK

Firebase App Hosting 等 Google 環境會在建構時間和執行階段，透過無參數建構函式呼叫提供簡化的應用程式初始化功能。這項功能同時適用於 Firebase Admin SDK for Node.js 和 Firebase JavaScript SDK，前者是伺服器端 SDK，可解鎖大量 Firebase 功能，在您的網頁應用程式中非常實用。

使用 initializeApp() 時，您可以讓 Firebase App Hosting 自動為您填入網頁應用程式設定，同時保留選項，以便在您想要覆寫預設值時，精細控制特定值。

不使用引數進行初始化

如要使用預設設定值初始化 Firebase JavaScript SDK 或 Firebase Admin SDK，請使用 initializeApp()，但不提供任何引數：

Admin SDK

import { initializeApp } from 'firebase-admin/app';
const app = initializeApp();

JavaScript SDK

import { initializeApp } from 'firebase/app';
const app = initializeApp();

這項 Admin SDK 初始化策略適用於 App Hosting 和其他 Google 伺服器環境，包括 Cloud Run、App Engine 和 Cloud Functions。對於 JavaScript SDK，這項策略適用於 App Hosting。

覆寫自動填入的值

您可以覆寫自動插入的預設設定。請注意，這些選項在 Admin SDK 和 JavaScript SDK 之間有所不同。

Admin SDK 覆寫

如要選擇為 Realtime Database、Cloud Storage 或 Cloud Functions 等服務指定自訂初始化選項，請使用 FIREBASE_CONFIG 環境變數。如果 FIREBASE_CONFIG 變數的內容以 { 字元開頭，系統會將其剖析為 JSON 物件。否則 SDK 會假設字串是包含選項的 JSON 檔案路徑。

# apphosting.yaml

env:
  - variable: FIREBASE_CONFIG
    value: '{"credential: applicationDefault()","databaseURL":"https://project-id-default-rtdb.firebaseio.com"}'

JavaScript SDK 覆寫

如要覆寫 App Hosting 為 JavaScript SDK 初始化作業所插入的預設 FIREBASE_WEBAPP_CONFIG 值，您可以在 apphosting.yaml 中指定值：

# apphosting.yaml

env:
  - variable: FIREBASE_WEBAPP_CONFIG
    value: '{"apiKey":"myApiKey","appId":"app:123","authDomain":"project-id.firebaseapp.com","databaseURL":"https://project-id-default-rtdb.firebaseio.com","messagingSenderId":"0123456789","projectId":"project-id","storageBucket":"project-id.firebasestorage.app"}'

在其他環境中使用自動初始化

安裝 Firebase JavaScript SDK 時，系統會使用 npm 安裝後指令碼設定自動初始化功能。安裝後指令碼會尋找環境變數 FIREBASE_WEBAPP_CONFIG，該變數會在 App Hosting Cloud Build 環境中自動設定。

如果您要在 Cloud Build 外部安裝 JS SDK，例如在本機安裝 Firebase Emulator Suite，則在安裝 Firebase JavaScript SDK 時，您必須自行設定這個環境變數。

如要在安裝時手動設定環境，請按照下列步驟操作：

從 Firebase 主控台複製 Firebase 網頁應用程式設定物件。
請在終端機中設定 FIREBASE_WEBAPP_CONFIG 環境變數，再執行 npm install 指令。

FIREBASE_WEBAPP_CONFIG="{...}" npm install firebase

每次變更 Firebase 專案或網頁應用程式時，請重新執行這項指令。

使用 `FirebaseServerApp` 進行 SSR

如果您在開發網頁應用程式時使用 Firebase JS SDK 或其他 Firebase 用戶端 SDK，可能就熟悉 FirebaseApp 介面，也知道如何使用該介面設定應用程式執行個體。為了在伺服器端執行類似的作業，Firebase 提供 FirebaseServerApp。

FirebaseServerApp 是 FirebaseApp 的變體，可用於伺服器端算繪 (SSR) 環境。其中包含用於繼續跨越用戶端轉譯 (CSR) / 伺服器端轉譯 (SSR) 分隔的 Firebase 工作階段的工具。

FirebaseServerApp 可用於：

在「使用者」內容中執行伺服器端程式碼，與擁有完整管理權限的 Firebase Admin SDK 不同。
允許在 SSR 環境中使用 App Check。
繼續在用戶端建立的 Firebase 認證工作階段。

如要進一步瞭解如何將 FirebaseServerApp 用於這些用途，請參閱「在使用 SSR 的動態網頁應用程式中使用 Firebase」。

在網頁應用程式中啟用 App Check

您可以使用 App Check 強化 App Hosting 上動態網頁應用程式的安全性。您可以實作「在動態網頁應用程式中使用 Firebase 並搭配 SSR」一文中所述的部分伺服器端策略，保護 App Hosting 後端免受濫用行為侵擾。