Firebase 원격 구성 시작하기


Firebase Remote Config를 사용하여 앱의 매개변수를 정의할 수 있습니다. 클라우드에서 해당 값을 업데이트할 수 있으므로, 스프레드시트의 모양을 수정하고 앱 업데이트를 배포하지 않고 앱의 동작을 제어할 수 있습니다. 이 가이드에서는 시작하는 단계를 안내하고 샘플 코드를 제공합니다. 모든 샘플 코드는 firebase/quickstart-js GitHub 저장소에서 클론하거나 다운로드할 수 있습니다.

1단계: Remote Config SDK 추가 및 초기화

  1. 아직 진행하지 않았다면 Firebase JS SDK를 설치하고 Firebase를 초기화합니다.

  2. Remote Config JS SDK를 추가하고 Remote Config를 초기화합니다.

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

이 객체는 인앱 매개변수 기본값을 저장하는 데 사용되며, 업데이트된 항목을 가져옵니다. 매개변수 값을 Remote Config 백엔드에서 적용하고, 가져올 때 제어 값을 앱에 제공할 수 있습니다.

2단계: 가져오기 간격 최솟값 설정

개발 중에는 가져오기 간격 최솟값을 상대적으로 낮게 설정하는 것이 좋습니다. 자세한 내용은 제한을 참조하세요.

Web

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;
rc_set_minimum_fetch_time.js

Web

remoteConfig.settings.minimumFetchIntervalMillis = 3600000;
index.js

3단계: 인앱 매개변수 기본값 설정

Remote Config에서 인앱 매개변수 기본값을 설정할 수 있습니다. 객체에 연결되기 전에 앱이 의도한 대로 동작하도록 Remote Config 백엔드에 전달하여 다음 경우에 기본값을 사용할 수 있습니다. 백엔드에 아무것도 설정되지 않았습니다

Web

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

Web

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

백엔드 매개변수 값 Remote Config개를 이미 구성한 경우 모든 기본값이 포함된 생성된 JSON 파일을 다운로드하고 App Bundle에 포함하세요.

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. 매개변수 탭에서 메뉴를 열고 기본값 다운로드를 선택합니다.
  2. 메시지가 표시되면 웹의 경우 .json을 사용 설정한 후 파일 다운로드를 클릭합니다.

다음 예는 앱에서 기본값을 가져오고 설정할 수 있는 두 가지 방법을 보여줍니다. 첫 번째 예에서는 fetch를 사용하여 App Bundle에 포함된 기본 파일에 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

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

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

Web

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

5단계: 매개변수 값 설정

Firebase Console 또는 Remote Config 백엔드 API를 사용하여 원하는 조건부 로직 또는 사용자 타겟팅에 따라 인앱 값을 재정의하는 새 서버 측 기본값을 만들 수 있습니다. 이 섹션 에서는 이러한 값을 만드는 Firebase 콘솔 단계를 안내합니다.

  1. Firebase 콘솔에서 프로젝트를 엽니다.
  2. 메뉴에서 Remote Config를 선택하여 Remote Config을 확인합니다. 대시보드에서 이 설정을 지정할 수 있습니다.
  3. 앱에 정의한 매개변수와 같은 이름으로 매개변수를 정의합니다. 각 매개변수에 기본값 및 조건부 값을 설정할 수 있으며 기본값은 이후에 해당하는 인앱 기본값을 재정의합니다. 자세한 내용은 Remote Config 매개변수 및 조건을 참고하세요.

6단계: 값 가져오기 및 활성화

  1. Remote Config 백엔드에서 매개변수 값을 가져오려면 다음을 호출합니다. fetchConfig() 메서드를 사용하여 축소하도록 요청합니다. 백엔드에 설정한 모든 값이 수신되어 Remote Config 객체에 캐시됩니다.
  2. 가져온 매개변수 값을 앱에 적용하려면 activate() 메서드를 호출합니다.

호출 한 번으로 값을 가져오고 활성화하려면 다음 예시와 같이 fetchAndActivate()를 사용합니다.

Web

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

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

Web

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

이러한 업데이트된 매개변수 값은 앱의 동작과 모양에 영향을 주므로 사용자 경험에 방해가 되지 않을 만한 시점, 예를 들어 사용자가 다음번에 앱을 열 때 등과 같은 상황에서 가져온 값을 활성화하는 것이 좋습니다. 자세한 내용과 예시는 원격 구성 로딩 전략을 참조하세요.

제한

앱에서 짧은 시간 동안 가져오기를 너무 많이 수행하면 가져오기 호출이 제한될 수 있습니다. 이 경우 SDK가 FETCH_THROTTLE 오류를 발생시킵니다. 이 오류를 확인하고 지수 백오프 모드로 재시도하여 가져오기 요청 간 대기 시간을 더 길게 설정하는 것이 좋습니다.

앱을 개발하는 동안 캐시를 자주(시간당 여러 번) 새로고치면 앱을 개발하고 테스트할 때 빠르게 반복할 수 있습니다. 개발자가 많은 프로젝트에서 빠르게 반복할 수 있도록 앱에서 가져오기 간격 최솟값(Settings.minimumFetchIntervalMillis)의 속성을 임시로 추가할 수 있습니다.

Remote Config의 기본 및 권장 프로덕션 가져오기 간격 12시간이며 12시간 동안 백엔드에서 구성을 두 번 이상 가져오지 않음을 의미합니다. 실제로 호출되는 가져오기 호출 수와 상관없이 창출될 수 있습니다 가져오기 간격 최솟값은 구체적으로 다음과 같은 순서로 결정됩니다.

  1. Settings.minimumFetchIntervalMillis의 매개변수
  2. 기본값 12시간

다음 단계

아직 살펴보지 않았다면 Remote Config에서 살펴보세요. 사용 사례를 살펴보고 주요 개념 및 고급 전략 문서: