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

自訂驗證依附元件

Firebase JS SDK 模組化設計，能讓您進一步掌控建構應用程式的方法讓您根據自身需求自訂依附元件並去除加以隱藏

初始化驗證程式庫的方式有兩種：getAuth() 函式和 initializeAuth() 函式。第一個是 getAuth()，提供所有元素才能利用驗證程式庫的所有功能。不同之處缺點是它會提取大量程式碼未使用的資源使用者也可能插入 Pod 上直接不支援的程式碼就會發生錯誤如要避免這類問題，您可以使用 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 的做法就夠了 (因為沒有使用網路 Service Worker 指令碼)，您可以透過初始化驗證來減少大量程式碼輸入：

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 環境。但有時候需要您的應用程式與這樣的假設衝突適用於網路和服務工作站指令碼，例如預設的 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
});

這個程式碼會指示 Auth 使用 indexedDB 持續性 (也就是且省略了 popupRedirectResolver 依附元件。假設有 DOM 情境可用

您可能會基於其他原因，手動定義某些依附元件的依附元件平台。只要在驗證初始化中定義 popupRedirectResolver 欄位，在某些情況下，程式庫會對初始化執行額外的工作。啟用行動瀏覽器，程式庫會自動在驗證中開啟 iframe 預先停用整個網域這麼做是為了讓大多數使用者享有流暢的使用體驗但會在執行此動作後立即載入其他程式碼，進而影響效能應用程式啟動後如要避免這種行為，您可以使用 initializeAuth() 和手動將 browserPopupRedirectResolver 依附元件傳遞至函式需要的 Pod：

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);

如果在依附元件中提供 browserPopupRedirectResolver initializeAuth()，呼叫 signInWithRedirect() 的第三個參數不需要放送但只要將依附元件移至直接 signInWithRedirect()，首次獲得的成效命中移除初始化作業。遷移但重要的是，您能夠決定哪些因素可以手動初始化程式庫來權衡利弊

使用自訂初始化的時機

讓我們複習一下，自訂初始化功能可讓您進一步掌控應用程式的 Auth SDK 的用法標準 getAuth() 函式很適合用來取得適用於大多數用途在大多數應用程式中，getAuth() 可能全都是你的身分需求。您可能會因為許多原因而希望 (或需要) 改用手動依附元件管理：

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