Catch up on everything announced at Firebase Summit, and learn how Firebase can help you accelerate app development and run your app with confidence. Learn More

Firebase RemoteConfigを使い始める

コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。


Firebase Remote Config を使用して、アプリでパラメーターを定義し、クラウドでその値を更新して、アプリの更新を配布せずにアプリの外観と動作を変更できます。このガイドでは、開始するための手順を順を追って説明し、いくつかのサンプル コードを提供します。これらはすべて、 firebase/quickstart-js GitHub リポジトリから複製またはダウンロードできます。

ステップ 1: Remote Config SDK を追加して初期化する

  1. Firebase JS SDK をまだインストールしていない場合は、インストールして Firebase を初期化します

  2. Remote Config JS SDK を追加し、Remote Config を初期化します。

Web version 9

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 version 8

import firebase from "firebase/app";
import "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
firebase.initializeApp(firebaseConfig);


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

このオブジェクトは、アプリ内のデフォルト パラメータ値を保存し、Remote Config バックエンドから更新されたパラメータ値を取得し、取得した値をアプリでいつ利用できるようにするかを制御するために使用されます。

ステップ 2: 最小フェッチ間隔を設定する

開発中は、最小フェッチ間隔を比較的低く設定することをお勧めします。詳細については、スロットリングを参照してください。

Web version 9

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;

Web version 8

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;

ステップ 3: アプリ内のデフォルト パラメータ値を設定する

Remote Config オブジェクトにアプリ内の既定のパラメーター値を設定して、Remote Config バックエンドに接続する前にアプリが意図したとおりに動作し、バックエンドに何も設定されていない場合に既定値を使用できるようにすることができます。

Web version 9

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

Web version 8

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

Remote Config バックエンド パラメータ値をすでに設定している場合は、すべてのデフォルト値を含む生成された 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. プロンプトが表示されたら、 web で .json を有効にし、 [ファイルのダウンロード] をクリックします。

次の例は、アプリに既定値をインポートして設定する 2 つの異なる方法を示しています。最初の例では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: アプリで使用するパラメーター値を取得する

これで、Remote Config オブジェクトからパラメーター値を取得できます。後でバックエンドで値を設定し、取得してからアクティブ化すると、それらの値がアプリで使用可能になります。これらの値を取得するには、パラメータ キーを引数として指定してgetValue()メソッドを呼び出します。

Web version 9

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

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

Web version 8

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

ステップ 5: パラメータ値を設定する

Firebase コンソールまたはRemote Config バックエンド APIを使用して、目的の条件付きロジックまたはユーザー ターゲティングに従って、アプリ内の値をオーバーライドする新しいサーバー側のデフォルト値を作成できます。このセクションでは、Firebase コンソールの手順に従ってこれらの値を作成します。

  1. Firebase コンソールで、プロジェクトを開きます。
  2. メニューから [ Remote Config ] を選択して、Remote Config ダッシュボードを表示します。
  3. アプリで定義したパラメーターと同じ名前のパラメーターを定義します。パラメータごとに、デフォルト値 (最終的にはアプリ内のデフォルト値をオーバーライドします) を設定でき、条件値も設定できます。詳細については、 Remote Config のパラメーターと条件を参照してください。

ステップ 6: 値を取得してアクティブ化する

  1. Remote Config バックエンドからパラメータ値をフェッチするには、 fetchConfig()メソッドを呼び出します。バックエンドで設定した値はすべて取得され、Remote Config オブジェクトにキャッシュされます。
  2. 取得したパラメーター値をアプリで使用できるようにするには、 activate()メソッドを呼び出します。

1 回の呼び出しで値を取得してアクティブ化する場合は、次の例に示すようにfetchAndActivate()を使用します。

Web version 9

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

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

Web version 8

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

これらの更新されたパラメーター値はアプリの動作と外観に影響を与えるため、ユーザーが次にアプリを開いたときなど、ユーザーのスムーズなエクスペリエンスを保証する時点でフェッチされた値をアクティブ化する必要があります。詳細と例については、 Remote Config の読み込み方法をご覧ください。

スロットリング

アプリが短期間にフェッチする回数が多すぎると、フェッチ呼び出しが抑制される可能性があります。このような場合、SDK はFETCH_THROTTLEエラーをスローします。このエラーをキャッチし、指数バックオフ モードで再試行し、後続のフェッチ リクエスト間の間隔を長くすることをお勧めします。

アプリの開発中は、キャッシュを非常に頻繁に (1 時間に何回も) 更新して、アプリの開発とテストを迅速に反復できるようにすることができます。多数の開発者がいるプロジェクトでの迅速なイテレーションに対応するために、最小フェッチ間隔 ( Settings.minimumFetchIntervalMillis ) が低いプロパティをアプリに一時的に追加できます。

Remote Config のデフォルトで推奨される運用フェッチ間隔は 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: