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 sự linh hoạt tối đa, Firebase Remote Config hỗ trợ cả việc 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ủ: Máy chủ 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 ứng dụng 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 giú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 thiết lập kết xuất phía máy chủ.

Thiết lập tính năng kết xuất 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 máy 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 RemoteConfigFetchResponse lớp chấp nhận ServerConfig hiện có. Bạn có thể sử dụng lớp này để tuần tự hoá các giá trị cấu hình có thể được truyền đến máy khách.


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 máy khách

Trên ứng dụng máy khách (triển khai SDK JavaScript của Firebase), hãy thêm một tuỳ chọn cấu hình initialFetchResponse để chấp nhận các giá trị đã chuyển đổi tuần tự được truyền từ ứng dụng máy chủ. Tuỳ chọn 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 tuỳ chọn khởi chạy cho phép bạn đặt firebase-server làm templateId trên SDK máy khách. Tuỳ chọn 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 tham số và giá trị có điều kiện nhất quán giữa máy khách 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>
  );
}