Firebase 遠端配置入門


您可以使用 Firebase Remote Config 在應用程式中定義參數並在雲端中更新其值，從而無需分發應用程式更新即可修改應用程式的外觀和行為。本指南將引導您完成入門步驟並提供一些範例程式碼，所有這些程式碼都可以從firebase/quickstart-js GitHub 儲存庫複製或下載。

步驟1：新增並初始化Remote Config SDK

  1. 如果您尚未安裝 Firebase JS SDK 並初始化 Firebase 。

  2. 加入Remote Config JS SDK並初始化Remote Config：

網路模組化API

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 命名空間 API

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 modular API

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;
rc_set_minimum_fetch_time.js

Web namespaced API

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;
index.js

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

您可以在遠端配置物件中設定應用程式內預設參數值，以便您的應用程式在連接到遠端配置後端之前按預期運行，並且如果後端未設定預設值，則預設值可用。

Web modular API

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

Web namespaced API

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

如果您已經設定了遠端設定後端參數值，則可以下載包含所有預設值的產生的 JSON 檔案並將其包含在您的應用程式套件中：

休息

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. 在「參數」標籤中，開啟選單，然後選擇「下載預設值」 。
  2. 出現提示時，啟用.json for web ，然後按一下「下載檔案」 。

以下範例展示了在應用程式中匯入和設定預設值的兩種不同方法。第一個範例使用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 modular API

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

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

Web namespaced API

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

步驟5：設定參數值

使用 Firebase 控制台或遠端設定後端 API ，您可以建立新的伺服器端預設值，根據您所需的條件邏輯或使用者定位覆寫應用程式內值。本部分將引導您完成 Firebase 控制台步驟來建立這些值。

  1. 在Firebase 控制台中，開啟您的專案。
  2. 從選單中選擇遠端配置以查看遠端配置儀表板。
  3. 定義與您在應用程式中定義的參數同名的參數。對於每個參數，您可以設定預設值（最終將覆蓋應用程式內的預設值），也可以設定條件值。要了解更多信息，請參閱遠端配置參數和條件。

第 6 步：獲取並啟動值

  1. 若要從遠端配置後端取得參數值，請呼叫fetchConfig()方法。您在後端設定的任何值都會被取得並快取在遠端配置物件中。
  2. 若要讓取得的參數值可供您的應用程式使用，請呼叫activate()方法。

如果您希望在一次呼叫中取得並啟動值，請使用fetchAndActivate() ，如下例所示：

Web modular API

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

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

Web namespaced API

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

由於這些更新的參數值會影響應用程式的行為和外觀，因此您應該在確保使用者獲得流暢體驗的時間（例如使用者下次開啟應用程式時）啟動所獲取的值。如需更多資訊和範例，請參閱遠端設定載入策略。

節流

如果應用程式在短時間內提取太多次，則提取呼叫可能會受到限制。在這種情況下，SDK 會引發FETCH_THROTTLE錯誤。建議您捕獲此錯誤並以指數退避模式重試，在後續提取請求之間等待更長的時間間隔。

在應用程式開發期間，您可能希望非常頻繁地刷新快取（每小時多次），以便您在開發和測試應用程式時快速迭代。為了適應具有眾多開發人員的專案的快速迭代，您可以在應用程式中臨時添加具有較低最小獲取間隔 ( Settings.minimumFetchIntervalMillis ) 的屬性。

遠端配置的預設和建議生產獲取間隔為 12 小時，這表示在 12 小時視窗內不會多次從後端取得配置，無論實際進行了多少次獲取呼叫。具體來說，最小讀取間隔是按以下順序決定：

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

Next steps

If you haven't already, explore the Remote Config use cases , and take a look at some of the key concepts and advanced strategies documentation, including: