Korzystanie z Zdalnej konfiguracji do renderowania po stronie serwera w aplikacji internetowej

Aby zapewnić maksymalną elastyczność, Firebase Remote Config obsługuje integrację pakietów SDK po stronie klienta i po stronie serwera w przypadku aplikacji internetowych. Oznacza to, że Twoja aplikacja może:

  • Pobieranie i ocenianie szablonów Remote Config na serwerze: serwer może pobrać szablon Remote Config i bezpośrednio ocenić warunki kierowania.
  • Optymalizacja wydajności wstępnego wczytywania strony: w przypadku renderowania po stronie serwera serwer może przekazywać klientowi ocenioną konfigurację podczas wstępnego wczytywania strony. Zwiększa to wydajność, ponieważ niezbędne dane konfiguracyjne są dostarczane z wyprzedzeniem.

Dzięki temu możesz dynamicznie zarządzać działaniem i konfiguracją aplikacji, zwłaszcza w przypadku renderowania po stronie serwera.

Konfigurowanie renderowania po stronie serwera w aplikacjach

Aby skonfigurować renderowanie po stronie serwera za pomocą Remote Config w aplikacji internetowej, zaktualizuj aplikacje klienta i serwera, wykonując te czynności.

Krok 1. Zaktualizuj aplikację po stronie serwera

W aplikacji serwera, w której wdrożono pakiet Firebase Admin Node.js SDK, umieść klasę RemoteConfigFetchResponse, która akceptuje istniejący element ServerConfig. Możesz użyć tej funkcji do serializacji wartości konfiguracji, które można przekazywać do klienta.


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

Krok 2. Zaktualizuj aplikację klienta

W aplikacji klienckiej, która implementuje pakiet Firebase Javascript SDK, uwzględnij opcję konfiguracji initialFetchResponse, aby akceptować serializowane wartościinitialFetchResponse przekazywane z aplikacji serwera. Ta opcja ręcznie uzupełnia stan konfiguracji bez wysyłania asynchronicznego żądania pobierania.

Musisz też uwzględnić opcję inicjowania, która umożliwia ustawienie firebase-server jako templateId w pakiecie SDK klienta. Dzięki temu pakiet SDK będzie używać początkowego szablonu po stronie serwera do kolejnych pobrań, co zapewni spójność parametrów i wartości warunkowych między klientem a serwerem.


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