開始使用 Firebase 遠端設定


您可以使用 Firebase 遠端設定在應用程式中定義參數,並在雲端更新參數的值,這樣就能修改應用程式的外觀和行為,而不必發布應用程式更新。本指南將逐步引導您踏出第一步,並提供一些程式碼範例,所有程式碼都能從 firebase/quickstart-js GitHub 存放區中複製或下載。

步驟 1:新增並初始化遠端設定 SDK

  1. 如果您尚未 安裝 Firebase JS SDK 並初始化 Firebase,請先完成這項操作。

  2. 新增遠端設定 JS SDK 並初始化遠端設定:

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

這個物件用於儲存應用程式內的預設參數值、從遠端設定後端擷取更新後的參數值,以及控管將應用程式擷取到何時可使用擷取的值。

步驟 2:設定擷取間隔下限

在開發期間,建議您設定相對較低的擷取間隔下限。詳情請參閱節流

Web

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;

Web

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;

步驟 3:設定應用程式內預設參數值

您可以在遠端設定物件中設定應用程式內預設參數值,讓應用程式在連線至遠端設定後端之前能正常運作。如此一來,在後端未設定任何情況下,應用程式就會使用預設值。

Web

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

Web

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

如果您已設定遠端設定後端參數值,可以下載系統產生的 JSON 檔案 (包含所有預設值),並將其加入應用程式套件中:

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

Firebase 控制台

  1. 「Parameters」分頁中開啟「Menu」,然後選取「Download default value」
  2. 出現提示時,啟用網頁版 .json,然後點選「下載檔案」

下列範例說明兩種在應用程式中匯入及設定預設值的方法。第一個範例使用 fetch,可向應用程式套件中的預設檔案發出 HTTP 要求:


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

下一個範例使用 require,可在建構期間將這些值編譯到應用程式中:

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

步驟 4:取得要用於應用程式的參數值

您現在可以從遠端設定物件取得參數值。如果您之後在後端設定、擷取及啟用這些值,應用程式就能使用這些值。如要取得這些值,請呼叫 getValue() 方法,並提供參數鍵做為引數。

Web

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

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

Web

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

步驟 5:設定參數值

您可以使用 Firebase 主控台或遠端設定後端 API 建立新的伺服器端預設值,根據所需的條件邏輯或使用者指定目標覆寫應用程式內值。本節將逐步引導您使用 Firebase 控制台建立這些值。

  1. Firebase 控制台開啟專案。
  2. 選取選單中的「Remote Config」(遠端設定),查看「遠端設定」資訊主頁。
  3. 定義參數時,請使用與應用程式中定義的參數相同的名稱。您可以為每個參數設定預設值 (該參數最終會覆寫應用程式內預設值),也可以設定條件式值。詳情請參閱遠端設定參數與條件

步驟 6:擷取並啟用值

  1. 如要從遠端設定後端擷取參數值,請呼叫 fetchConfig() 方法。您在後端設定的任何值都會在遠端設定物件中擷取並快取。
  2. 如要讓應用程式使用擷取的參數值,請呼叫 activate() 方法。

如果想在單一呼叫中擷取及啟用值,請使用 fetchAndActivate(),如以下範例所示:

Web

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

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

Web

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

這些更新過的參數值會影響應用程式的行為和外觀,因此建議您於時啟用擷取的值,確保使用者享有順暢的體驗,例如下次使用者開啟應用程式時。如需詳細資訊和範例,請參閱「遠端設定載入策略」。

調節

如果應用程式在短時間內擷取太多次,擷取呼叫可能會受到限制。在這種情況下,SDK 會擲回 FETCH_THROTTLE 錯誤。建議您擷取這個錯誤,並以指數輪詢模式重試,後續擷取要求之間會等待較長的間隔時間。

在應用程式開發期間,您可能需要頻繁地重新整理快取 (每小時多次),以便您在開發及測試應用程式時迅速疊代。為了因應有眾多開發人員的專案快速疊代作業,您可以在應用程式中暫時新增最低擷取時間間隔 (Settings.minimumFetchIntervalMillis) 的屬性。

遠端設定的預設和建議的實際工作環境擷取間隔是 12 小時,這表示無論實際發出多少擷取呼叫,在 12 小時內,都不會從後端多次擷取設定。具體來說,擷取時間間隔的最小值順序如下:

  1. Settings.minimumFetchIntervalMillis 中的參數。
  2. 預設值是 12 小時。

後續步驟

如果您尚未瞭解遠端設定用途,請先瞭解遠端設定的用途,並參考一些重要概念和進階策略說明文件,包括: