Sử dụng Cấu hình từ xa để hiển thị phía máy chủ trong ứng dụng web

Để mang lại tính linh hoạt tối đa, Firebase Remote Config hỗ trợ cả hoạt động tích hợp SDK phía máy khách và phía máy chủ cho các ứng dụng web. Điều này có nghĩa là ứng dụng của bạn có thể:

  • Tìm nạp và đánh giá các mẫu Remote Config trên máy chủ của bạn: Máy chủ của bạn có thể tải mẫu Remote Config xuống và đánh giá trực tiếp các điều kiện nhắm mục tiêu.
  • Tối ưu hoá hiệu suất tải trang ban đầu: Đối với các trường hợp kết xuất phía máy chủ, máy chủ có thể cung cấp cấu hình đã đánh giá cho máy khách trong quá trình tải trang ban đầu. Điều này giúp cải thiện hiệu suất bằng cách cung cấp trước dữ liệu cấu hình cần thiết.

Phương pháp này cho phép bạn quản lý hành vi và cấu hình của ứng dụng một cách linh hoạt, đặc biệt là trong các chế độ thiết lập kết xuất phía máy chủ.

Thiết lập tính năng hiển thị phía máy chủ cho ứng dụng

Để định cấu hình tính năng kết xuất phía máy chủ bằng Remote Config trong ứng dụng web, hãy cập nhật ứng dụng khách và ứng dụng máy chủ theo các bước sau.

Bước 1: Cập nhật ứng dụng phía máy chủ

Trong ứng dụng máy chủ, nơi bạn triển khai Firebase Admin Node.js SDK, hãy thêm một lớp RemoteConfigFetchResponse chấp nhận ServerConfig hiện có. Bạn có thể sử dụng phương thức này để chuyển đổi tuần tự các giá trị cấu hình có thể được truyền đến ứng dụng của bạn.


export default async function MyServerComponent() {
  const serverApp = initializeApp();
  const serverSideConfig = getRemoteConfig(serverApp);
  const template = await serverSideConfig.getServerTemplate();
  const config = template.evaluate({randomizationId: 'some-uuid'});
  const fetchResponse = new RemoteConfigFetchResponse(serverApp, config);

  return (
    <div>
      <MyClientComponent initialFetchResponse={fetchResponse}></MyClientComponent>
    </div>
  );
}

Bước 2: Cập nhật ứng dụng khách

Trên ứng dụng khách của bạn (triển khai Firebase Javascript SDK), hãy thêm một lựa chọn cấu hình initialFetchResponse để chấp nhận các giá trị được chuyển đổi tuần tự được truyền từ ứng dụng máy chủ. Thao tác này sẽ tự động điền trạng thái cấu hình mà không cần thực hiện yêu cầu tìm nạp không đồng bộ.

Ngoài ra, bạn phải thêm một lựa chọn khởi chạy cho phép bạn đặt firebase-server làm templateId trên SDK ứng dụng. Thao tác này định cấu hình SDK để sử dụng mẫu phía máy chủ ban đầu cho các lần tìm nạp tiếp theo, đảm bảo các thông số và giá trị có điều kiện nhất quán giữa ứng dụng và máy chủ.


export default function MyClientComponent({initialFetchResponse= ''} = {}) {
  const app = initializeApp(firebaseConfig);
  const config = getRemoteConfig(app, {
        templateId: 'firebase-server',
        initialFetchResponse
  });
  const paramValue = getString(config, 'my_rc_parameter_key');

  return (
    <div>{paramValue}</div>
  );
}