Sử dụng Firebase trong các ứng dụng web động có SSR (Hiển thị phía máy chủ)

Nếu đã từng làm việc với Firebase JS SDK hoặc các Firebase SDK khác cho ứng dụng, có lẽ bạn đã quen thuộc với giao diện FirebaseApp và cách sử dụng giao diện này để định cấu hình các phiên bản ứng dụng. Để hỗ trợ các thao tác tương tự ở phía máy chủ, Firebase cung cấp FirebaseServerApp.

FirebaseServerApp là một biến thể của FirebaseApp để sử dụng trong môi trường kết xuất phía máy chủ (SSR). SDK này bao gồm các công cụ để tiếp tục các phiên Firebase trải rộng trên quá trình kết xuất phía máy khách (CSR) / phân chia kết xuất phía máy chủ. Những công cụ và chiến lược này có thể giúp nâng cao các ứng dụng web động được xây dựng bằng Firebase và triển khai trong các môi trường của Google như Firebase App Hosting.

Sử dụng FirebaseServerApp để:

  • Thực thi mã phía máy chủ trong ngữ cảnh người dùng, khác với Firebase Admin SDK có toàn quyền quản trị.
  • Cho phép sử dụng App Check trong môi trường SSR.
  • Tiếp tục một phiên xác thực Firebase được tạo trong ứng dụng.

Vòng đời FirebaseServerApp

Các khung kết xuất phía máy chủ (SSR) và các thời gian chạy không phải trình duyệt khác (chẳng hạn như trình chạy đám mây) tối ưu hoá thời gian khởi tạo bằng cách sử dụng lại các tài nguyên trên nhiều lần thực thi. FirebaseServerApp được thiết kế để phù hợp với những môi trường này bằng cách sử dụng cơ chế đếm số lượt tham chiếu. Nếu một ứng dụng gọi initializeServerApp bằng các tham số giống như initializeServerApp trước đó, thì ứng dụng đó sẽ nhận được cùng một thực thể FirebaseServerApp đã được khởi chạy. Điều này giúp giảm mức hao tổn khi khởi tạo và phân bổ bộ nhớ không cần thiết. Khi deleteApp được gọi trên một thực thể FirebaseServerApp, nó sẽ giảm số lượt tham chiếu và thực thể sẽ được giải phóng sau khi số lượt tham chiếu đạt đến 0.

Dọn dẹp các phiên bản FirebaseServerApp

Bạn có thể gặp khó khăn khi biết thời điểm gọi deleteApp trên một thực thể FirebaseServerApp, đặc biệt nếu bạn đang chạy nhiều thao tác không đồng bộ song song. Trường releaseOnDeref của FirebaseServerAppSettings giúp đơn giản hoá việc này. Nếu bạn chỉ định releaseOnDeref một thông tin tham chiếu đến một đối tượng có thời gian tồn tại trong phạm vi yêu cầu (ví dụ: đối tượng tiêu đề của yêu cầu SSR), thì FirebaseServerApp sẽ giảm số lượng thông tin tham chiếu khi khung hình thu hồi đối tượng tiêu đề. Thao tác này sẽ tự động dọn dẹp phiên bản FirebaseServerApp của bạn.

Sau đây là một ví dụ về cách sử dụng releaseOnDeref:

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

Tiếp tục các phiên đã xác thực được tạo trên ứng dụng

Khi một phiên bản của FirebaseServerApp được khởi tạo bằng mã thông báo Auth ID, phiên bản này sẽ cho phép kết nối các phiên người dùng đã xác thực giữa môi trường kết xuất phía máy khách (CSR) và môi trường kết xuất phía máy chủ (SSR). Các phiên bản của Firebase Auth SDK được khởi chạy bằng một đối tượng FirebaseServerApp chứa mã thông báo Auth ID sẽ cố gắng đăng nhập người dùng khi khởi chạy mà không cần ứng dụng gọi bất kỳ phương thức đăng nhập nào.

Việc cung cấp mã thông báo Auth ID cho phép các ứng dụng sử dụng mọi phương thức đăng nhập của Auth trên máy khách, đảm bảo rằng phiên hoạt động tiếp tục ở phía máy chủ, ngay cả đối với những phương thức đăng nhập yêu cầu người dùng tương tác. Ngoài ra, tính năng này cho phép chuyển các thao tác chuyên sâu sang máy chủ, chẳng hạn như các truy vấn Firestore đã xác thực. Điều này sẽ giúp cải thiện hiệu suất kết xuất của ứng dụng.

/// 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.

Sử dụng App Check trong môi trường SSR

Việc thực thi tính năng Kiểm tra ứng dụng dựa trên một phiên bản SDK Kiểm tra ứng dụng mà Firebase SDK sử dụng để gọi nội bộ getToken. Sau đó, mã thông báo nhận được sẽ được đưa vào các yêu cầu gửi đến tất cả dịch vụ Firebase, cho phép giao diện người dùng xác thực ứng dụng.

Tuy nhiên, vì App Check SDK cần một trình duyệt để truy cập vào các phương pháp phỏng đoán cụ thể cho quy trình xác thực ứng dụng, nên SDK này không thể được khởi chạy trong môi trường máy chủ.

FirebaseServerApp cung cấp một lựa chọn thay thế. Nếu mã thông báo App Check do máy khách tạo được cung cấp trong quá trình khởi chạy FirebaseServerApp, thì mã thông báo đó sẽ được các SDK sản phẩm của Firebase sử dụng khi gọi các dịch vụ của Firebase, giúp bạn không cần đến một phiên bản App Check SDK.

/// 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.

Truyền mã thông báo của ứng dụng đến giai đoạn hiển thị phía máy chủ

Để truyền mã thông báo Auth ID (và mã thông báo App Check) đã xác thực từ ứng dụng đến giai đoạn kết xuất phía máy chủ (SSR), hãy sử dụng một worker dịch vụ. Phương pháp này liên quan đến việc chặn các yêu cầu tìm nạp kích hoạt SSR và nối các mã thông báo vào tiêu đề yêu cầu.

Hãy tham khảo Quản lý phiên bằng các worker dịch vụ để biết thông tin về cách triển khai tham chiếu của một worker dịch vụ Xác thực Firebase. Bạn cũng có thể xem Các thay đổi phía máy chủ để biết mã minh hoạ cách phân tích cú pháp các mã thông báo này từ tiêu đề để sử dụng trong quá trình khởi tạo FirebaseServerApp.