使用遠端設定在網路應用程式中進行伺服器端轉譯

為提供最大彈性，Firebase Remote Config 支援網頁應用程式的用戶端和伺服器端 SDK 整合。這表示您的應用程式可以：

  • 在伺服器上擷取及評估 Remote Config 範本：伺服器可以直接下載 Remote Config 範本，並評估指定目標條件。
  • 提升初次載入網頁的速度：在伺服器端算繪情境中，伺服器可在初次載入網頁時，將評估後的設定提供給用戶端。這樣做可預先提供必要的設定資料，進而提升效能。

這個方法可讓您動態管理應用程式的行為和設定，特別是在伺服器端算繪設定中。

為應用程式設定伺服器端轉譯

如要在網頁應用程式中透過 Remote Config 設定伺服器端算繪，請按照下列步驟更新用戶端和伺服器應用程式。

步驟 1：更新伺服器端應用程式

在您導入 Firebase Admin Node.js SDK 的伺服器應用程式中，加入可接受現有 RemoteConfigFetchResponse 的 ServerConfig 類別。您可以使用這個方法，將可傳遞至用戶端的設定值序列化。


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

步驟 2：更新用戶端應用程式

在實作 Firebase JavaScript SDK 的用戶端應用程式中，加入 initialFetchResponse 設定選項，接受從伺服器應用程式傳遞的序列化值。這樣一來，系統就會手動補水設定狀態，不必發出非同步擷取要求。

此外，您必須加入初始化選項，以便在用戶端 SDK 上將 firebase-server 設為 templateId。這會設定 SDK，以便在後續擷取作業中使用初始伺服器端範本，確保用戶端和伺服器之間的參數和條件值一致。


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