Pierwsze kroki ze Zdalną konfiguracją w aplikacjach internetowych

Za pomocą Firebase Remote Config możesz definiować parametry w aplikacji i aktualizować ich wartości w chmurze. Dzięki temu możesz modyfikować wygląd i zachowanie aplikacji bez konieczności dystrybuowania aktualizacji aplikacji. Ten przewodnik zawiera instrukcje dotyczące rozpoczęcia pracy oraz przykładowy kod, który można sklonować lub pobrać z firebase/quickstart-js repozytorium w GitHubie.

Krok 1. Dodaj i zainicjuj pakiet SDK Remote Config

1. Jeśli jeszcze tego nie zrobisz, zainstaluj pakiet Firebase JS SDK i zainicjuj Firebase.

2. Dodaj pakiet SDK Remote Config JS i zainicjuj Remote Config:

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

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

Ten obiekt służy do przechowywania domyślnych wartości parametrów w aplikacji, pobierania zaktualizowanych wartości parametrów z backendu Remote Config oraz kontrolowania, kiedy pobrane wartości mają być dostępne dla aplikacji.

Krok 2. Ustaw minimalny interwał pobierania

Podczas programowania zalecamy ustawienie stosunkowo niskiego minimalnego interwału pobierania. Więcej informacji znajdziesz w sekcji Ograniczenia.

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

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;
index.js

Krok 3. Ustaw domyślne wartości parametrów w aplikacji

W obiekcie Remote Config możesz ustawić domyślne wartości parametrów w aplikacji, aby aplikacja zachowywała się zgodnie z oczekiwaniami, zanim połączy się z Remote Config backendem, oraz aby wartości domyślne były dostępne, jeśli nie są ustawione w backendzie.

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

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

Jeśli masz już skonfigurowane wartości parametrów backendu Remote Config, możesz pobrać wygenerowany plik JSON, który zawiera wszystkie wartości domyślne, i dołączyć go do pakietu aplikacji:

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

gcloud auth print-access-token

Poniższe przykłady pokazują 2 różne sposoby importowania i ustawiania wartości domyślnych w aplikacji. Pierwszy przykład używa funkcji fetch, która wysyła żądanie HTTP do pliku domyślnego dołączonego do pakietu aplikacji:

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

Następny przykład używa funkcji require, która kompiluje wartości w aplikacji podczas kompilacji:

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

Krok 4. Uzyskaj wartości parametrów, które będą używane w Twojej aplikacji

Teraz możesz pobierać wartości parametrów z obiektu Remote Config. Jeśli później ustawisz wartości w backendzie, pobierzesz je i aktywujesz, będą one dostępne dla Twojej aplikacji.Aby uzyskać te wartości, wywołaj metodę getValue(), podając klucz parametru jako argument.

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

const val = getValue(remoteConfig, "welcome_messsage");
rc_get_values.js

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

Krok 5. Ustaw wartości parametrów

Za pomocą konsoli Firebase lub interfejsów API backendu Remote Config możesz tworzyć nowe domyślne wartości po stronie serwera, które zastępują wartości w aplikacji zgodnie z wybraną logiką warunkową lub kierowaniem na użytkowników. W tej sekcji opisujemy, jak utworzyć te wartości w konsoli Firebase.

1. W konsoli FirebaseFirebase otwórz projekt.
2. W menu wybierz Remote Config , aby wyświetlić panel Remote Config.
3. Zdefiniuj parametry o tych samych nazwach co parametry zdefiniowane w aplikacji. Dla każdego parametru możesz ustawić wartość domyślną (która ostatecznie zastąpi wartość domyślną w aplikacji) oraz wartości warunkowe. Więcej informacji znajdziesz w artykule Remote Config Parametry i warunki.

4. Jeśli używasz niestandardowych warunków sygnałów , zdefiniuj atrybuty i ich wartości. Poniższy przykład pokazuje, jak zdefiniować warunek sygnału niestandardowego.

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

Krok 6. Pobierz i aktywuj wartości

1. Aby pobrać wartości parametrów z backendu Remote Config, wywołaj metodę fetchConfig(). Wszystkie wartości ustawione w backendzie są pobierane i zapisywane w pamięci podręcznej w obiekcie Remote Config.
2. Aby udostępnić pobrane wartości parametrów w aplikacji, wywołaj metodę activate().

Jeśli chcesz pobrać i aktywować wartości za pomocą jednego wywołania, użyj fetchAndActivate() jak w tym przykładzie:

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

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

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

Ponieważ te zaktualizowane wartości parametrów wpływają na zachowanie i wygląd aplikacji, należy aktywować pobrane wartości w taki sposób, aby zapewnić użytkownikowi płynne działanie aplikacji, np. przy następnym otwarciu aplikacji. Więcej informacji i przykładów znajdziesz w artykule Strategie wczytywania Zdalnej konfiguracji.

Krok 7. Nasłuchuj aktualizacji w czasie rzeczywistym

Po pobraniu wartości parametrów możesz użyć Zdalnej konfiguracji w czasie rzeczywistym, aby nasłuchiwać aktualizacji z backendu Zdalnej konfiguracji.Remote ConfigRemote Config W czasie rzeczywistym Remote Config wysyła sygnały do połączonych urządzeń, gdy dostępne są aktualizacje, i automatycznie pobiera zmiany po opublikowaniu nowej Remote Config wersji.

1. W aplikacji użyj funkcji onConfigUpdate, aby rozpocząć nasłuchiwanie aktualizacji i automatycznie pobierać nowe wartości parametrów. Zaimplementuj wywołanie zwrotne next, aby aktywować zaktualizowaną konfigurację.

     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. Gdy następnym razem opublikujesz nową wersję Remote Config, urządzenia na których działa Twoja aplikacja i które nasłuchują zmian, wywołają procedurę obsługi zakończenia.

Ograniczenia

Jeśli aplikacja pobiera dane zbyt często w krótkim czasie, wywołania pobierania mogą zostać ograniczone. W takich przypadkach pakiet SDK zgłasza błąd FETCH_THROTTLE. Zalecamy przechwytywanie tego błędu i ponawianie próby w trybie wzrastającego czasu do ponowienia, z dłuższymi odstępami między kolejnymi żądaniami pobierania.

Podczas tworzenia aplikacji możesz chcieć odświeżać pamięć podręczną bardzo często (wiele razy na godzinę), aby móc szybko iterować podczas tworzenia i testowania aplikacji. Aby umożliwić szybką iterację w projekcie z wieloma deweloperami, możesz tymczasowo dodać w aplikacji właściwość z niskim minimalnym interwałem pobierania (Settings.minimumFetchIntervalMillis).

Domyślny i zalecany interwał pobierania w wersji produkcyjnej dla Remote Config to 12 godzin. Oznacza to, że konfiguracje nie będą pobierane z backendu częściej niż raz na 12 godzin, niezależnie od tego, ile wywołań pobierania zostanie faktycznie wykonanych. Minimalny interwał pobierania jest określany w tej kolejności:

1. Parametr w Settings.minimumFetchIntervalMillis.
2. Wartość domyślna 12 godzin.