Kimlik Doğrulama Bağımlılıklarınızı özelleştirin

Firebase JS SDK'nın modüler tasarımı, en iyi uygulamaları paylaşacağız. Bu esneklik sayesinde bağımlılıklarınızı ve paketinizin boyutunu optimize etmek için kullanabileceğiniz kullanın.

Auth kitaplığını başlatmanın iki yolu vardır: getAuth() işlevi ve initializeAuth() işlevi. İlki olan getAuth(), her şeyi ve uygulamanızın, Auth kitaplığının tüm özelliklerinden yararlanması için ihtiyaç duyduğu çok iyi olur. Dezavantajı ise potansiyel olarak yüksek miktarda kod çekmesidir. veya uygulama tarafından kullanılamaz. Ayrıca, JavaScript'te desteklenmeyen bir kodu da hatalara neden olabilir. Bu sorunlardan kaçınmak için bağımlılık haritası içeren initializeAuth() kullanın. getAuth() işlevi, belirtilen tüm bağımlılıklarla birlikte initializeAuth() yöntemini çağırır. Örnek olarak, tarayıcı ortamlarında getAuth() işlevinin eşdeğeri şu şekildedir:

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

Bağımlılıklarınızı uyarlama

Tüm uygulamalar signInWithPopup veya signInWithRedirect ailesini kullanmaz işlevlerine dahildir. Birçok uygulama, indexedDB tarafından sağlanan esnekliğe ihtiyaç duymaz veya hem indexedDB hem de localStorage destekleme kabiliyetine sahip değildir. kullanılamaz. Bu durumlarda, varsayılan getAuth() birçok nedensiz şekilde paket boyutunu büyüten, kullanılmayan kod. Bunun yerine bu uygulamalar ve bağımlılıklarını onlara göre uyarlayabilirsiniz. Örneğin, uygulamanız yalnızca e-posta bağlantısı kullanıyorsa kimlik doğrulaması ve localStorage yeterlidir (çünkü web veya hizmet çalışanı komut dosyaları), Auth'u ilk kez çalıştırarak aşağıdaki gibidir:

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

Bu kodla, uygulamanızın sunmadığı üç büyük bağımlılığı kaldırmış kullanıcılarınızın her zaman kullandıkları bant genişliği miktarını önemli ölçüde sitenizi ziyaret eder.

Platforma özgü dikkat edilmesi gereken noktalar

Birçok durumda ilk kullanıma hazırlama sırasında hata oluşmasını önler. getAuth() işlevi, belirli bir değerin platformu. Varsayılan giriş noktası için bu bir tarayıcı ortamıdır ve Cordova giriş noktası, bu Cordova ortamı. Ama bazen insanların varsayımlarla örtüştüğünden emin olun. Web ve hizmet için çalışan komut dosyaları. Örneğin, varsayılan getAuth() uygulaması window nesnesinden okuyan ve hatalara neden olan bir kod oluşturur. O bağımlılıklarınızı uyarlamanız gerekir. Aşağıdaki kod Auth kitaplığını Service Worker bağlamında başlatmak için uygun olduğunu unutmayın:

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

Bu kod, Auth'a indexedDB kalıcılığıyla (yani çalışan bağlamlarında kullanılabilir) ve popupRedirectResolver bağımlılığını atlar. bir DOM bağlamının mevcut olduğunu varsayar.

Bazı rollerde bağımlılıkları manuel olarak tanımlamanızın da platformlar. Yetkilendirme başlatmada popupRedirectResolver alanını tanımlayarak, Bazı durumlarda kitaplık başlatma sırasında ek işlemler gerçekleştirir. Şu tarihte: mobil tarayıcılarda otomatik olarak bir iframe açarak Auth bir önlem olarak alır. Bu sayede, çoğu kullanıcı için sorunsuz bir deneyim vardır, ancak reklam öğesi oluşturulduğunda ek kod yükleyerek performansı etkileyebilir. emin olun. initializeAuth() ve kontrol mekanizmaları kullanarak bu davranıştan kaçınabilirsiniz. browserPopupRedirectResolver bağımlılığını işlevlere manuel olarak iletme bilgilere ihtiyacınız vardır:

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

Bağımlılıklarda browserPopupRedirectResolver initializeAuth(), signInWithRedirect() çağrısındaki üçüncü parametre gerekmeyecekti. Ama bu bağımlılığı doğrudan signInWithRedirect(), ilk kullanıma hazırlama kaldırıldı. Bazı durumlarda web sitenizin ama önemli olan nokta, bu bağımlılıkları ya da riskleri azaltmak için kitaplığı manuel olarak başlatarak bu dengeleri sağlayabilirsiniz.

Özel başlatma ne zaman kullanılır?

Özetle, özel başlatma, uygulamanızın ayarları üzerinde çok daha fazla kontrol kullanımı. Standart getAuth() işlevi, birçok kullanım alanına hizmet eder. Çoğu uygulamada getAuth() sizin yerinize gerekiyor. Ancak, manuel ödeme yöntemine geçiş yapmayı istemenizin (veya buna ihtiyaç duymanızın) birçok nedeni vardır: Bağımlılık Yönetimi:

• Paket boyutunun ve yükleme sürelerinin son derece önemli olduğu uygulamalar için özel Kimlik doğrulama başlatma birçok kilobayt veriyi azaltabilir. Google Ayrıca bağımlılıkları yeni bir yazılımın oluşturulma süresine geçirerek ilk yükleme sürelerini kullanıma hazır hale getirir.
• DOM dışı bağlamlarda (ör. web ve hizmet çalışanları) çalışan kodlar için: Hataları önlemek için initializeAuth() kullanılmalıdır.