本頁面由 Cloud Translation API 翻譯而成。

自訂驗證依附元件

Firebase JS SDK 的模組化設計可讓您進一步掌控應用程式的建構方式。這種靈活性可讓您捨棄不需要的功能，依據自己的平台自訂依附元件，並盡可能最佳化套件大小。

初始化驗證程式庫的方式有兩種：getAuth() 函式和 initializeAuth() 函式。首先，getAuth() 提供應用程式需要的所有功能，以便利用驗證程式庫提供的所有功能。但缺點是會擷取許多可能用於應用程式的程式碼，也可能提取目標平台不支援的程式碼，進而引發錯誤。如要避免發生這些問題，您可以採用會取得依附元件對應項目的 initializeAuth()。getAuth() 函式只會呼叫含有所有指定依附元件的 initializeAuth()。為說明，以下與瀏覽器環境上等同於 getAuth() 的功能：

import {initializeAuth, browserLocalPersistence, browserPopupRedirectResolver, browserSessionPersistence, indexedDBLocalPersistence} from "firebase/auth";
import {initializeApp} from "firebase/app";

const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
  persistence: [indexedDBLocalPersistence, browserLocalPersistence, browserSessionPersistence],
  popupRedirectResolver: browserPopupRedirectResolver,
});

自訂依附元件

並非所有應用程式都會使用 signInWithPopup 或 signInWithRedirect 函式系列。許多應用程式不需要使用 indexedDB 提供的彈性，或者不需要同時支援 indexedDB 和 localStorage 的功能。在這類情況下，預設的 getAuth() 包含許多未使用的程式碼，會以無理由增加套件大小。而是可以調整其依附元件。舉例來說，如果您的應用程式只使用電子郵件連結驗證和 localStorage 就夠了 (因為您沒有使用網路或服務工作站指令碼)，您可以透過初始化 Auth 來減少大量程式碼，如下所示：

import {initializeAuth, browserLocalPersistence} from "firebase/auth";
import {initializeApp} from "firebase/app";

const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
  persistence: browserLocalPersistence,
  // No popupRedirectResolver defined
});

透過這段程式碼，您已移除應用程式不需要的三個大型依附元件，可大幅減少使用者每次造訪您的網站時使用的頻寬量。

特定平台注意事項

在許多情況下，您必須手動定義驗證依附元件，才能避免初始化錯誤。getAuth() 函式會假設使用特定平台。預設的進入點為瀏覽器環境，而以科爾多瓦進入點來說，也就是 Cordova 環境。但有時候，特定應用程式的需求會與這些假設互相衝突。例如，對於網路和 Service Worker 指令碼，預設的 getAuth() 實作會提取從 window 物件讀取的程式碼，而這會造成錯誤。在這些情況下，您必須自訂依附元件。以下程式碼適用於在 Service Worker 環境中初始化驗證程式庫：

import {initializeAuth, indexedDBLocalPersistence} from "firebase/auth";
import {initializeApp} from "firebase/app";

const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
  persistence: indexedDBLocalPersistence,
  // No popupRedirectResolver defined
});

這個程式碼會指示驗證，以 indexedDB 持續性 (可在工作站結構定義中使用) 進行初始化，並省略 popupRedirectResolver 依附元件 (假設有 DOM 情境可用)。

還有其他原因可能會是您可能會在特定平台上手動定義依附元件。在驗證初始化中定義 popupRedirectResolver 欄位，在某些情況下，程式庫會在初始化時執行其他工作。在行動瀏覽器上，程式庫會自動開啟 iframe 並帶入您的驗證網域。這麼一來，多數使用者就能享有順暢的使用體驗，但也可能在應用程式啟動時立即載入額外程式碼，進而影響效能。如要避免這個行為，您可以利用 initializeAuth()，並手動將 browserPopupRedirectResolver 依附元件傳遞至需要該依附元件的函式：

import {initializeAuth, browserLocalPersistence, browserPopupRedirectResolver, indexedDBLocalPersistence, signInWithRedirect, GoogleAuthProvider} from "firebase/auth";
import {initializeApp} from "firebase/app";

const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
  persistence: [indexedDBLocalPersistence, browserLocalPersistence],
});

// Later
signInWithRedirect(auth, new GoogleAuthProvider(), browserPopupRedirectResolver);

如果已在 initializeAuth() 的依附元件中提供 browserPopupRedirectResolver，就不需要在 signInWithRedirect() 呼叫中的第三個參數。但只要將該依附元件直接移至對 signInWithRedirect() 的呼叫，系統就會移除初始化期間的初始效能命中。移動依附元件會有所取捨，但重要的是，您能夠透過手動初始化程式庫的方式，決定這些優缺點。

使用自訂初始化的時機

總結來說，自訂初始化可讓您進一步掌控應用程式的 Auth SDK 用量。標準 getAuth() 函式適用於入門和大多數用途。對大多數應用程式而言，getAuth() 可能就足夠了。但是，您可能會基於許多原因而想要 (或需要) 改用手動依附元件管理：

如果應用程式套件的大小和載入時間極為重要，自訂驗證初始化功能可能會縮減許多 KB 的資料。將依附元件移至使用的時間 (而非初始化時間)，藉此縮短「初始」載入時間。
如果程式碼是在非 DOM 環境 (例如網路和 Service Worker) 中執行，則必須使用 initializeAuth() 來避免錯誤。