SSR (Sunucu Tarafında Oluşturma) ile dinamik web uygulamalarında Firebase'i kullanma

Firebase JS SDK'sı veya diğer Firebase istemci SDK'larıyla çalıştıysanız muhtemelen FirebaseApp arayüzüne ve uygulama örneklerini yapılandırmak için bu arayüzü nasıl kullanacağınıza aşinasınızdır. Firebase, sunucu tarafında benzer işlemleri kolaylaştırmak için FirebaseServerApp sağlar.

FirebaseServerApp, sunucu tarafı oluşturma (SSR) ortamlarında kullanılmak üzere FirebaseApp'un bir varyantıdır. İstemci tarafı oluşturma (CSR) / sunucu tarafı oluşturma ayrımına yayılan Firebase oturumlarına devam etme araçlarını içerir. Bu araçlar ve stratejiler, Firebase ile oluşturulan ve Firebase App Hosting gibi Google ortamlarında dağıtılan dinamik web uygulamalarını iyileştirmeye yardımcı olabilir.

FirebaseServerApp ile yapabilecekleriniz:

  • Tam yönetim haklarına sahip Firebase Admin SDK'sının aksine, sunucu tarafı kodunu kullanıcı bağlamında yürütür.
  • SSR ortamlarında Uygulama Kontrolü'nün kullanımını etkinleştirin.
  • İstemcide oluşturulan bir Firebase Auth oturumuna devam edin.

FirebaseServerApp yaşam döngüsü

Sunucu tarafı oluşturma (SSR) çerçeveleri ve bulut çalışanları gibi tarayıcı dışındaki diğer çalışma ortamları, kaynakları birden fazla yürütme işleminde yeniden kullanarak başlatma süresini optimize eder. FirebaseServerApp, referans sayımı mekanizması kullanarak bu ortamlara uyum sağlayacak şekilde tasarlanmıştır. Bir uygulama, önceki initializeServerApp ile aynı parametrelerle initializeServerApp çağırırsa önceden başlatılmış olan FirebaseServerApp örneğini alır. Bu sayede gereksiz başlatma yükü ve bellek ayırma işlemleri azaltılır. deleteApp, bir FirebaseServerApp örneğinde çağrıldığında referans sayısını azaltır ve referans sayısı sıfıra ulaştıktan sonra örnek serbest bırakılır.

FirebaseServerApp örneklerini temizleme

Özellikle paralel olarak birçok asynkron işlem çalıştırıyorsanız bir FirebaseServerApp örneğinde deleteApp işlevini ne zaman çağıracağınızı bilmek zor olabilir. FirebaseServerAppSettings öğesinin releaseOnDeref alanı bu işlemi basitleştirmeye yardımcı olur. releaseOnDeref'ye, isteğin kapsamının yaşam süresine sahip bir nesneye referans atarsanız (örneğin, SSR isteğinin headers nesnesi) çerçeve, başlık nesnesini yeniden talep ettiğinde FirebaseServerApp referans sayısını azaltır. Bu işlem, FirebaseServerApp örneğinizi otomatik olarak temizler.

releaseOnDeref'ün kullanıldığı bir örneği aşağıda bulabilirsiniz:

/// Next.js
import { headers } from 'next/headers'
import { FirebaseServerAppSettings, initializeServerApp} from "@firebase/app";

export default async function Page() {
  const headersObj = await headers();
  appSettings.releaseOnDeref = headersObj;
  let appSettings: FirebaseServerAppSettings = {};
  const serverApp = initializeServerApp(firebaseConfig, appSettings);
  ...
}

İstemcide oluşturulan kimliği doğrulanmış oturumları devam ettirme

Bir FirebaseServerApp örneği, Auth ID jetonuyla başlatıldığında, kimliği doğrulanmış kullanıcı oturumlarının istemci tarafı oluşturma (CSR) ve sunucu tarafı oluşturma (SSR) ortamları arasında köprülenmesini sağlar. Auth kimlik jetonu içeren bir FirebaseServerApp nesnesi ile başlatılan Firebase Auth SDK örnekleri, uygulamanın herhangi bir oturum açma yöntemi çağırmasına gerek kalmadan, başlatılırken kullanıcının oturumunu açmaya çalışır.

Kimlik doğrulama kimliği jetonu sağlamak, uygulamaların istemcide kimlik doğrulama yöntemlerinden herhangi birini kullanmasına olanak tanır. Böylece, kullanıcı etkileşimi gerektiren kimlik doğrulama yöntemlerinde bile oturumun sunucu tarafında devam etmesini sağlar. Ayrıca, kimliği doğrulanmış Firestore sorguları gibi yoğun işlemlerin sunucuya aktarılmasını sağlar. Bu da uygulamanızın oluşturma performansını artırabilir.

/// Next.js
import { initializeServerApp } from "firebase/app";
import { getAuth } from "firebase/auth";

// Replace the following with your app's
// Firebase project configuration
const firebaseConfig = {
  // ...
};

const firebaseServerAppSettings = {
  authIdToken: token  // See "Pass client tokens to the server side
                      // rendering phase" for an example on how transmit
                      // the token from the client and the server.
}

const serverApp =
  initializeServerApp(firebaseConfig,
                      firebaseServerAppSettings);
const serverAuth = getAuth(serverApp);

// FirebaseServerApp and Auth will now attempt
// to sign in the current user based on provided
// authIdToken.

SSR ortamlarında App Check'i kullanma

Uygulama Kontrolü yaptırımı, Firebase SDK'larının getToken'ü dahili olarak çağırmak için kullandığı bir Uygulama Kontrolü SDK'sı örneğine dayanır. Elde edilen jeton daha sonra tüm Firebase hizmetlerine gönderilen isteklere dahil edilir. Bu sayede arka uç, uygulamayı doğrulayabilir.

Ancak App Check SDK'nın, uygulama doğrulaması için belirli sezgisel yöntemlere erişmek üzere bir tarayıcıya ihtiyacı olduğundan sunucu ortamlarında başlatılamaz.

FirebaseServerApp alternatif sunuyor. FirebaseServerApp başlatma sırasında istemci tarafından oluşturulan bir Uygulama Kontrolü jetonu sağlanırsa bu jeton, Firebase hizmetlerini çağırırken Firebase ürün SDK'ları tarafından kullanılır. Böylece, bir Uygulama Kontrolü SDK örneğine ihtiyaç duyulmaz.

/// Next.js
import { initializeServerApp } from "firebase/app";

// Replace the following with your app's
// Firebase project configuration
const firebaseConfig = {
  // ...
};

const firebaseServerAppSettings = {
  appCheckToken: token // See "Pass client tokens to the server side
                       // rendering phase" for an example on how transmit
                       // the token from the client and the server.
}

const serverApp =
  initializeServerApp(firebaseConfig,
                      firebaseServerAppSettings);

// The App Check token will now be appended to all Firebase service requests.

İstemci jetonlarını sunucu tarafı oluşturma aşamasına iletme

Kimliği doğrulanmış kimlik doğrulama kimliği jetonlarını (ve uygulama kontrolü jetonlarını) istemciden sunucu tarafı oluşturma (SSR) aşamasına aktarmak için bir hizmet çalışanı kullanın. Bu yaklaşım, SSR'yi tetikleyen getirme isteklerini durdurmayı ve jetonları istek başlıklarına eklemeyi içerir.

Firebase Auth hizmet çalışanının referans uygulaması için Hizmet çalışanlarıyla oturum yönetimi başlıklı makaleyi inceleyin. FirebaseServerApp başlatma işleminde kullanılmak üzere bu jetonların başlıklardan nasıl ayrıştırılacağını gösteren kod için Sunucu tarafı değişiklikleri bölümüne de bakın.