見出し画像

Firebase Remote Config の使い方

「Firebase Remote Config」の使い方をまとめました。

1. Firebase Remote Config

Firebase Remote Config」は、アプリのアップデートなしに、アプリの動作や外観を変更できるクラウドサービスです。具体的には、アプリ内のパラメータをサーバー側で更新することができます。

対応プラットフォームは、次のとおりです。

・iOS
・Android
・ウェブ (JavaScript)
・C++
・Unity

今回は、ウェブに「Remote Config」を組み込んでみます。

2. Firebase SDKのインストール

(1) GoogleアカウントでFirebaseにログイン。
(2) Firebaseプロジェクトの作成。
(3) Firebaseプロジェクトにウェブアプリを登録。
「+アプリを追加」のウェブアイコン(<\>)から登録できます。

画像1

(4) ウェブでのFirebase SDKの読み込み
以下のスクリプトを <body> タグの末尾に追加します。
「Core Firebase SDK」は、常に必要で最初に記述します。今回は「Analytics」と「Remote Config」も追加しています。

<body>
  <!-- Core Firebase SDK -->
  <script src="https://www.gstatic.com/firebasejs/7.23.0/firebase-app.js"></script>

  <!-- Analytics -->
  <script src="https://www.gstatic.com/firebasejs/7.23.0/firebase-analytics.js"></script>

  <!-- Remote Config -->
  <script src="https://www.gstatic.com/firebasejs/7.23.0/firebase-remote-config.js"></script>
</body>

(5) ウェブでのFirebase SDKの初期化。
以下のスクリプトを 「Firebase SDKの読み込み」の後に追加します。

<body>
  <!-- Firebase SDKの読み込み -->

  <script>
    // Firebaseプロジェクト構成
    var firebaseConfig = {
      // TODO: Firebaseプロジェクト構成をここに記述
    };

    // Firebase SDKの初期化
    firebase.initializeApp(firebaseConfig);
    firebase.analytics();
  </script>
</body>

Firebaseプロジェクト構成」は、Firebaseプロジェクトのアプリの設定で確認できます。

画像2

3. Remote Configの利用

「Remote Config」の利用手順は、次のとおりです。

(1) アプリ側でのパラメータの利用。
(2) サーバー側でのパラメータの設定。
(3) アプリ側でのパラメータのフェッチ。

3-1. アプリ側でのパラメータの利用

(1)「RemoteConfigオブジェクト」を生成し、最小フェッチ間隔を設定。

      // RemoteConfigオブジェクトの生成
      const remoteConfig = firebase.remoteConfig();
      remoteConfig.settings = {
        minimumFetchIntervalMillis: 3600000, // 最小フェッチ間隔
      };

(2) アプリ内のデフォルトパラメータの設定。

      //アプリ内のデフォルトパラメータの設定
      remoteConfig.defaultConfig = ({
        'welcome_message': 'Welcome',
      });

(3) アプリ内で使うパラメータの取得。

      // アプリ内で使うパラメータの取得
      const val = remoteConfig.getValue('welcome_message');
      alert(val._value+'('+val._source+')');

画像3

3-2. サーバー側でのパラメータの設定

「Firebaseコンソール」または「Remote Config backend API」を使用して、サーバー側の新しいデフォルト値を作成できます。

(1) Firebase コンソールでプロジェクトを開く。
(2) メニューから「Remote Config」を選択。

画像4

(3) アプリで定義したパラメータと同じ名前のパラメータを定義。
それぞれのパラメータにデフォルト値や条件値を設定することもできます。

画像5

(4) 「変更を公開」ボタンを押す。

3-3. アプリ側でのパラメータのフェッチ

アプリ側でサーバーからパラメータをフェッチするには、fetch()を使います。フェッチ済みのパラメータをアプリで利用できるようにするには、activate()を使います。

1 回の呼び出しで値をフェッチと有効化を行う場合は、fetchAndActivate()を使います。

      // アプリ側でのパラメータのフェッチ
      remoteConfig.fetchAndActivate()
        .then(() => {
          const val = remoteConfig.getValue('welcome_message');
          alert(val._value+'('+val._source+')');
        })
        .catch((err) => {
          alert(err);
        });

画像6

3-4. スロットル処理

アプリが短期間に何度もフェッチすると、FETCH_THROTTLE エラーが投げられる場合があります。このエラーをキャッチして、後続のフェッチ間隔をより長くすることをおすすめします。

アプリの開発中に、頻繁なフェッチが必要となる場合は、アプリ内で最小フェッチ間隔(Settings.minimumFetchIntervalMillis)に小さな値を一時的に追加します。

デフォルトのフェッチ間隔は 12 時間であり、これは本番環境で推奨されるフェッチ間隔になります。

【おまけ】 Firebaseプロダクトの一覧

・Analytics: アプリの使用状況とユーザーエンゲージメントの分析。
・Authentication: ユーザーのログイン。
・Cloud Firestore: 最新のNoSQLデータベース。
・Cloud Functions: サーバーレス。
・Cloud Messaging: プッシュ通知。
・Cloud Storage: ユーザーのコンテンツ(写真、動画)の保管。
・Performance Monitoring: アプリのパフォーマンス分析。
・Realtime Database: 従来のNoSQLデータベース。
・Remote Config: アプリ内のパラメータをサーバー側で更新。

画像7


この記事が気に入ったらサポートをしてみませんか?