Remote Config für serverseitiges Rendering in Webanwendungen verwenden

Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Für maximale Flexibilität unterstützt Firebase Remote Config sowohl client- als auch serverseitige SDK-Integrationen für Webanwendungen. Das bedeutet, dass Ihre App Folgendes tun kann:

• Remote Config-Vorlagen auf dem Server abrufen und bewerten:Ihr Server kann die Remote Config-Vorlage herunterladen und die Ausrichtungsbedingungen direkt bewerten.
• Leistung beim ersten Seitenaufbau optimieren:Bei serverseitigen Rendering-Szenarien kann der Server dem Client beim ersten Seitenaufbau die ausgewertete Konfiguration zur Verfügung stellen. Dadurch wird die Leistung verbessert, da die erforderlichen Konfigurationsdaten vorab bereitgestellt werden.

Mit diesem Ansatz können Sie das Verhalten und die Konfiguration Ihrer App dynamisch verwalten, insbesondere bei serverseitigen Rendering-Konfigurationen.

Serverseitiges Rendering für Ihre Apps einrichten

Wenn Sie das serverseitige Rendering mit Remote Config in Ihrer Webanwendung konfigurieren möchten, aktualisieren Sie Ihre Client- und Serveranwendungen anhand der folgenden Schritte.

Schritt 1: Serverseitige Anwendung aktualisieren

Fügen Sie in Ihrer Server-App, in der Sie das Firebase Admin Node.js SDK implementiert haben, eine RemoteConfigFetchResponse-Klasse hinzu, die die vorhandene ServerConfig akzeptiert. So können Sie Konfigurationswerte serialisieren, die an Ihren Client übergeben werden können.

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

Schritt 2: Client-App aktualisieren

Fügen Sie in Ihrer Client-App, in der das Firebase JavaScript SDK implementiert ist, eine initialFetchResponse-Konfigurationsoption hinzu, um die von Ihrer Server-App übergebenen serialisierten Werte zu akzeptieren. Dadurch wird der Konfigurationsstatus manuell aktualisiert, ohne dass eine asynchrone Abrufanfrage gestellt wird.

Außerdem müssen Sie eine Initialisierungsoption angeben, mit der Sie die firebase-server als templateId im Client-SDK festlegen können. Dadurch wird das SDK so konfiguriert, dass die ursprüngliche serverseitige Vorlage für nachfolgende Abrufe verwendet wird. So werden einheitliche Parameter und bedingte Werte zwischen Client und Server sichergestellt.

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