Erste Schritte mit Remote Config im Web

Plattform auswählen : iOS+ Android Web Flutter Unity C++


Mit Firebase Remote Config können Sie Parameter in Ihrer App definieren und ihre Werte in der Cloud aktualisieren. So können Sie das Erscheinungsbild und das Verhalten Ihrer App ändern, ohne ein App-Update zu verteilen. In dieser Anleitung werden die ersten Schritte beschrieben und Beispielcode bereitgestellt, der im GitHub-Repository firebase/quickstart-js geklont oder heruntergeladen werden kann.

Schritt 1: Remote Config SDK hinzufügen und initialisieren

  1. Installieren Sie das Firebase JS SDK und initialisieren Sie Firebase, falls noch nicht geschehen.

  2. Fügen Sie das Remote Config JS SDK hinzu und initialisieren Sie Remote Config:

Web

import { initializeApp } from "firebase/app";
import { getRemoteConfig } from "firebase/remote-config";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Remote Config and get a reference to the service
const remoteConfig = getRemoteConfig(app);

Web

import firebase from "firebase/compat/app";
import "firebase/compat/remote-config";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


// Initialize Remote Config and get a reference to the service
const remoteConfig = firebase.remoteConfig();

Dieses Objekt wird verwendet, um Standardparameterwerte in der App zu speichern, aktualisierte Parameterwerte aus dem Remote Config Backend abzurufen und zu steuern, wann abgerufene Werte für Ihre App verfügbar gemacht werden.

Schritt 2: Mindestabrufintervall festlegen

Während der Entwicklung empfiehlt es sich, ein relativ niedriges Mindestabrufintervall festzulegen. Weitere Informationen finden Sie unter Drosselung.

Web

// The default and recommended production fetch interval for Remote Config is 12 hours
remoteConfig.settings.minimumFetchIntervalMillis = 3600000;

Web

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;

Schritt 3: Standardparameterwerte in der App festlegen

Sie können Standardparameterwerte in der App im Remote Config Objekt festlegen, damit sich Ihre App wie gewünscht verhält, bevor sie eine Verbindung zum Remote Config Backend herstellt. Außerdem sind so Standardwerte verfügbar, wenn im Backend keine festgelegt sind.

Web

remoteConfig.defaultConfig = {
  "welcome_message": "Welcome"
};

Web

remoteConfig.defaultConfig = {
  "welcome_message": "Welcome"
};

Wenn Sie bereits Remote Config Backend-Parameterwerte konfiguriert haben, können Sie eine generierte JSON-Datei mit allen Standardwerten herunterladen und sie in Ihr App Bundle einfügen:

REST

curl --compressed -D headers -H "Authorization: Bearer token" -X GET https://firebaseremoteconfig.googleapis.com/v1/projects/my-project-id/remoteConfig:downloadDefaults?format=JSON -o remote_config_defaults.json

Sie können ein Bearertoken generieren, indem Sie den folgenden Befehl mit der Google Cloud CLI oder Cloud Shell ausführen:

gcloud auth print-access-token

Dieses Token ist nur von kurzer Dauer. Wenn ein Authentifizierungsfehler auftritt, müssen Sie es möglicherweise neu generieren.

Firebase console

  1. Öffnen Sie auf dem Tab Parameter das Menü und wählen Sie Standardwerte herunterladen aus.
  2. Aktivieren Sie bei entsprechender Aufforderung .json für das Web und klicken Sie dann auf Datei herunterladen.

In den folgenden Beispielen werden zwei verschiedene Möglichkeiten gezeigt, wie Sie Standardwerte in Ihre App importieren und festlegen können. Im ersten Beispiel wird fetch verwendet, wodurch eine HTTP-Anfrage an die Standarddatei gesendet wird, die in Ihrem App Bundle enthalten ist:

  const rcDefaultsFile = await fetch('remote_config_defaults.json');
  const rcDefaultsJson = await rcDefaultsFile.json();
  remoteConfig.defaultConfig = rcDefaultsJson;
  

Im nächsten Beispiel wird require verwendet, wodurch die Werte zur Build-Zeit in Ihre App kompiliert werden:

  let rcDefaults = require('./remote_config_defaults.json');
  remoteConfig.defaultConfig = rcDefaults;

Schritt 4: Parameterwerte zur Verwendung in Ihrer App abrufen

Jetzt können Sie Parameterwerte aus dem Remote Config Objekt abrufen. Wenn Sie später Werte im Backend festlegen, sie abrufen und dann aktivieren, sind diese Werte für Ihre App verfügbar.Rufen Sie dazu die getValue()Methode auf und geben Sie den Parameterschlüssel als Argument an.

Web

import { getValue } from "firebase/remote-config";

const val = getValue(remoteConfig, "welcome_messsage");

Web

const val = remoteConfig.getValue("welcome_messsage");

Schritt 5: Parameterwerte festlegen

Über die Firebase Console oder die Remote Config Backend APIs können Sie neue serverseitige Standard werte erstellen, die die Werte in der App gemäß Ihrer gewünschten bedingten Logik oder Nutzerausrichtung überschreiben. In diesem Abschnitt werden die Schritte in der Firebase Konsole beschrieben, mit denen Sie diese Werte erstellen.

  1. Öffnen Sie in der Firebase Console Ihr Projekt.
  2. Wählen Sie im Menü Remote Config aus, um das Remote Config Dashboard aufzurufen.
  3. Definieren Sie Parameter mit denselben Namen wie die Parameter, die Sie in Ihrer App definiert haben. Für jeden Parameter können Sie einen Standardwert festlegen, der den Standardwert in der App überschreibt. Außerdem können Sie bedingte Werte festlegen. Weitere Informationen finden Sie unter Remote Config Parameter und Bedingungen.
  4. Wenn Sie benutzerdefinierte Signal bedingungen verwenden, definieren Sie die Attribute und ihre Werte. Im folgenden Beispiel wird gezeigt, wie eine benutzerdefinierte Signalbedingung definiert wird.

      let customSignals = {
         "city": "Tokyo",
         "preferred_event_category": "sports"
      }
    
      setCustomSignals(config, customSignals);

Schritt 6: Werte abrufen und aktivieren

  1. Rufen Sie die fetchConfig() Methode auf, um Parameterwerte aus dem Remote Config Backend abzurufen. Alle Werte, die Sie im Backend festgelegt haben, werden abgerufen und im Remote Config Objekt im Cache gespeichert.
  2. Rufen Sie die activate() Methode auf, um abgerufene Parameterwerte für Ihre App verfügbar zu machen.

Wenn Sie Werte in einem Aufruf abrufen und aktivieren möchten, verwenden Sie fetchAndActivate() wie in diesem Beispiel:

Web

import { fetchAndActivate } from "firebase/remote-config";

fetchAndActivate(remoteConfig)
  .then(() => {
    // ...
  })
  .catch((err) => {
    // ...
  });

Web

remoteConfig.fetchAndActivate()
  .then(() => {
    // ...
  })
  .catch((err) => {
    // ...
  });

Da sich diese aktualisierten Parameterwerte auf das Verhalten und das Erscheinungsbild von Ihrer App auswirken, sollten Sie die abgerufenen Werte zu einem Zeitpunkt aktivieren, der für Ihre Nutzer optimal ist, z. B. beim nächsten Öffnen Ihrer App. Weitere Informationen und Beispiele finden Sie unter Remote Config-Ladestrategien.

Schritt 7: In Echtzeit auf Updates warten

Nachdem Sie Parameterwerte abgerufen haben, können Sie mit Remote Config in Echtzeit auf Updates aus dem Remote Config-Backend warten.Remote ConfigRemote Config Echtzeit Remote Config signalisiert verbundenen Geräten, wenn Updates verfügbar sind, und ruft die Änderungen automatisch ab, nachdem Sie eine neue Remote Config Version veröffentlicht haben.

  1. Verwenden Sie in Ihrer App onConfigUpdate, um auf Updates zu warten und automatisch alle neuen Parameterwerte abzurufen. Implementieren Sie den next-Callback, um die aktualisierte Konfiguration zu aktivieren.

      onConfigUpdate(remoteConfig, {
         next: (configUpdate) => {
            console.log("Updated keys:", configUpdate.getUpdatedKeys());
            if (configUpdate.getUpdatedKeys().has("welcome_message")) {
               activate(remoteConfig).then(() => {
               showWelcomeMessage();
               });
            }
         },
         error: (error) => {
            console.log("Config update error:", error);
         },
         complete: () => {
            console.log("Listening stopped.");
         }
      });
  2. Wenn Sie das nächste Mal eine neue Version von Remote Config veröffentlichen, rufen Geräte , auf denen Ihre App ausgeführt wird und die auf Änderungen warten, den Completion -Handler auf.

Drosselung

Wenn eine App innerhalb kurzer Zeit zu viele Abrufe durchführt, werden die Abrufaufrufe möglicherweise gedrosselt. In solchen Fällen gibt das SDK einen FETCH_THROTTLE-Fehler aus. Wir empfehlen, diesen Fehler abzufangen und den Vorgang im exponentiellen Backoff-Modus zu wiederholen. Dabei sollten Sie zwischen den nachfolgenden Abrufanfragen längere Intervalle einlegen.

Während der App-Entwicklung möchten Sie den Cache möglicherweise sehr häufig aktualisieren (mehrmals pro Stunde), um schnell Iterationen durchführen zu können, während Sie Ihre App entwickeln und testen. Um schnelle Iterationen an einem Projekt mit zahlreichen Entwicklern zu ermöglichen, können Sie Ihrer App vorübergehend eine Eigenschaft mit einem niedrigen Mindestabrufintervall (Settings.minimumFetchIntervalMillis) hinzufügen.

Das standardmäßige und empfohlene Abrufintervall für die Produktion für Remote Config beträgt 12 Stunden. Das bedeutet, dass Konfigurationen unabhängig von der Anzahl der tatsächlich durchgeführten Abrufaufrufe nicht mehr als einmal innerhalb von 12 Stunden aus dem Backend abgerufen werden. Das Mindestabrufintervall wird in der folgenden Reihenfolge festgelegt:

  1. Der Parameter in Settings.minimumFetchIntervalMillis.
  2. Der Standardwert von 12 Stunden.