Skip to content

Braze SDK 통합

Braze SDK를 모바일 앱에 통합하는 방법을 알아보세요. 각 SDK는 자체 공개 GitHub 리포지토리에서 호스팅되며, 여기에는 Braze 기능을 테스트하거나 자체 애플리케이션과 함께 구현하는 데 사용할 수 있는 완전히 빌드 가능한 샘플 앱이 포함되어 있습니다. 자세히 알아보려면 참조, 리포지토리 및 샘플 앱을 참조하세요. SDK에 대한 자세한 내용은 시작하기를 참조하세요: 통합 개요.

Android SDK 통합하기

1단계: build.gradle 업데이트

build.gradle 에서 mavenCentral() 를 리포지토리 목록에 추가합니다.

1
2
3
repositories {
  mavenCentral()
}

다음으로 종속성에 Braze를 추가합니다.

Braze UI 컴포넌트를 사용하지 않을 계획이라면 build.gradle 에 다음 코드를 추가하세요. SDK_VERSION 을 현재 버전의 Android Braze 소프트웨어 개발 키트로 바꿉니다. 전체 버전 목록은 체인지로그를 참조하세요.

1
2
3
4
dependencies {
    implementation 'com.braze:android-sdk-base:SDK_VERSION' // (Required) Adds dependencies for the base Braze SDK.
    implementation 'com.braze:android-sdk-location:SDK_VERSION' // (Optional) Adds dependencies for Braze location services.
}

나중에 Braze UI 컴포넌트를 사용할 계획이라면 build.gradle 에 다음 코드를 추가하세요. SDK_VERSION 을 현재 버전의 Android Braze 소프트웨어 개발 키트로 바꿉니다. 전체 버전 목록은 체인지로그를 참조하세요.

1
2
3
4
dependencies {
    implementation 'com.braze:android-sdk-ui:SDK_VERSION' // (Required) Adds dependencies for the Braze SDK and Braze UI components. 
    implementation 'com.braze:android-sdk-location:SDK_VERSION' // (Optional) Adds dependencies for Braze location services.
}

2단계: 구성 braze.xml

프로젝트의 res/values 폴더에 braze.xml 파일을 만듭니다. 특정 데이터 클러스터에 있거나 기존 커스텀 엔드포인트가 있는 경우 braze.xml 파일에서도 엔드포인트를 지정해야 합니다.

해당 파일의 내용은 다음 코드 스니펫과 유사해야 합니다. Braze 대시보드의 설정 관리 페이지에서 식별자로 YOUR_APP_IDENTIFIER_API_KEY을(를) 대체하십시오. dashboard.braze.com에 로그인하여 클러스터 주소를 찾으십시오.

1
2
3
4
5
<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string translatable="false" name="com_braze_api_key">YOUR_APP_IDENTIFIER_API_KEY</string>
  <string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
</resources>

3단계: 다음에 대한 권한을 추가합니다. AndroidManifest.xml

다음으로 AndroidManifest.xml 에 다음 권한을 추가합니다:

1
2
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

4단계: 지연된 초기화 인에이블먼트(선택 사항)

지연 초기화를 사용하려면 최소 Braze 소프트웨어 개발 키트 버전이 필요합니다:

Step 4.1: braze.xml 업데이트

지연 초기화는 기본값으로 비활성화되어 있습니다. 인에이블하려면 다음 옵션 중 하나를 사용합니다:

프로젝트의 braze.xml 파일에서 com_braze_enable_delayed_initializationtrue 으로 설정합니다.

1
<bool name="com_braze_enable_delayed_initialization">true</bool>

런타임에 지연 초기화를 인에이블먼트하려면 다음 방법을 사용하세요.

1
Braze.enableDelayedInitialization(context);
1
Braze.enableDelayedInitialization(context)

Step 4.2: 푸시 분석 구성(선택 사항)

지연 초기화를 인에이블먼트하면 푸시 분석이 기본값으로 대기줄에 대기합니다. 그러나 대신 푸시 분석을 명시적으로 대기줄에 넣거나 삭제하도록 선택할 수 있습니다.

명시적으로 대기줄 지정

푸시 분석을 명시적으로 대기줄에 추가하려면 다음 옵션 중 하나를 선택합니다:

braze.xml 파일에서 com_braze_delayed_initialization_analytics_behaviorQUEUE 으로 설정합니다:

1
<string name="com_braze_delayed_initialization_analytics_behavior">QUEUE</string>

QUEUE 추가 Braze.enableDelayedInitialization() 메소드에 추가합니다:

1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.QUEUE);
1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.QUEUE)
드롭

푸시 분석을 삭제하려면 다음 옵션 중 하나를 선택합니다:

braze.xml 파일에서 com_braze_delayed_initialization_analytics_behaviorDROP 으로 설정합니다:

1
<string name="com_braze_delayed_initialization_analytics_behavior">DROP</string>

DROP 추가 Braze.enableDelayedInitialization() 메서드에 추가합니다:

1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.DROP);
1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.DROP)

Step 4.3: 소프트웨어 개발 키트 수동 초기화하기

선택한 지연 기간이 지나면 Braze.disableDelayedInitialization() 메서드를 사용하여 소프트웨어 개발 키트를 수동으로 초기화합니다.

1
Braze.disableDelayedInitialization(context);
1
Braze.disableDelayedInitialization(context)

5단계: 사용자 세션 추적 인에이블먼트

사용자 세션 추적을 인에이블먼트하면 openSession(), closeSession(),ensureSubscribedToInAppMessageEvents()InAppMessageManager 등록이 자동으로 처리될 수 있습니다.

활동 수명 주기 콜백을 등록하려면 Application 클래스의 onCreate() 메서드에 다음 코드를 추가하세요.

1
2
3
4
5
6
7
public class MyApplication extends Application {
  @Override
  public void onCreate() {
    super.onCreate();
    registerActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener());
  }
}
1
2
3
4
5
6
class MyApplication : Application() {
  override fun onCreate() {
    super.onCreate()
    registerActivityLifecycleCallbacks(BrazeActivityLifecycleCallbackListener())
  }
}

사용 가능한 매개변수 목록은 BrazeActivityLifecycleCallbackListener.

테스트 세션 추적

테스트하는 동안 문제가 발생하면 상세 로깅을 인에이블먼트한 다음 로그캣을 사용하여 활동에서 누락된 openSessioncloseSession 호출을 감지하세요.

  1. Braze에서 개요로 이동하여 앱을 선택한 다음 표시 데이터 대상 드롭다운에서 오늘을 선택합니다. Braze의 "개요" 페이지, "표시 데이터 날짜" 필드가 "오늘"로 설정되어 있습니다.
  2. 앱을 연 다음 Braze 대시보드를 새로고침합니다. 측정기준이 1 증가했는지 확인합니다.
  3. 앱을 탐색하여 Braze에 하나의 세션만 로그인되어 있는지 확인합니다.
  4. 앱을 10초 이상 백그라운드로 보낸 다음 포그라운드로 가져옵니다. 새 세션이 기록되었는지 확인합니다.

선택적 구성

런타임 구성

braze.xml 파일이 아닌 코드에서 Braze 옵션을 설정하려면 런타임 구성을 사용하세요. 두 위치에 모두 값이 있는 경우 런타임 값이 대신 사용됩니다. 런타임에 모든 필수 설정이 제공되면 braze.xml 파일을 삭제할 수 있습니다.

다음 예제에서는 빌더 객체가 생성된 다음 Braze.configure(). 사용 가능한 런타임 옵션 중 일부만 표시되어 있으며, 전체 목록은 KDoc을 참조하세요.

1
2
3
4
5
6
7
8
BrazeConfig brazeConfig = new BrazeConfig.Builder()
        .setApiKey("api-key-here")
        .setCustomEndpoint("YOUR_CUSTOM_ENDPOINT_OR_CLUSTER")
        .setSessionTimeout(60)
        .setHandlePushDeepLinksAutomatically(true)
        .setGreatNetworkDataFlushInterval(10)
        .build();
Braze.configure(this, brazeConfig);
1
2
3
4
5
6
7
8
val brazeConfig = BrazeConfig.Builder()
        .setApiKey("api-key-here")
        .setCustomEndpoint("YOUR_CUSTOM_ENDPOINT_OR_CLUSTER")
        .setSessionTimeout(60)
        .setHandlePushDeepLinksAutomatically(true)
        .setGreatNetworkDataFlushInterval(10)
        .build()
Braze.configure(this, brazeConfig)

구글 광고 ID

Google 광고 ID(GAID) 는 Google Play 서비스에서 제공하는 광고용 선택적 사용자별 익명 고유 ID로, 재설정이 가능합니다. GAID를 통해 사용자는 자신의 식별자를 재설정하고 Google Play 앱 내에서 관심 기반 광고를 옵트아웃할 수 있으며, 개발자는 간단한 표준 시스템으로 앱에서 지속적으로 수익을 창출할 수 있습니다.

Google 광고 ID는 Braze SDK에서 자동으로 수집되지 않으며, Braze.setGoogleAdvertisingId() 메서드를 통해 수동으로 설정해야 합니다.

1
2
3
4
5
6
7
8
9
10
11
new Thread(new Runnable() {
  @Override
  public void run() {
    try {
      AdvertisingIdClient.Info idInfo = AdvertisingIdClient.getAdvertisingIdInfo(getApplicationContext());
      Braze.getInstance(getApplicationContext()).setGoogleAdvertisingId(idInfo.getId(), idInfo.isLimitAdTrackingEnabled());
    } catch (Exception e) {
      e.printStackTrace();
    }
  }
}).start();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
suspend fun fetchAndSetAdvertisingId(
  context: Context,
  scope: CoroutineScope = GlobalScope
) {
  scope.launch(Dispatchers.IO) {
    try {
      val idInfo = AdvertisingIdClient.getAdvertisingIdInfo(context)
      Braze.getInstance(context).setGoogleAdvertisingId(
        idInfo.id,
        idInfo.isLimitAdTrackingEnabled
      )
    } catch (e: Exception) {
      e.printStackTrace()
    }
  }
}

위치 추적

Braze 위치 수집을 인에이블먼트하려면 braze.xml 파일에서 com_braze_enable_location_collectiontrue 으로 설정하세요:

1
<bool name="com_braze_enable_location_collection">true</bool>

로깅

기본적으로 Braze Android SDK 로그 수준은 INFO로 설정되어 있습니다. 이러한 로그를 억제하거나 VERBOSE, DEBUG 또는 WARN과 같은 여러 로그 수준을 설정할 수 있습니다 .

로그 인에이블먼트

앱의 문제를 해결하거나 Braze 지원팀과의 문제 처리 시간을 단축하기 위해 SDK에 대한 상세 로그를 활성화할 수 있습니다. 상세 로그를 Braze 지원팀에 보낼 때 애플리케이션을 실행하자마자 로깅을 시작하여 문제가 발생하고 한참 후에 종료해야 합니다.

상세 로그는 개발 환경 전용이므로 앱을 출시하기 전에 비활성화하는 것이 좋습니다.

앱에서 직접 로그를 활성화하려면 다른 메서드보다 먼저 애플리케이션의 onCreate() 메서드에 다음을 추가합니다.

1
BrazeLogger.setLogLevel(Log.MIN_LOG_LEVEL);
1
BrazeLogger.logLevel = Log.MIN_LOG_LEVEL

MIN_LOG_LEVEL을 최소 로그 수준으로 설정하려는 로그 수준의 상수로 바꿉니다. 설정된 MIN_LOG_LEVEL 이상(>=) 수준의 모든 로그는 Android의 기본 Log 메서드로 전달됩니다. 설정된 MIN_LOG_LEVEL 수준 아래(<)의 모든 로그는 삭제됩니다.

예를 들어 다음 코드는 2, 3, 4, 5, 6, 7의 로그 수준을 Log 메서드에 전달합니다.

1
BrazeLogger.setLogLevel(Log.VERBOSE);
1
BrazeLogger.logLevel = Log.VERBOSE

braze.xml에서 로그를 활성화하려면 파일에 다음을 추가합니다.

1
<integer name="com_braze_logger_initial_log_level">MIN_LOG_LEVEL</integer>

MIN_LOG_LEVEL을 최소 로그 수준으로 설정하려는 로그 수준의 으로 바꿉니다. 설정된 MIN_LOG_LEVEL 이상(>=) 수준의 모든 로그는 Android의 기본 Log 메서드로 전달됩니다. 설정된 MIN_LOG_LEVEL 수준 아래(<)의 모든 로그는 삭제됩니다.

예를 들어 다음 코드는 2, 3, 4, 5, 6, 7의 로그 수준을 Log 메서드에 전달합니다.

1
<integer name="com_braze_logger_initial_log_level">2</integer>

상세 로그 확인

로그가 VERBOSE로 설정되어 있는지 확인하려면 로그의 어딘가에 V/Braze가 있는지 확인합니다. 그러면 상세 로그가 활성화된 것입니다. 예를 들어, 다음과 같습니다.

1
2077-11-19 16:22:49.591 ? V/Braze v9.0.01 .bo.app.d3: Request started

로그 억제

Braze 소프트웨어 개발 키트에 대한 모든 로그를 억제하려면 다른 방법보다 먼저 애플리케이션의 onCreate() 메서드에서 로그 수준을 BrazeLogger.SUPPRESS 로 설정하세요.

1
BrazeLogger.setLogLevel(BrazeLogger.SUPPRESS);
1
BrazeLogger.setLogLevel(BrazeLogger.SUPPRESS)

여러 API 키

여러 API 키의 가장 일반적인 사용 사례는 디버그 및 릴리스 빌드 배리언트에 대한 API 키를 분리하는 것입니다.

빌드에서 여러 API 키 사이를 쉽게 전환하려면 각 관련 빌드 배리언트에 대해 별도의 braze.xml 파일을 만드는 것이 좋습니다. 빌드 배리언트는 빌드 유형과 제품 버전의 조합입니다. 기본적으로 새 Android 프로젝트는 debugrelease 빌드 유형으로 구성되며 제품 플레이버는 없습니다.

각 관련 구축 배리언트에 대해 src/<build variant name>/res/values/ 디렉터리에 braze.xml 을 새로 만듭니다. 빌드 변형이 컴파일되면 새 API 키를 사용합니다.

1
2
3
4
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="com_braze_api_key">REPLACE_WITH_YOUR_BUILD_VARIANT_API_KEY</string>
</resources>

독점 인앱 메시지 TalkBack

Android 접근성 가이드라인을 준수하기 위해 Braze 소프트웨어 개발 키트에서는 기본값으로 Android 토크백을 제공합니다. 앱 제목 표시줄이나 내비게이션과 같은 다른 화면 요소를 포함하지 않고 인앱 메시지 내용만 소리로 읽도록 하려면 TalkBack 전용 모드를 인에이블먼트하면 됩니다.

인앱 메시지 전용 모드를 인에이블먼트합니다:

1
<bool name="com_braze_device_in_app_message_accessibility_exclusive_mode_enabled">true</bool>
1
2
3
val brazeConfigBuilder = BrazeConfig.Builder()
brazeConfigBuilder.setIsInAppMessageAccessibilityExclusiveModeEnabled(true)
Braze.configure(this, brazeConfigBuilder.build())
1
2
3
BrazeConfig.Builder brazeConfigBuilder = new BrazeConfig.Builder()
brazeConfigBuilder.setIsInAppMessageAccessibilityExclusiveModeEnabled(true);
Braze.configure(this, brazeConfigBuilder.build());

R8 및 ProGuard

코드 축소 구성은 Braze 통합에 자동으로 포함됩니다.

Braze 코드를 난독화하는 클라이언트 앱은 Braze가 스택 추적을 해석할 수 있도록 릴리스 매핑 파일을 저장해야 합니다. 모든 Braze 코드를 계속 유지하려면 ProGuard 파일에 다음을 추가합니다.

1
2
-keep class bo.app.** { *; }
-keep class com.braze.** { *; }

Swift SDK 통합하기

스위프트 패키지 매니저(SPM), 코코아팟 또는 수동 통합 방법을 사용하여 Braze Swift SDK를 통합하고 커스텀할 수 있습니다. 다양한 소프트웨어 개발 키트 심볼에 대한 자세한 내용은 Braze Swift 참조 설명서를 참조하세요.

필수 조건

시작하기 전에 사용 중인 환경이 최신 Braze Swift 소프트웨어 개발 키트 버전으로 지원되는지 확인하세요.

1단계: Braze Swift 소프트웨어 개발 키트 설치하기

스위프트 패키지 매니저(SwiftPM) 또는 코코아팟을 사용하여 Braze Swift 소프트웨어 개발 키트를 설치하는 것이 좋습니다. 또는 소프트웨어 개발 키트를 수동으로 설치할 수도 있습니다.

1.1단계: SDK 버전 가져오기

프로젝트를 열고 프로젝트 설정으로 이동합니다. Swift 패키지 탭을 선택하고 패키지 목록 아래에 있는 추가 버튼을 클릭합니다.

텍스트 필드에 iOS Swift SDK 리포지토리 URL(https://github.com/braze-inc/braze-swift-sdk)을 입력합니다. 종속성 규칙 섹션에서 SDK 버전을 선택합니다. 마지막으로 패키지 추가를 클릭합니다.

1.2단계: 패키지 선택

Braze Swift SDK는 기능을 독립형 라이브러리로 분리하여 개발자가 프로젝트에 가져올 기능을 더 잘 제어할 수 있도록 합니다.

패키지 세부 정보
BrazeKit 분석 및 푸시 알림을 지원하는 기본 SDK 라이브러리입니다.
BrazeLocation 위치 분석 및 지오펜스 모니터링을 지원하는 위치 라이브러리를 제공합니다.
BrazeUI 인앱 메시지, 콘텐츠 카드, 배너를 위한 Braze가 제공하는 사용자 인터페이스 라이브러리입니다. 기본값 UI 컴포넌트를 사용하려는 경우 이 라이브러리를 가져옵니다.
확장 라이브러리 정보
패키지 세부 정보
BrazeNotificationService 풍부한 푸시 알림을 지원하는 알림 서비스 확장 라이브러리입니다.
BrazePushStory 푸시 스토리를 지원하는 알림 콘텐츠 확장 라이브러리입니다.

필요에 가장 적합한 패키지를 선택하고 패키지 추가를 클릭합니다. 최소한 BrazeKit를 선택해야 합니다.

1.1단계: CocoaPods 설치

전체 안내는 CocoaPods 시작하기 가이드를 참조하세요. 그렇지 않은 경우 다음 명령을 실행하여 빠르게 시작할 수 있습니다:

1
$ sudo gem install cocoapods

문제가 발생하면 CocoaPods의 문제 해결 가이드를 확인하세요.

1.2단계: Podfile 구성

그런 다음 Xcode 프로젝트 디렉토리에 Podfile 라는 파일을 만듭니다.

포드파일에 다음 줄을 추가합니다:

1
2
3
target 'YourAppTarget' do
  pod 'BrazeKit'
end

BrazeKit에는 분석 및 푸시 알림을 지원하는 기본 SDK 라이브러리가 포함되어 있습니다.

포드 업데이트에서 부 버전 업데이트보다 작은 내용을 자동으로 가져올 수 있도록 Braze 버전을 설정하는 것이 좋습니다. pod 'BrazeKit' ~> Major.Minor.Build와 유사합니다. 최신 Braze SDK 버전을 자동으로 통합하려면 주요 변경 사항이 있어도 Podfile에서 pod 'BrazeKit'를 사용하면 됩니다.

추가 라이브러리 정보

Braze Swift SDK는 기능을 독립형 라이브러리로 분리하여 개발자가 프로젝트에 가져올 기능을 더 잘 제어할 수 있도록 합니다. BrazeKit 외에도 다음 라이브러리를 Podfile에 추가할 수 있습니다.

라이브러리 세부 정보
pod 'BrazeLocation' 위치 분석 및 지오펜스 모니터링을 지원하는 위치 라이브러리를 제공합니다.
pod 'BrazeUI' 인앱 메시지, 콘텐츠 카드, 배너를 위한 Braze가 제공하는 사용자 인터페이스 라이브러리입니다. 기본값 UI 컴포넌트를 사용하려는 경우 이 라이브러리를 가져옵니다.
확장 라이브러리

BrazeNotificationServiceBrazePushStory는 추가 기능을 제공하는 확장 모듈이며, 메인 애플리케이션 대상에 직접 추가해서는 안 됩니다. 대신, 이러한 모듈 각각에 대해 별도의 확장 대상을 생성하고 해당 대상으로 Braze 모듈을 가져와야 합니다.

라이브러리 세부 정보
pod 'BrazeNotificationService' 풍부한 푸시 알림을 지원하는 알림 서비스 확장 라이브러리입니다.
pod 'BrazePushStory' 푸시 스토리를 지원하는 알림 콘텐츠 확장 라이브러리입니다.

1.3단계: 소프트웨어 개발 키트 설치하기

Braze SDK CocoaPod을 설치하려면 터미널에서 Xcode 앱 프로젝트 디렉토리로 이동한 후 다음 명령어를 실행합니다.

1
pod install

이때 CocoaPods에서 생성한 새 Xcode 프로젝트 워크스페이스를 열 수 있어야 합니다. Xcode 프로젝트 대신 이 Xcode 워크스페이스를 사용해야 합니다.

Braze 예제 폴더가 확장되어 새로운 `BrazeExample.workspace`.

CocoaPods를 사용하여 소프트웨어 개발 키트 업데이트하기

CocoaPod를 업데이트하려면 프로젝트 디렉토리에서 다음 명령을 실행하면 됩니다:

1
pod update

1.1단계: Braze SDK 다운로드

GitHub의 Braze SDK 릴리스 페이지로 이동한 다음, braze-swift-sdk-prebuilt.zip을 다운로드합니다.

'GitHub의 Braze SDK 릴리스 페이지.'

1.2단계: 프레임워크 선택

Braze Swift SDK에는 다양한 독립형 XCFrameworks가 포함되어 있어 모든 기능을 통합할 필요 없이 원하는 기능을 자유롭게 통합할 수 있습니다. 다음 표를 참조하여 XCFrameworks를 선택합니다.

패키지 필수 항목인가요? 설명
BrazeKit 분석 및 푸시 알림을 지원하는 기본 SDK 라이브러리입니다.
BrazeLocation 아니요 위치 분석 및 지오펜스 모니터링을 지원하는 위치 라이브러리입니다.
BrazeUI 아니요 인앱 메시지, 콘텐츠 카드, 배너를 위한 Braze가 제공하는 사용자 인터페이스 라이브러리입니다. 기본값 UI 컴포넌트를 사용하려는 경우 이 라이브러리를 가져옵니다.
BrazeNotificationService 아니요 리치 푸시 알림을 지원하는 알림 서비스 확장 라이브러리입니다. 이 라이브러리를 기본 애플리케이션 대상에 직접 추가하지 말고 BrazeNotificationService 라이브러리를 별도로 추가합니다.
BrazePushStory 아니요 푸시 스토리를 지원하는 알림 콘텐츠 확장 라이브러리입니다. 이 라이브러리를 기본 애플리케이션 대상에 직접 추가하지 말고 BrazePushStory 라이브러리를 별도로 추가합니다.
BrazeKitCompat 아니요 Appboy-iOS-SDK 버전 4.X.X에서 사용 가능했던 모든 AppboyABK* 클래스 및 메서드가 포함된 호환성 라이브러리. 사용법에 대한 자세한 내용은 마이그레이션 가이드의 최소 마이그레이션 시나리오를 참조하세요.
BrazeUICompat 아니요 Appboy-iOS-SDK 버전 4.X.X부터 AppboyUI 라이브러리에서 사용 가능했던 모든 ABK* 클래스 및 메서드가 포함된 호환성 라이브러리. 사용법에 대한 자세한 내용은 마이그레이션 가이드의 최소 마이그레이션 시나리오를 참조하세요.
SDWebImage 아니요 최소 마이그레이션 시나리오에서 BrazeUICompat 에서만 사용하는 종속성입니다.

정적 XCFrameworks를 사용할지 동적 XCFrameworks를 사용할지 결정한 다음, 파일을 준비합니다.

  1. XCFrameworks의 임시 디렉토리를 생성합니다.
  2. braze-swift-sdk-prebuilt에서 dynamic 디렉토리를 열고 BrazeKit.xcframework를 디렉토리로 이동합니다. 디렉터리는 다음과 비슷해야 합니다:
    1
    2
    
     temp_dir
     └── BrazeKit.xcframework
    
  3. 선택한 XCFrameworks를 임시 디렉토리로 이동합니다. 디렉터리는 다음과 비슷해야 합니다:
    1
    2
    3
    4
    5
    
     temp_dir
     ├── BrazeKit.xcframework
     ├── BrazeKitCompat.xcframework
     ├── BrazeLocation.xcframework
     └── SDWebImage.xcframework
    

1.4단계: 프레임워크 통합

다음으로, 이전에 준비동적 또는 정적 XCFrameworks를 통합합니다.

Xcode 프로젝트에서 빌드 대상을 선택한 다음, 일반을 선택합니다. 프레임워크, 라이브러리 및 임베디드 콘텐츠에서 이전에 준비한 파일을 끌어다 놓습니다.

'각 Braze 라이브러리가 '임베드 및 서명'으로 설정된 예제 Xcode 프로젝트.'

Objective-C 프로젝트의 일반적인 오류

Xcode 프로젝트에 Objective-C 파일만 포함된 경우 프로젝트를 빌드하려고 할 때 ‘누락된 기호’ 오류가 발생할 수 있습니다. 이러한 오류를 해결하려면 프로젝트를 열고 파일 트리에 빈 Swift 파일을 추가합니다. 그러면 빌드 툴체인에 Swift 런타임이 강제로 임베드되고 빌드 시간 동안 적절한 프레임워크에 링크됩니다.

1
FILE_NAME.swift

FILE_NAME 을 띄어쓰기가 없는 문자열로 바꿉니다. 파일은 다음과 비슷하게 보일 것입니다:

1
empty_swift_file.swift

2단계: 지연 초기화 설정(선택 사항)

Braze Swift 소프트웨어 개발 키트가 초기화되는 시기를 지연하도록 선택할 수 있으며, 이는 앱에서 구성을 로드하거나 SDK를 시작하기 전에 사용자 동의를 기다려야 하는 경우에 유용합니다. 초기화가 지연되면 소프트웨어 개발 키트가 준비될 때까지 Braze 푸시 알림이 대기줄에 대기합니다.

이 기능을 인에이블하려면 가능한 한 빨리 Braze.prepareForDelayedInitialization() 으로 전화하여 application(_:didFinishLaunchingWithOptions:).

1
2
3
4
5
6
7
8
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
  // Prepare the SDK for delayed initialization
  Braze.prepareForDelayedInitialization()

  // ... Additional non-Braze setup code

  return true
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
@main
struct MyApp: App {
  @UIApplicationDelegateAdaptor var appDelegate: AppDelegate

  var body: some Scene {
    WindowGroup {
      ContentView()
    }
  }
}

class AppDelegate: NSObject, UIApplicationDelegate {
  func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil) -> Bool {
    // Prepare the SDK for delayed initialization
    Braze.prepareForDelayedInitialization()

    // ... Additional non-Braze setup code

    return true
  }
}
1
2
3
4
5
6
7
8
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  // Prepare the SDK for delayed initialization
  [Braze prepareForDelayedInitialization];
  
  // ... Additional non-Braze setup code

  return YES;
}

3단계: 앱 대리자를 업데이트하세요

Braze Swift SDK에 포함된 기능을 가져오기 위해 다음 코드를 AppDelegate.swift 파일에 추가합니다.

1
import BrazeKit

다음으로, AppDelegate 클래스에 정적 속성정보를 추가하여 애플리케이션의 수명 동안 Braze 인스턴스에 대한 강력한 참조를 유지합니다.

1
2
3
class AppDelegate: UIResponder, UIApplicationDelegate {
  static var braze: Braze? = nil
}

마지막으로, AppDelegate.swift에서 다음 스니펫을 application:didFinishLaunchingWithOptions: 메서드에 추가하십시오:

1
2
3
4
5
6
let configuration = Braze.Configuration(
    apiKey: "YOUR-APP-IDENTIFIER-API-KEY",
    endpoint: "YOUR-BRAZE-ENDPOINT"
)
let braze = Braze(configuration: configuration)
AppDelegate.braze = braze

YOUR-APP-IDENTIFIER-API-KEYYOUR-BRAZE-ENDPOINT을(를) 앱 설정 페이지에서 올바른 값으로 업데이트하십시오. 앱 식별자 API 키를 찾을 수 있는 위치에 대한 자세한 내용은 API 식별자 유형을 참조하세요.

다음 코드 줄을 AppDelegate.m 파일에 추가하십시오:

1
@import BrazeKit;

다음으로, AppDelegate.m 파일에 정적 변수를 추가하여 애플리케이션의 수명 동안 Braze 인스턴스에 대한 참조를 유지합니다.

1
2
3
4
5
6
7
8
9
10
11
static Braze *_braze;

@implementation AppDelegate
+ (Braze *)braze {
  return _braze;
}

+ (void)setBraze:(Braze *)braze {
  _braze = braze;
}
@end

마지막으로, AppDelegate.m 파일 내에서 application:didFinishLaunchingWithOptions: 메서드 내에 다음 스니펫을 추가합니다.

1
2
3
4
BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:"YOUR-APP-IDENTIFIER-API-KEY"
                                                                  endpoint:"YOUR-BRAZE-ENDPOINT"];
Braze *braze = [[Braze alloc] initWithConfiguration:configuration];
AppDelegate.braze = braze;

YOUR-APP-IDENTIFIER-API-KEYYOUR-BRAZE-ENDPOINT을(를) 설정 관리 페이지에서 올바른 값으로 업데이트하십시오. 앱 식별자 API 키를 찾을 수 있는 위치에 대한 자세한 내용은 API 설명서를 참조하세요.

선택적 구성

로깅

로그 레벨

Braze Swift 소프트웨어 개발 키트의 기본값 로그 수준은 .error이며, 로그가 인에이블먼트된 경우 지원되는 최소 수준이기도 합니다. 다음은 로그 레벨의 전체 목록입니다:

Swift Objective-C 설명
.debug BRZLoggerLevelDebug (기본값) 로그 디버깅 정보 + .info + .error.
.info BRZLoggerLevelInfo 일반 SDK 정보(사용자 변경 사항 등) + .error를 기록합니다.
.error BRZLoggerLevelError 로그 오류.
.disabled BRZLoggerLevelDisabled 로깅이 발생하지 않습니다.

Braze.Configuration 객체에서 런타임에 로그 수준을 지정할 수 있습니다. 전체 사용법에 대한 자세한 내용은 Braze.Configuration.Logger.

1
2
3
4
5
6
7
let configuration = Braze.Configuration(
  apiKey: "<BRAZE_API_KEY>",
  endpoint: "<BRAZE_ENDPOINT>"
)
// Enable logging of general SDK information (such as user changes, etc.)
configuration.logger.level = .info
let braze = Braze(configuration: configuration)
1
2
3
4
5
BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:self.APIKey
                                                                  endpoint:self.apiEndpoint];
// Enable logging of general SDK information (such as user changes, etc.)
[configuration.logger setLevel:BRZLoggerLevelInfo];
Braze *braze = [[Braze alloc] initWithConfiguration:configuration];

Web Braze 소프트웨어 개발 키트 소개

웹 Braze SDK를 사용하면 분석을 수집하고 리치 인앱 메시지, 푸시 및 콘텐츠 카드 메시지를 웹 사용자에게 표시할 수 있습니다. 자세한 내용은 Braze JavaScript 참조 설명서를 참조하세요.

웹 SDK 통합하기

다음 방법을 사용하여 Web Braze SDK를 통합할 수 있습니다. 추가 옵션은 다른 통합 방법을 참조하세요.

  • 코드 기반 통합: 선호하는 패키지 매니저 또는 Braze CDN을 사용하여 코드베이스에 직접 Web Braze SDK를 통합하세요. 이렇게 하면 소프트웨어 개발 키트를 로드하고 구성하는 방법을 완전히 제어할 수 있습니다.
  • Google Tag Manager: 사이트의 코드를 수정하지 않고도 Web Braze SDK를 통합할 수 있는 노코드 솔루션입니다. 자세한 내용은 Braze 소프트웨어 개발 키트와 Google Tag Manager를 참조하세요.

1단계: Braze 라이브러리 설치

다음 방법 중 하나를 사용하여 Braze 라이브러리를 설치할 수 있습니다. 그러나 웹사이트가 Content-Security-Policy 을 사용하는 경우 계속하기 전에 콘텐츠 보안 정책을 검토하세요.

사이트에서 NPM 또는 Yarn 패키지 관리자를 사용하는 경우 Braze NPM 패키지를 종속성으로 추가할 수 있습니다.

이제 v3.0.0부터 Typescript 정의가 포함됩니다. 2.x에서 3.x로 업그레이드할 때 참고할 사항은 체인지로그를 참조하세요.

1
2
3
npm install --save @braze/web-sdk
# or, using yarn:
# yarn add @braze/web-sdk

설치가 완료되면 일반적인 방법으로 라이브러리의 import 또는 require 작업을 수행할 수 있습니다.

1
2
3
import * as braze from "@braze/web-sdk";
// or, using `require`
const braze = require("@braze/web-sdk");

라이브러리를 비동기적으로 로드하는 CDN 호스팅 스크립트를 참조하여 Braze 웹 SDK를 HTML에 직접 추가합니다.

2단계: SDK 초기화

웹사이트에 Braze 웹 SDK를 추가한 후, Braze 대시보드의 설정 > 앱 설정에 있는 API 키와 SDK 엔드포인트 URL로 라이브러리를 초기화하세요. braze.initialize() 에 대한 전체 옵션 목록과 다른 JavaScript 메서드에 대한 자세한 내용은 Braze JavaScript 설명서를 참조하세요.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// initialize the SDK
braze.initialize('YOUR-API-KEY-HERE', {
    baseUrl: "YOUR-SDK-ENDPOINT-HERE",
    enableLogging: false, // set to `true` for debugging
    allowUserSuppliedJavascript: false, // set to `true` to support custom HTML messages
});

// optionally show all in-app messages without custom handling
braze.automaticallyShowInAppMessages();

// if you use Content Cards
braze.subscribeToContentCardsUpdates(function(cards){
    // cards have been updated
});

// optionally set the current user's external ID before starting a new session
// you can also call `changeUser` later in the session after the user logs in
if (isLoggedIn){
    braze.changeUser(userIdentifier);
}

// `openSession` should be called last - after `changeUser` and `automaticallyShowInAppMessages`
braze.openSession();

필수 조건

이 통합 방법을 사용하려면 먼저 Google 태그 매니저용 계정과 컨테이너를 만들어야 합니다.

1단계: 태그 템플릿 갤러리 열기

Google 태그 관리자에서 작업 공간을 선택한 다음 템플릿을 선택합니다. 태그 템플릿 창에서 갤러리 검색을 선택합니다.

Google Tag Manager의 예제 워크스페이스에 대한 템플릿 페이지

2단계: 초기화 태그 템플릿 추가하기

템플릿 갤러리에서 braze-inc 를 검색한 다음 Braze 초기화 태그를 선택합니다.

다양한 'Braze-inc' 템플릿을 보여주는 템플릿 갤러리.

작업 공간에 추가> 추가를 선택합니다.

Google Tag Manager의 'Braze 초기화 태그' 페이지

3단계: 태그 구성

템플릿 섹션에서 새로 추가한 템플릿을 선택합니다.

Braze 초기화 태그 템플릿이 표시된 Google Tag Manager의 "템플릿" 페이지

연필 아이콘을 선택하여 태그 구성 드롭다운을 엽니다.

'연필' 아이콘이 표시된 태그 구성 타일

최소한의 필수 정보를 입력합니다:

추가 초기화 설정을 하려면 Braze 초기화 옵션을 선택하고 필요한 옵션을 선택합니다.

'태그 구성' 아래의 Braze 초기화 옵션 목록

4단계: 모든 페이지에서 트리거하도록 설정

초기화 태그는 사이트의 모든 페이지에서 실행되어야 합니다. 이를 통해 Braze 소프트웨어 개발 키트 메소드를 사용하고 웹 푸시 분석을 기록할 수 있습니다.

5단계: 통합 확인

다음 옵션 중 하나를 사용하여 통합을 확인할 수 있습니다:

  • Option 1: Google Tag Manager의 디버깅 툴을 사용하여 구성된 페이지 또는 이벤트에서 Braze 초기화 태그가 올바르게 트리거되는지 확인할 수 있습니다.
  • Option 2: 웹 페이지에서 Braze에 대한 네트워크 요청이 있는지 확인하세요. 또한 이제 글로벌 window.braze 라이브러리를 정의해야 합니다.

선택적 구성

로깅

로깅을 빠르게 활성화하려면 웹사이트 URL에 ?brazeLogging=true를 매개변수로 추가하면 됩니다. 또는 기본 또는 사용자 지정 로깅을 사용 설정할 수 있습니다.

기본 로깅

소프트웨어 개발 키트를 초기화하기 전에 enableLogging 을 사용하여 기본 디버깅 메시지를 JavaScript 콘솔에 기록하세요.

1
enableLogging: true

방법은 다음과 유사해야 합니다:

1
2
3
4
5
braze.initialize('API-KEY', {
    baseUrl: 'API-ENDPOINT',
    enableLogging: true
});
braze.openSession();

소프트웨어 개발 키트가 초기화된 후 기본 디버깅 메시지를 JavaScript 콘솔에 기록하려면 braze.toggleLogging() 을 사용하세요. 방법은 다음과 유사해야 합니다:

1
2
3
4
5
6
braze.initialize('API-KEY', {
    baseUrl: 'API-ENDPOINT',
});
braze.openSession();
...
braze.toggleLogging();

사용자 지정 로깅

setLogger 을 사용하여 커스텀 디버깅 메시지를 JavaScript 콘솔에 기록하세요. 기본 로그와 달리 이러한 로그는 사용자에게 표시되지 않습니다.

1
setLogger(loggerFunction: (message: STRING) => void): void

STRING 를 단일 문자열 매개변수로 메시지로 바꿉니다. 방법은 다음과 유사해야 합니다:

1
2
3
4
5
braze.initialize('API-KEY');
braze.setLogger(function(message) {
    console.log("Braze Custom Logger: " + message);
});
braze.openSession();

SDK 업그레이드하기

기본 통합 지침에서 권장하는 대로 콘텐츠 전송 네트워크(예: https://js.appboycdn.com/web-sdk/a.a/braze.min.js)에서 Braze 웹 SDK를 참조하면 사용자가 사이트를 새로 고칠 때 자동으로 사소한 업데이트(위 예제에서 버그 수정 및 역호환 가능한 기능, a.a.a~a.a.z 버전)를 수신합니다.

그러나 주요 변경 사항을 출시할 때는 주요 변경 사항이 통합 기능에 영향을 주지 않도록 하기 위해 Braze 웹 SDK를 수동으로 업그레이드해야 합니다. 또한 SDK를 다운로드하여 직접 호스팅하는 경우 버전 업데이트를 자동으로 수신하지 않으므로 최신 기능 및 버그 수정을 수신하려면 수동으로 업그레이드해야 합니다.

RSS 리더 또는 원하는 서비스를 사용하여 릴리스 피드를 따라 최신 릴리스를 최신 상태로 유지할 수 있습니다. 웹 SDK 릴리스 내역에 대한 전체 설명은 체인지로그를 참조하세요. Braze 웹 SDK를 업그레이드하려면:

  • https://js.appboycdn.com/web-sdk/[OLD VERSION NUMBER]/braze.min.js의 버전 번호를 변경하거나 패키지 매니저의 종속성에서 Braze 라이브러리 버전을 업데이트합니다.
  • 웹 푸시가 통합된 경우 사이트의 서비스 종사자 파일을 업데이트합니다. 기본적으로 사이트의 루트 디렉토리 내 /service-worker.js에 있지만 일부 통합에서는 위치를 사용자 지정할 수 있습니다. 서비스 워커 파일을 호스팅하려면 루트 디렉터리에 액세스해야 합니다.

이 두 파일은 적절한 기능을 위해 서로 조정하여 업데이트해야 합니다.

기타 통합 방법

가속 모바일 페이지(AMP)

자세히 보기

1단계: AMP 웹 푸시 스크립트 포함

다음 비동기 스크립트 태그를 기억합니다.

1
<script async custom-element="amp-web-push" src="https://cdn.ampproject.org/v0/amp-web-push-0.1.js"></script>

2단계: 구독 위젯 추가

사용자가 푸시에 가입하고 탈퇴할 수 있는 위젯을 HTML 본문에 추가하세요.

1
2
3
4
5
6
7
8
9
<!-- A subscription widget -->
<amp-web-push-widget visibility="unsubscribed" layout="fixed" width="250" height="80">
  <button on="tap:amp-web-push.subscribe">Subscribe to Notifications</button>
</amp-web-push-widget>

<!-- An unsubscription widget -->
<amp-web-push-widget visibility="subscribed" layout="fixed" width="250" height="80">
  <button on="tap:amp-web-push.unsubscribe">Unsubscribe from Notifications</button>
</amp-web-push-widget>

3단계: helper-iframepermission-dialog

AMP 웹 푸시 컴포넌트는 푸시 구독을 처리하는 팝업을 생성하므로 이 기능을 인에이블먼트하려면 프로젝트에 다음 헬퍼 파일을 추가해야 합니다:

4단계: 서비스 워커 파일 만들기

웹사이트의 루트 디렉토리에 service-worker.js 파일을 만들고 다음 스니펫을 추가합니다:

5단계: AMP 웹 푸시 HTML 요소 구성

HTML 본문에 다음 amp-web-push HTML 요소를 추가합니다. apiKeybaseUrlservice-worker-URL 에 쿼리 매개 변수로 추가해야 한다는 점을 기억하세요.

1
2
3
4
5
6
7
<amp-web-push
layout="nodisplay"
id="amp-web-push"
helper-iframe-url="FILE_PATH_TO_YOUR_HELPER_IFRAME"
permission-dialog-url="FILE_PATH_TO_YOUR_PERMISSION_DIALOG"
service-worker-url="FILE_PATH_TO_YOUR_SERVICE_WORKER?apiKey={YOUR_API_KEY}&baseUrl={YOUR_BASE_URL}"
>

비동기 모듈 정의(AMD)

지원 비활성화하기

사이트에서 RequireJS 또는 다른 AMD 모듈 로더를 사용하지만 이 목록의 다른 옵션 중 하나를 통해 Braze 웹 SDK를 로드하려는 경우 AMD 지원이 포함되지 않은 라이브러리 버전을 로드할 수 있습니다. 이 라이브러리 버전은 다음 CDN 위치에서 로드할 수 있습니다:

모듈 로더

RequireJS 또는 기타 AMD module-loaders를 사용하는 경우 라이브러리 사본을 자체 호스팅하고 다른 리소스와 마찬가지로 참조하는 것이 좋습니다.

1
2
3
4
5
require(['path/to/braze.min.js'], function(braze) {
  braze.initialize('YOUR-API-KEY-HERE', { baseUrl: 'YOUR-SDK-ENDPOINT' });
  braze.automaticallyShowInAppMessages();
  braze.openSession();
});

전자

Electron은 웹 푸시 알림을 공식적으로 지원하지 않습니다(이 GitHub 이슈 참조). Braze에서 테스트하지 않은 다른 오픈 소스 해결 방법을 시도해 볼 수 있습니다.

재스트 프레임워크

Jest를 사용할 때 SyntaxError: Unexpected token 'export' 와 유사한 오류가 표시될 수 있습니다. 이 문제를 해결하려면 Braze SDK를 무시하도록 package.json에서 구성을 조정합니다.

1
2
3
4
5
"jest": {
  "transformIgnorePatterns": [
    "/node_modules/(?!@braze)"
  ]
}

SSR 프레임워크

Next.js 와 같은 서버 측 렌더링(SSR) 프레임워크를 사용하는 경우 소프트웨어 개발 키트가 브라우저 환경에서 실행되도록 되어 있기 때문에 오류가 발생할 수 있습니다. SDK를 동적으로 가져오면 이러한 문제를 해결할 수 있습니다.

SDK에서 필요한 부분을 별도의 파일로 내보낸 다음, 해당 파일을 구성요소에 동적으로 가져오는 방식으로 트리 셰이킹의 이점을 유지할 수 있습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// MyComponent/braze-exports.js
// export the parts of the SDK you need here
export { initialize, openSession } from "@braze/web-sdk";

// MyComponent/MyComponent.js
// import the functions you need from the braze exports file
useEffect(() => {
    import("./braze-exports.js").then(({ initialize, openSession }) => {
        initialize("YOUR-API-KEY-HERE", {
            baseUrl: "YOUR-SDK-ENDPOINT",
            enableLogging: true,
        });
        openSession();
    });
}, []);

또는 웹팩을 사용하여 앱을 번들링하는 경우 매직 코멘트를 활용하여 SDK의 필요한 부분만 동적으로 가져올 수 있습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
// MyComponent.js
useEffect(() => {
    import(
        /* webpackExports: ["initialize", "openSession"] */
        "@braze/web-sdk"
    ).then(({ initialize, openSession }) => {
        initialize("YOUR-API-KEY-HERE", {
            baseUrl: "YOUR-SDK-ENDPOINT",
            enableLogging: true,
        });
        openSession();
    });
}, []);

Tealium iQ

Tealium iQ는 기본적인 턴키 방식의 Braze 통합을 제공합니다. 통합을 구성하려면 Tealium 태그 관리 인터페이스에서 Braze를 검색하고 대시보드에서 웹 SDK API 키를 제공합니다.

자세한 내용이나 심층적인 Tealium 구성 지원은 통합 설명서를 확인하거나 Tealium 계정 관리자에게 문의하세요.

Vite

Vite를 사용할 때 순환 종속성 또는 Uncaught TypeError: Class extends value undefined is not a constructor or null에 대한 경고가 표시되는 경우 Braze SDK를 종속성 검색에서 제외해야 할 수 있습니다.

1
2
3
optimizeDeps: {
    exclude: ['@braze/web-sdk']
},

기타 태그 관리자

Braze는 사용자 지정 HTML 태그 내의 통합 지침에 따라 다른 태그 관리 솔루션과도 호환될 수 있습니다. 이러한 솔루션을 평가하는 데 도움이 필요하면 Braze 담당자에게 문의하세요.

Integrating the Cordova SDK

Prerequisites

Before you start, verify your environment is supported by the latest Braze Cordova SDK version.

Step 1: Add the SDK to your project

If you’re on Cordova 6 or later, you can add the SDK directly from GitHub. Alternatively, you can download a ZIP of the GitHub repository and add the SDK manually.

If you don’t plan on using location collection and geofences, use the master branch from GitHub.

1
cordova plugin add https://github.com/braze-inc/braze-cordova-sdk#master

If you plan on using location collection and geofences, use the geofence-branch from GitHub.

1
cordova plugin add https://github.com/braze-inc/braze-cordova-sdk#geofence-branch

Step 2: Configure your project

Next, adding the following preferences to the platform element in your project’s config.xml file.

1
2
<preference name="com.braze.ios_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.ios_api_endpoint" value="CUSTOM_API_ENDPOINT" />
1
2
<preference name="com.braze.android_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.android_api_endpoint" value="CUSTOM_API_ENDPOINT" />

Replace the following:

The platform element in your config.xml file should be similar to the following:

1
2
3
4
<platform name="ios">
    <preference name="com.braze.ios_api_key" value="BRAZE_API_KEY" />
    <preference name="com.braze.ios_api_endpoint" value="sdk.fra-01.braze.eu" />
</platform>
1
2
3
4
<platform name="android">
    <preference name="com.braze.android_api_key" value="BRAZE_API_KEY" />
    <preference name="com.braze.android_api_endpoint" value="sdk.fra-01.braze.eu" />
</platform>

Platform-specific syntax

The following section covers the platform-specific syntax when using Cordova with iOS or Android.

Integers

Integer preferences are read as string representations, like in the following example:

1
2
3
4
<platform name="ios">
    <preference name="com.braze.ios_flush_interval_seconds" value="10" />
    <preference name="com.braze.ios_session_timeout" value="5" />
</platform>

Due to how the Cordova 8.0.0+ framework handles preferences, integer-only preferences (such as sender IDs) must be set to strings prepended with str_, like in the following example:

1
2
3
4
<platform name="android">
    <preference name="com.braze.android_fcm_sender_id" value="str_64422926741" />
    <preference name="com.braze.android_default_session_timeout" value="str_10" />
</platform>

Booleans

Boolean preferences are read by the SDK using YES and NO keywords as a string representation, like in the following example:

1
2
3
4
<platform name="ios">
    <preference name="com.braze.should_opt_in_when_push_authorized" value="YES" />
    <preference name="com.braze.ios_disable_automatic_push_handling" value="NO" />
</platform>

Boolean preferences are read by the SDK using true and false keywords as a string representation, like in the following example:

1
2
3
4
<platform name="android">
    <preference name="com.braze.should_opt_in_when_push_authorized" value="true" />
    <preference name="com.braze.is_session_start_based_timeout_enabled" value="false" />
</platform>

Optional configurations

You can add any of the following preferences to the platform element in your project’s config.xml file:

The following is an example config.xml file with additional configurations:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<platform name="ios">
    <preference name="com.braze.ios_disable_automatic_push_registration" value="NO"/"YES" />
    <preference name="com.braze.ios_disable_automatic_push_handling" value="NO"/"YES" />
    <preference name="com.braze.ios_enable_idfa_automatic_collection" value="YES"/"NO" />
    <preference name="com.braze.enable_location_collection" value="NO"/"YES" />
    <preference name="com.braze.geofences_enabled" value="NO"/"YES" />
    <preference name="com.braze.ios_session_timeout" value="5" />
    <preference name="com.braze.sdk_authentication_enabled" value="YES"/"NO" />
    <preference name="com.braze.display_foreground_push_notifications" value="YES"/"NO" />
    <preference name="com.braze.ios_disable_un_authorization_option_provisional" value="NO"/"YES" />
    <preference name="com.braze.trigger_action_minimum_time_interval_seconds" value="30" />
    <preference name="com.braze.ios_push_app_group" value="PUSH_APP_GROUP_ID" />
    <preference name="com.braze.ios_forward_universal_links" value="YES"/"NO" />
    <preference name="com.braze.ios_log_level" value="2" />
    <preference name="com.braze.ios_use_uuid_as_device_id" value="YES"/"NO" />
    <preference name="com.braze.ios_flush_interval_seconds" value="10" />
    <preference name="com.braze.ios_use_automatic_request_policy" value="YES"/"NO" />
    <preference name="com.braze.should_opt_in_when_push_authorized" value="YES"/"NO" />
</platform>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<platform name="android">
    <preference name="com.braze.android_small_notification_icon" value="RESOURCE_ENTRY_NAME_FOR_ICON_DRAWABLE" />
    <preference name="com.braze.android_large_notification_icon" value="RESOURCE_ENTRY_NAME_FOR_ICON_DRAWABLE" />
    <preference name="com.braze.android_notification_accent_color" value="str_ACCENT_COLOR_INTEGER" />
    <preference name="com.braze.android_default_session_timeout" value="str_SESSION_TIMEOUT_INTEGER" />
    <preference name="com.braze.android_handle_push_deep_links_automatically" value="true"/"false" />
    <preference name="com.braze.android_log_level" value="str_LOG_LEVEL_INTEGER" />
    <preference name="com.braze.firebase_cloud_messaging_registration_enabled" value="true"/"false" />
    <preference name="com.braze.android_fcm_sender_id" value="str_YOUR_FCM_SENDER_ID" />
    <preference name="com.braze.enable_location_collection" value="true"/"false" />
    <preference name="com.braze.geofences_enabled" value="true"/"false" />
    <preference name="com.braze.android_disable_auto_session_tracking" value="true"/"false" />
    <preference name="com.braze.sdk_authentication_enabled" value="true"/"false" />
    <preference name="com.braze.trigger_action_minimum_time_interval_seconds" value="str_MINIMUM_INTERVAL_INTEGER" />
    <preference name="com.braze.is_session_start_based_timeout_enabled" value="false"/"true" />
    <preference name="com.braze.default_notification_channel_name" value="DEFAULT_NAME" />
    <preference name="com.braze.default_notification_channel_description" value="DEFAULT_DESCRIPTION" />
    <preference name="com.braze.does_push_story_dismiss_on_click" value="true"/"false" />
    <preference name="com.braze.is_fallback_firebase_messaging_service_enabled" value="true"/"false" />
    <preference name="com.braze.fallback_firebase_messaging_service_classpath" value="FALLBACK_FIREBASE_MESSAGING_CLASSPATH" />
    <preference name="com.braze.is_content_cards_unread_visual_indicator_enabled" value="true"/"false" />
    <preference name="com.braze.is_firebase_messaging_service_on_new_token_registration_enabled" value="true"/"false" />
    <preference name="com.braze.is_push_deep_link_back_stack_activity_enabled" value="true"/"false" />
    <preference name="com.braze.push_deep_link_back_stack_activity_class_name" value="DEEPLINK_BACKSTACK_ACTIVITY_CLASS_NAME" />
    <preference name="com.braze.should_opt_in_when_push_authorized" value="true"/"false" />
</platform>

Disabling automatic session tracking (Android only)

By default, the Android Cordova plugin automatically tracks sessions. To disable automatic session tracking, add the following preference to the platform element in your project’s config.xml file:

1
2
3
<platform name="android">
    <preference name="com.braze.android_disable_auto_session_tracking" value="true" />
</platform>

To start tracking sessions again, call BrazePlugin.startSessionTracking(). Keep in mind, only sessions started after the next Activity.onStart() will be tracked.

Flutter Braze 소프트웨어 개발 키트 소개

Android 및 iOS에서 Braze Flutter SDK를 통합하면 Dart로 작성된 Flutter 앱 내에서 Braze API를 사용할 수 있습니다. 이 플러그인은 기본적인 분석 기능을 제공하며, 이를 통해 단일 코드베이스에서 iOS 및 Android용 인앱 메시지와 콘텐츠 카드를 통합할 수 있습니다.

Flutter SDK 통합하기

필수 조건

Braze Flutter SDK를 통합하기 전에 다음을 완료해야 합니다:

1단계: Braze 라이브러리 통합

명령줄에서 Braze Flutter SDK 패키지를 추가합니다. 그러면 pubspec.yaml 에 적절한 줄이 추가됩니다.

1
flutter pub add braze_plugin

2단계: 완벽한 네이티브 소프트웨어 개발 키트 설정

Braze 서버에 연결하려면 프로젝트의 android/res/values 폴더에서 braze.xml 파일을 생성합니다. 다음 코드를 붙여넣고 API 식별자 키와 엔드포인트를 사용자 값으로 바꿉니다.

1
2
3
4
5
<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string translatable="false" name="com_braze_api_key">YOUR_APP_IDENTIFIER_API_KEY</string>
  <string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
</resources>

AndroidManifest.xml 파일에 필요한 권한을 추가합니다:

1
2
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

AppDelegate.swift 파일 상단에 Braze SDK 가져오기를 추가합니다:

1
2
import BrazeKit
import braze_plugin

같은 파일의 application(_:didFinishLaunchingWithOptions:) 메서드에서 Braze 구성 오브젝트를 생성하고 API 키와 엔드포인트를 앱의 값으로 바꿉니다. 그런 다음 구성을 사용하여 Braze 인스턴스를 생성하고 AppDelegate 에 정적 속성을 생성하여 쉽게 액세스할 수 있도록 합니다:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
static var braze: Braze? = nil

func application(
  _ application: UIApplication,
  didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil
) -> Bool {
  // Setup Braze
  let configuration = Braze.Configuration(
    apiKey: "<BRAZE_API_KEY>",
    endpoint: "<BRAZE_ENDPOINT>"
  )
  // - Enable logging or customize configuration here
  configuration.logger.level = .info
  let braze = BrazePlugin.initBraze(configuration)
  AppDelegate.braze = braze

  return true
}

AppDelegate.m 파일 상단에 있는 BrazeKit를 가져옵니다.

1
@import BrazeKit;

같은 파일의 application:didFinishLaunchingWithOptions: 메서드에서 Braze 구성 오브젝트를 생성하고 API 키와 엔드포인트를 앱의 값으로 바꿉니다. 그런 다음 구성을 사용하여 Braze 인스턴스를 생성하고 AppDelegate 에 정적 속성을 생성하여 쉽게 액세스할 수 있도록 합니다:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  // Setup Braze
  BRZConfiguration *configuration =
      [[BRZConfiguration alloc] initWithApiKey:@"<BRAZE_API_KEY>"
                                      endpoint:@"<BRAZE_ENDPOINT>"];
  // - Enable logging or customize configuration here
  configuration.logger.level = BRZLoggerLevelInfo;
  Braze *braze = [BrazePlugin initBraze:configuration];
  AppDelegate.braze = braze;

  [self.window makeKeyAndVisible];
  return YES;
}

#pragma mark - AppDelegate.braze

static Braze *_braze = nil;

+ (Braze *)braze {
  return _braze;
}

+ (void)setBraze:(Braze *)braze {
  _braze = braze;
}

3단계: 플러그인 설정

플러그인을 Dart 코드로 가져오려면 다음을 사용하세요:

1
import 'package:braze_plugin/braze_plugin.dart';

그런 다음, 샘플 앱에서와 같이 new BrazePlugin()을 호출하여 Braze 플러그인 인스턴스를 초기화합니다.

통합 테스트하기

대시보드에서 세션 통계를 확인하여 SDK가 통합되었는지 확인할 수 있습니다. 어느 플랫폼에서든 애플리케이션을 실행하면 대시보드( 개요 섹션)에 새 세션이 표시됩니다.

앱에서 다음 코드를 호출하여 특정 사용자에 대한 세션을 엽니다.

1
2
BrazePlugin braze = BrazePlugin();
braze.changeUser("{some-user-id}");

대시보드의 오디언스 > 사용자 검색에서 {some-user-id} 으로 사용자를 검색합니다. 여기에서 세션 및 디바이스 데이터가 기록되었는지 확인할 수 있습니다.

React Native Braze 소프트웨어 개발 키트 소개

React Native Braze SDK를 통합하면 기본 분석 기능을 제공하고 단 하나의 코드베이스로 iOS 및 Android용 인앱 메시지와 콘텐츠 카드를 통합할 수 있습니다.

새로운 아키텍처 호환성

다음 최소 소프트웨어 개발 키트 버전은 React Native의 새 아키텍처를 사용하는 모든 앱과 호환됩니다:

소프트웨어 개발 키트 버전 6.0.0부터 Braze는 새로운 아키텍처 및 레거시 브리지 아키텍처와 모두 호환되는 React Native Turbo 모듈을 사용하므로 추가 설정이 필요하지 않습니다.

React Native SDK 통합하기

필수 조건

SDK를 통합하려면 React Native 버전 0.71 이상이 필요합니다. 지원되는 버전의 전체 목록은 React Native SDK GitHub 리포지토리를 참조하세요.

1단계: Braze 라이브러리 통합

1
npm install @braze/react-native-sdk
1
yarn add @braze/react-native-sdk

2단계: 설정 옵션 선택

Braze Expo 플러그인을 사용하거나 기본 레이어 중 하나를 통해 소프트웨어 개발 키트를 관리할 수 있습니다. 엑스포 플러그인을 사용하면 네이티브 레이어에서 코드를 작성하지 않고도 특정 소프트웨어 개발 키트 기능을 구성할 수 있습니다. 앱의 요구 사항에 가장 적합한 옵션을 선택하세요.

2.1 단계: Braze Expo 플러그인을 설치하십시오

Braze React Native SDK 버전이 1.37.0 이상인지 확인합니다. 지원되는 전체 버전 목록은 Braze React Native 리포지토리에서 확인하세요.

Braze Expo 플러그인을 설치하려면 다음 명령을 실행하세요:

1
npx expo install @braze/expo-plugin

2.2 단계: 플러그인을 app.json에 추가하세요

귀하의 app.json에 Braze Expo 플러그인을 추가하십시오. 다음 구성 옵션을 제공할 수 있습니다:

예시 구성:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
{
  "expo": {
    "plugins": [
      [
        "@braze/expo-plugin",
        {
          "androidApiKey": "YOUR-ANDROID-API-KEY",
          "iosApiKey": "YOUR-IOS-API-KEY",
          "baseUrl": "YOUR-SDK-ENDPOINT",
          "sessionTimeout": 60,
          "enableGeofence": false,
          "enableBrazeIosPush": false,
          "enableFirebaseCloudMessaging": false,
          "firebaseCloudMessagingSenderId": "YOUR-FCM-SENDER-ID",
          "androidHandlePushDeepLinksAutomatically": true,
          "enableSdkAuthentication": false,
          "logLevel": 0,
          "minimumTriggerIntervalInSeconds": 0,
          "enableAutomaticLocationCollection": false,
          "enableAutomaticGeofenceRequests": false,
          "dismissModalOnOutsideTap": true,
          "androidPushNotificationHtmlRenderingEnabled": true,
          "androidNotificationAccentColor": "#ff3344",
          "androidNotificationLargeIcon": "@drawable/custom_app_large_icon",
          "androidNotificationSmallIcon": "@drawable/custom_app_small_icon",
          "iosRequestPushPermissionsAutomatically": false,
          "enableBrazeIosPushStories": true,
          "iosPushStoryAppGroup": "group.com.example.myapp.PushStories"
        }
      ],
    ]
  }
}

2.3 단계: 애플리케이션 빌드 및 실행

애플리케이션을 미리 빌드하면 Braze Expo 플러그인이 작동하는 데 필요한 기본 파일이 생성됩니다.

1
npx expo prebuild

Expo 문서에 지정된 대로, 애플리케이션을 실행합니다. 구성 옵션을 변경하는 경우 애플리케이션을 다시 사전 빌드하고 실행해야 한다는 점에 유의하세요.

2.1 단계: 리포지토리 추가

상위 수준 프로젝트 build.gradle에서 buildscript > dependencies 아래에 다음을 추가합니다.

1
2
3
4
5
6
7
buildscript {
    dependencies {
        ...
        // Choose your Kotlin version
        classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:1.8.10")
    }
}

그러면 프로젝트에 Kotlin이 추가됩니다.

2.2 단계: Braze SDK 구성

Braze 서버에 연결하려면 프로젝트의 res/values 폴더에서 braze.xml 파일을 생성합니다. 다음 코드를 붙여넣고 API 엔드포인트를 값으로 바꾸세요:

1
2
3
4
5
<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string translatable="false" name="com_braze_api_key">YOU_APP_IDENTIFIER_API_KEY</string>
  <string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
</resources>

AndroidManifest.xml 파일에 필요한 권한을 추가합니다:

1
2
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

2.3단계: 사용자 세션 추적 구현

openSession()closeSession()에 대한 호출은 자동으로 처리됩니다. onCreate() 메서드에 다음 코드를 추가하십시오: MainApplication 클래스:

1
2
3
4
5
6
7
8
import com.braze.BrazeActivityLifecycleCallbackListener;

@Override
public void onCreate() {
    super.onCreate();
    ...
    registerActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener());
}
1
2
3
4
5
6
7
import com.braze.BrazeActivityLifecycleCallbackListener

override fun onCreate() {
    super.onCreate()
    ...
    registerActivityLifecycleCallbacks(BrazeActivityLifecycleCallbackListener())
}

2.4 단계: 의도 업데이트 처리

MainActivity에서 android:launchModesingleTask로 설정된 경우, MainActivity 클래스에 다음 코드를 추가합니다.

1
2
3
4
5
@Override
public void onNewIntent(Intent intent) {
    super.onNewIntent(intent);
    setIntent(intent);
}
1
2
3
4
override fun onNewIntent(intent: Intent) {
    super.onNewIntent(intent)
    setIntent(intent)
}

2.1 단계: (선택 사항) 동적 XCFrameworks용 Podfile 구성

특정 Braze 라이브러리(예: BrazeUI)를 Objective-C++ 파일에 가져오려면 #import 구문을 사용해야 합니다. Braze Swift SDK의 버전 7.4.0부터 바이너리는 이 구문과 호환되는 동적 XCFrameworks로 선택적 배포 채널을 사용합니다.

이 배포 채널을 사용하려면 Podfile에서 CocoaPods 소스 위치를 수동으로 재정의합니다. 샘플을 참조하고 {your-version}을 가져오려는 관련 버전으로 바꿉니다.

1
2
3
pod 'BrazeKit', :podspec => 'https://raw.githubusercontent.com/braze-inc/braze-swift-sdk-prebuilt-dynamic/{your-version}/BrazeKit.podspec'
pod 'BrazeUI', :podspec => 'https://raw.githubusercontent.com/braze-inc/braze-swift-sdk-prebuilt-dynamic/{your-version}/BrazeUI.podspec'
pod 'BrazeLocation', :podspec => 'https://raw.githubusercontent.com/braze-inc/braze-swift-sdk-prebuilt-dynamic/{your-version}/BrazeLocation.podspec'

2.2 단계: 포드 설치

React Native는 라이브러리를 기본 플랫폼에 자동으로 연결하므로 CocoaPods를 사용하여 SDK를 설치할 수 있습니다.

프로젝트의 루트 폴더에서:

1
2
3
4
5
# To install using the React Native New Architecture
cd ios && pod install

# To install using the React Native legacy architecture
cd ios && RCT_NEW_ARCH_ENABLED=0 pod install

2.3 단계: Braze SDK 구성

AppDelegate.swift 파일 맨 위에서 Braze SDK를 가져옵니다.

1
import BrazeKit

application(_:didFinishLaunchingWithOptions:) 메서드에서 API 엔드포인트를 앱의 값으로 바꾸십시오. 그런 다음 구성을 사용하여 Braze 인스턴스를 생성하고 AppDelegate 에 정적 속성을 생성하여 쉽게 액세스할 수 있도록 합니다:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil
) -> Bool {
    // Setup Braze
    let configuration = Braze.Configuration(
        apiKey: "{BRAZE_API_KEY}",
        endpoint: "{BRAZE_ENDPOINT}")
    // Enable logging and customize the configuration here.
    configuration.logger.level = .info
    let braze = BrazeReactBridge.perform(
      #selector(BrazeReactBridge.initBraze(_:)),
      with: configuration
    ).takeUnretainedValue() as! Braze

    AppDelegate.braze = braze

    /* Other configuration */

    return true
}

// MARK: - AppDelegate.braze

static var braze: Braze? = nil

AppDelegate.m 파일 맨 위에서 Braze SDK를 가져옵니다.

1
2
#import <BrazeKit/BrazeKit-Swift.h>
#import "BrazeReactBridge.h"

application:didFinishLaunchingWithOptions: 메서드에서 API 엔드포인트를 앱의 값으로 바꾸십시오. 그런 다음 구성을 사용하여 Braze 인스턴스를 생성하고 AppDelegate 에 정적 속성을 생성하여 쉽게 액세스할 수 있도록 합니다:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  // Setup Braze
  BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:@"{BRAZE_API_KEY}"
                                                                    endpoint:@"{BRAZE_ENDPOINT}"];
  // Enable logging and customize the configuration here.
  configuration.logger.level = BRZLoggerLevelInfo;
  Braze *braze = [BrazeReactBridge initBraze:configuration];
  AppDelegate.braze = braze;

  /* Other configuration */

  return YES;
}

#pragma mark - AppDelegate.braze

static Braze *_braze = nil;

+ (Braze *)braze {
  return _braze;
}

+ (void)setBraze:(Braze *)braze {
  _braze = braze;
}

3단계: 라이브러리 가져오기

그런 다음, React Native 코드의 라이브러리를 import. 자세한 내용은 샘플 프로젝트를 확인하세요.

1
import Braze from "@braze/react-native-sdk";

4단계: 통합 테스트(선택 사항)

SDK 통합을 테스트하려면 앱에서 다음 코드를 호출하여 어느 플랫폼에서든 사용자의 새 세션을 시작하세요.

1
Braze.changeUser("userId");

예를 들어, 앱 시작 시 사용자 ID를 할당할 수 있습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
import React, { useEffect } from "react";
import Braze from "@braze/react-native-sdk";

const App = () => {
  useEffect(() => {
    Braze.changeUser("some-user-id");
  }, []);

  return (
    <div>
      ...
    </div>
  )

Braze 대시보드에서 사용자 검색으로 이동하여 some-user-id 과 일치하는 ID를 가진 사용자를 찾습니다. 여기에서 세션 및 기기 데이터가 기록되었는지 확인할 수 있습니다.

Roku SDK 통합

1단계: 파일 추가

Braze SDK 파일은 Braze Roku SDK 리포지토리sdk_files 디렉토리에서 찾을 수 있습니다.

  1. source 디렉토리의 앱에 BrazeSDK.brs를 추가합니다.
  2. components 디렉토리의 앱에 BrazeTask.brsBrazeTask.xml을 추가합니다.

2단계: 참조 추가

다음 script 요소를 사용하여 기본 장면에서 BrazeSDK.brs에 대한 참조를 추가합니다.

1
<script type="text/brightscript" uri="pkg:/source/BrazeSDK.brs"/>

3단계: 구성

main.brs 에서 글로벌 노드에서 Braze 구성을 설정합니다:

1
2
3
4
5
6
7
8
globalNode = screen.getGlobalNode()
config = {}
config_fields = BrazeConstants().BRAZE_CONFIG_FIELDS
config[config_fields.API_KEY] = {YOUR_API_KEY}
' example endpoint: "https://sdk.iad-01.braze.com/"
config[config_fields.ENDPOINT] = {YOUR_ENDPOINT}
config[config_fields.HEARTBEAT_FREQ_IN_SECONDS] = 5
globalNode.addFields({brazeConfig: config})

Braze 대시보드에서 SDK 엔드포인트와 API 키를 찾을 수 있습니다.

4단계: Braze 초기화

Braze 인스턴스를 초기화합니다:

1
2
m.BrazeTask = createObject("roSGNode", "BrazeTask")
m.Braze = getBrazeInstance(m.BrazeTask)

선택적 구성

로깅

Braze 통합을 디버깅하려면 Roku 디버그 콘솔에서 Braze 로그를 확인할 수 있습니다. 자세한 내용은 Roku 개발자의 코드 디버깅을 참조하세요.

유니티 브레이즈 SDK 소개

유형, 함수, 변수 등의 전체 목록은 Unity 선언 파일을 참조하세요. 또한 이미 iOS용 Unity를 수동으로 통합한 경우 자동 통합으로 전환할 수 있습니다.

Unity SDK 통합

Prerequisites

시작하기 전에 사용 중인 환경이 최신 Braze Unity SDK 버전에서 지원되는지 확인하세요.

1단계: Braze Unity 패키지 선택

Braze .unitypackage는 C# 인터페이스와 함께 Android 및 iOS 플랫폼용 기본 바인딩을 번들로 제공합니다.

Braze Unity 릴리즈 페이지에서 여러 Braze Unity 패키지를 다운로드할 수 있습니다.

  • Appboy.unitypackage
    • 이 패키지는 Braze 인앱 메시징 및 iOS의 콘텐츠 카드 기능이 제대로 작동하는 데 필요한 Braze Android 및 iOS SDK와 iOS SDK에 대한 SDWebImage 종속성을 번들로 제공합니다. SDWebImage 프레임워크는 GIF를 포함한 이미지를 다운로드하고 표시하는 데 사용됩니다. Braze의 모든 기능을 활용하려면 이 패키지를 다운로드하여 가져오세요.
  • Appboy-nodeps.unitypackage
    • 이 패키지는 SDWebImage 프레임워크가 없다는 점을 제외하면 Appboy.unitypackage 과 유사합니다. 이 패키지는 iOS 앱에 SDWebImage 프레임워크가 표시되지 않도록 하려는 경우에 유용합니다.

Braze .unitypackage는 C# 인터페이스와 함께 Android 및 iOS 플랫폼용 기본 바인딩을 번들로 제공합니다.

Braze Unity 패키지는 다음과 같은 두 가지 통합 옵션을 사용해 Braze Unity 릴리즈 페이지에서 다운로드할 수 있습니다.

  1. Appboy.unitypackage
    • 이 패키지는 추가 종속성 없이 Braze Android 및 iOS SDK를 번들로 제공합니다. 이 통합 방법을 사용하는 경우 iOS에서 Braze 인앱 메시징 및 콘텐츠 카드 기능이 제대로 작동하지 않습니다. 커스텀 코드 없이 전체 Braze 기능을 활용하려는 경우 대신 아래 옵션을 사용합니다.
    • 이 통합 옵션을 사용하려면 Unity UI의 ‘Braze 구성’ 아래에서 Import SDWebImage dependency 옆의 확인란이 선택 해제되었는지 확인합니다.
  2. Appboy.unitypackage(SDWebImage 포함)
    • 이 통합 옵션은 Braze 인앱 메시징 및 iOS의 콘텐츠 카드 기능이 제대로 작동하는 데 필요한 Braze Android 및 iOS SDK와 iOS SDK에 대한 SDWebImage 종속성을 번들로 제공합니다. SDWebImage 프레임워크는 GIF를 포함한 이미지를 다운로드하고 표시하는 데 사용됩니다. Braze의 모든 기능을 활용하려면 이 패키지를 다운로드하여 가져오세요.
    • SDWebImage를 자동으로 가져오려면 Unity UI의 ‘Braze 구성’ 아래 Import SDWebImage dependency 옆의 확인란을 선택해야 합니다.

2단계: 패키지 가져오기

Unity 편집기에서 자산 > 패키지 가져오기 > 커스텀 패키지로 이동하여 패키지를 Unity 프로젝트로 가져옵니다 다음으로, 가져오기를 클릭합니다.

또는 커스텀 Unity 패키지 가져오기에 대한 자세한 가이드는 Unity 자산 패키지 가져오기 지침을 따릅니다.

Unity 편집기에서 자산 > 패키지 가져오기 > 커스텀 패키지로 이동하여 패키지를 Unity 프로젝트로 가져옵니다 다음으로, 가져오기를 클릭합니다.

또는 커스텀 Unity 패키지 가져오기에 대한 자세한 가이드는 Unity 자산 패키지 가져오기 지침을 따릅니다.

3단계: SDK 구성

3.1 단계: 구성 AndroidManifest.xml

풀로 AndroidManifest.xml 가 작동합니다. 앱에 AndroidManifest.xml이 없는 경우 다음을 템플릿으로 사용할 수 있습니다. 그렇지 않으면 이미 AndroidManifest.xml이 있는 경우 기존 AndroidManifest.xml에 다음 중 누락된 섹션이 추가되었는지 확인합니다.

  1. Assets/Plugins/Android/ 디렉토리로 이동하여 AndroidManifest.xml 파일을 엽니다. Unity 에디터의 기본 위치입니다.
  2. AndroidManifest.xml 에서 다음 템플릿의 필수 권한 및 활동을 추가합니다.
  3. 완료되면 AndroidManifest.xml 에는 "android.intent.category.LAUNCHER" 이 있는 하나의 활동만 포함되어 있어야 합니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="REPLACE_WITH_YOUR_PACKAGE_NAME">

  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
  <uses-permission android:name="android.permission.INTERNET" />

  <application android:icon="@drawable/app_icon" 
               android:label="@string/app_name">

    <!-- Calls the necessary Braze methods to ensure that analytics are collected and that push notifications are properly forwarded to the Unity application. -->
    <activity android:name="com.braze.unity.BrazeUnityPlayerActivity" 
      android:theme="@style/UnityThemeSelector"
      android:label="@string/app_name" 
      android:configChanges="fontScale|keyboard|keyboardHidden|locale|mnc|mcc|navigation|orientation|screenLayout|screenSize|smallestScreenSize|uiMode|touchscreen" 
      android:screenOrientation="sensor">
      <meta-data android:name="android.app.lib_name" android:value="unity" />
      <meta-data android:name="unityplayer.ForwardNativeEventsToDalvik" android:value="true" />
      <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
      </intent-filter>
    </activity>

    <!-- A Braze specific FirebaseMessagingService used to handle push notifications. -->
    <service android:name="com.braze.push.BrazeFirebaseMessagingService"
      android:exported="false">
      <intent-filter>
        <action android:name="com.google.firebase.MESSAGING_EVENT" />
      </intent-filter>
    </service>
  </application>
</manifest>

3.2 단계: 패키지 이름으로 AndroidManifest.xml 업데이트

패키지 이름을 찾으려면 파일 > 빌드 설정 > 플레이어 설정 > Android 탭을 클릭합니다.

AndroidManifest.xml에서 REPLACE_WITH_YOUR_PACKAGE_NAME의 모든 인스턴스는 이전 단계의 Package Name으로 바뀌어야 합니다.

3.3 단계: 그레이들 종속성 추가

Unity 프로젝트에 그래들 종속성을 추가하려면 먼저 퍼블리싱 설정에서 ‘커스텀 메인 그래들 템플릿’ 을 활성화합니다. 그러면 프로젝트에서 사용할 템플릿 gradle 파일이 생성됩니다. gradle 파일은 설정 종속성 및 기타 빌드 시점 프로젝트 설정을 처리합니다. 자세한 내용은 Braze Unity 샘플 앱의 mainTemplate.gradle.

다음 종속성이 필요합니다:

1
2
3
4
5
6
implementation 'com.google.firebase:firebase-messaging:22.0.0'
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.1.0"
implementation "androidx.recyclerview:recyclerview:1.2.1"
implementation "org.jetbrains.kotlin:kotlin-stdlib:1.6.0"
implementation "org.jetbrains.kotlinx:kotlinx-coroutines-android:1.6.1"
implementation 'androidx.core:core:1.6.0'

외부 종속성 매니저를 사용하여 이러한 종속성을 설정할 수도 있습니다.

3.4 단계: Unity Android 통합 자동화

Braze는 Unity Android 통합을 자동화하기 위한 기본 Unity 솔루션을 제공합니다.

  1. Unity 편집기에서 Braze > Braze 구성으로 이동하여 Braze 구성 설정을 엽니다.
  2. Unity Android 통합 자동화 확인란을 선택합니다.
  3. Braze API 키 필드에 Braze 대시보드의 설정 관리에서 찾은 애플리케이션의 API 키를 입력합니다.

3.1 단계: API 키 설정

Braze는 Unity iOS 통합을 자동화하기 위한 기본 Unity 솔루션을 제공합니다. 이 솔루션은 Unity의 PostProcessBuildAttribute를 사용하여 빌드된 Xcode 프로젝트를 수정하고 IMPL_APP_CONTROLLER_SUBCLASS 매크로를 사용하여 UnityAppController를 서브클래스로 구성합니다.

  1. Unity 편집기에서 Braze > Braze 구성으로 이동하여 Braze 구성 설정을 엽니다.
  2. Unity iOS 통합 자동화 확인란을 선택합니다.
  3. Braze API 키 필드에 설정 관리에서 찾은 애플리케이션의 API 키를 입력합니다.

애플리케이션에서 이미 다른 UnityAppController 서브클래스를 사용하고 있는 경우, 서브클래스 구현을 AppboyAppDelegate.mm과 병합해야 합니다.

Unity 패키지 커스터마이징

1단계: 리포지토리 복제

터미널에서 Braze Unity SDK GitHub 리포지토리를 복제하고 해당 폴더로 이동합니다:

1
2
git clone [email protected]:braze-inc/braze-unity-sdk.git
cd ~/PATH/TO/DIRECTORY/braze-unity-sdk
1
2
git clone git@github.com:braze-inc/braze-unity-sdk.git
cd C:\PATH\TO\DIRECTORY\braze-unity-sdk

2단계: 리포지토리에서 패키지 내보내기

먼저 Unity를 실행하고 백그라운드에서 계속 실행합니다. 그런 다음 리포지토리 루트에서 다음 명령을 실행하여 패키지를 braze-unity-sdk/unity-package/ 으로 내보냅니다.

1
/Applications/Unity/Unity.app/Contents/MacOS/Unity -batchmode -nographics -projectPath "$(pwd)" -executeMethod Appboy.Editor.Build.ExportAllPackages -quit
1
"%UNITY_PATH%" -batchmode -nographics -projectPath "%PROJECT_ROOT%" -executeMethod Appboy.Editor.Build.ExportAllPackages -quit	

3단계: Unity로 패키지 임포트

  1. Unity에서 에셋 > 패키지 임포트 > 커스텀 패키지로 이동하여 원하는 패키지를 Unity 프로젝트로 임포트합니다.
  2. 가져오지 않으려는 파일이 있다면 지금 바로 선택을 취소하세요.
  3. Assets/Editor/Build.cs 에 있는 익스포트된 Unity 패키지를 커스터마이즈합니다.

자동 통합으로 전환(Swift만 해당)

Braze Unity SDK에서 제공하는 자동화된 iOS 통합 기능을 활용하려면 수동 통합에서 자동 통합으로 전환하는 다음 단계를 따르세요.

  1. Xcode 프로젝트의 UnityAppController 서브클래스에서 모든 Braze 관련 코드를 제거합니다.
  2. Unity 또는 Xcode 프로젝트에서 Braze iOS 라이브러리를 제거합니다(예: Appboy_iOS_SDK.frameworkSDWebImage.framework).
  3. Braze Unity 패키지를 프로젝트에 다시 임포트합니다. 전체 안내는 2단계를 참조하세요: 패키지를 가져오기.
  4. API 키를 다시 설정하세요. 전체 안내는 3.1단계를 참조하세요: API 키 설정.

선택적 구성

상세 로깅

Unity 편집기에서 상세 로깅을 활성화하려면 다음을 수행합니다.

  1. Braze > Braze 구성으로 이동하여 Braze 구성 설정을 엽니다.
  2. Braze Android 설정 표시 드롭다운을 클릭합니다.
  3. SDK 로그 수준 필드에 ‘0’ 값을 입력합니다.

Prime 31 호환성

Prime31 플러그인과 함께 Braze Unity 플러그인을 사용하려면 프로젝트의 AndroidManifest.xml을 편집하여 Prime31 호환 활동 클래스를 사용합니다. 의 모든 참조를 변경합니다. com.braze.unity.BrazeUnityPlayerActivity부터 com.braze.unity.prime31compatible.BrazeUnityPlayerActivity까지

Amazon 디바이스 메시징(ADM)

Braze는 Unity 앱에 ADM 푸시 통합을 지원합니다. ADM 푸시를 통합하려면 ADM API 키가 포함된 api_key.txt 파일을 만들어 Plugins/Android/assets/ 폴더에 넣습니다. ADM과 Braze를 통합하는 방법에 대한 자세한 내용은 ADM 푸시 통합 지침을 참조하세요.

Braze Unity 플레이어 확장(Android 전용)

제공된 예제 AndroidManifest.xml 파일에는 하나의 활동 클래스(BrazeUnityPlayerActivity)가 등록되어 있습니다. 이 클래스는 Braze SDK와 통합되어 있으며 세션 처리, 인앱 메시지 등록, 푸시 알림 분석 로깅 등을 통해 UnityPlayerActivity를 확장합니다. UnityPlayerActivity 클래스 확장에 대한 자세한 내용은 Unity를 참조하세요.

라이브러리 또는 플러그인 프로젝트에서 커스텀 UnityPlayerActivity를 만드는 경우, 커스텀 기능을 Braze와 통합하려면 BrazeUnityPlayerActivity를 확장해야 합니다. BrazeUnityPlayerActivity 확장 작업을 시작하기 전에, Unity 프로젝트에 Braze를 통합하기 위한 지침을 따르세요.

  1. Braze Android SDK 통합 지침에서 설명한 대로 라이브러리 또는 플러그인 프로젝트에 Braze Android SDK를 종속성으로 추가합니다.
  2. Unity 전용 기능이 포함된 Unity .aar을 Unity용으로 빌드 중인 Android 라이브러리 프로젝트에 통합합니다. appboy-unity.aar공개 리포지토리에서 사용할 수 있습니다. Unity 라이브러리가 성공적으로 통합되면 BrazeUnityPlayerActivity를 확장하도록 UnityPlayerActivity를 수정합니다.
  3. 라이브러리 또는 플러그인 프로젝트를 내보내고 평소처럼 /<your-project>/Assets/Plugins/Android 에 끌어다 놓습니다. Braze 소스 코드는 이미 /<your-project>/Assets/Plugins/Android에 있으므로 라이브러리나 플러그인에 포함하지 마세요.
  4. /<your-project>/Assets/Plugins/Android/AndroidManifest.xml 을 수정하여 BrazeUnityPlayerActivity 하위 클래스를 기본 활동으로 지정합니다.

이제 Braze와 완전히 통합되고 커스텀 UnityPlayerActivity 기능이 포함된 .apk 패키지를 Unity IDE에서 생성할 수 있습니다.

문제 해결

오류: “파일을 읽을 수 없습니다”

다음과 유사한 오류는 안전하게 무시해도 됩니다. Apple 소프트웨어는 Unity가 인식하지 못하는 CgBI라는 독점 PNG 확장을 사용합니다. 이러한 오류는 iOS 빌드나 Braze 번들에서 관련 이미지의 올바른 표시에는 영향을 미치지 않습니다.

1
Could not create texture from Assets/Plugins/iOS/AppboyKit/Appboy.bundle/...png: File could not be read

언리얼 엔진 Braze 소프트웨어 개발 키트 소개

Braze 언리얼 소프트웨어 개발 키트 플러그인을 사용하면 가능합니다:

  • 앱 또는 게임 내 세션 평가 및 추적
  • 인앱 구매 및 맞춤 이벤트 추적
  • 표준 및 사용자 지정 속성으로 사용자 프로필 업데이트하기
  • 푸시 알림 보내기
  • 언리얼 앱을 더 큰 캔버스 여정에 통합
  • 인앱 행동을 기반으로 이메일 또는 SMS와 같은 크로스채널 메시징 발송

언리얼 엔진 SDK 통합하기

1단계: Braze 플러그인 추가하기

터미널에서 언리얼 엔진 Braze 소프트웨어 개발 키트 GitHub 저장소를 복제합니다.

1
git clone [email protected]:braze-inc/braze-unreal-sdk.git

그런 다음 BrazeSample/Plugins/Braze 디렉토리를 복사하여 앱의 플러그인 폴더에 추가합니다.

2단계: 플러그인 인에이블먼트

C++ 또는 블루프린트 프로젝트에 플러그인을 인에이블먼트합니다.

C++ 프로젝트의 경우, 모듈이 Braze 모듈을 참조하도록 구성하세요. \*.Build.cs file 에서 "Braze"PublicDependencyModuleNames 에 추가합니다.

1
PublicDependencyModuleNames.AddRange(new string[] { "Core", "CoreUObject", "Engine", "InputCore", "Braze" });

블루프린트 프로젝트의 경우 설정 > 플러그인으로 이동한 다음 Braze 옆의 인에이블먼트에 체크합니다.

활성화 플러그인

3단계: API 키와 엔드포인트 설정하기

프로젝트의 DefaultEngine.ini 에서 API 키와 엔드포인트를 설정하세요.

1
2
3
4
5
[/Script/Braze.BrazeConfig]
bAutoInitialize=True ; true by default, initialize when the project starts
AndroidApiKey= ; your API key
IOSApiKey= ; your API key
CustomEndpoint= ; your endpoint

4단계: 소프트웨어 개발 키트 수동 초기화(선택 사항)

기본적으로 소프트웨어 개발 키트는 실행 시 자동으로 초기화됩니다. 사용자 동의를 기다리거나 로그 레벨을 설정하는 등 초기화에 대한 더 많은 제어를 원하는 경우 DefaultEngine.ini 에서 AutoInitialize 을 비활성화하고 C++ 또는 블루프린트에서 수동으로 초기화할 수 있습니다.

네이티브 C++에서는 BrazeSubsystem에 액세스하여 InitializeBraze() 을 호출하고 선택적으로 Engine.ini 설정을 재정의하는 컨피규어를 전달합니다.

1
2
UBrazeSubsystem* const BrazeSubsystem = GEngine->GetEngineSubsystem<UBrazeSubsystem>();
UBraze* const BrazeInstance = BrazeSubsystem->InitializeBraze();

블루프린트에서는 블루프린트 노드와 동일한 기능에 액세스할 수 있습니다:
GetBrazeSubsystem 노드를 사용하여 Initialize 노드를 호출합니다.
선택적으로 블루프린트에서 BrazeConfig 오브젝트를 생성하여 다음 주소로 전달할 수 있습니다. Initialize

초기화브레이즈

선택적 구성

로깅

런타임에 C++를 사용하거나 블루프린트 노드에서 로그 레벨을 설정할 수 있습니다.

런타임에 로그 수준을 설정하려면 UBrazeSubsystem::AndroidSetLogLevel 으로 전화하세요.

1
2
3
UBrazeSubsystem* const BrazeSubsystem = GEngine->GetEngineSubsystem<UBrazeSubsystem>();
BrazeSubsystem->AndroidSetLogLevel(EBrazeLogLevel::Verbose);
UBraze* const BrazeInstance = BrazeSubsystem->InitializeBraze();

블루프린트에서 Android 설정 로그 레벨 노드를 사용할 수 있습니다:

블루프린트의 Android Set Log Level 노드입니다.

Braze 소프트웨어 개발 키트 초기화를 호출할 때 로깅이 설정되도록 하려면 InitializeBraze 전에 이 함수를 호출하는 것이 좋습니다.

info.plist 에서 로그 레벨을 인에이블먼트하려면 설정 > 프로젝트 설정으로 이동한 다음 플랫폼에서 iOS를 선택합니다. 추가 목록 데이터에서 추가 목록 데이터를 찾은 다음 로그 수준을 입력합니다:

1
2
3
4
5
<key>Appboy</key>
<dict>
  <key>LogLevel</key>
  <string>0</string>
</dict>

기본값 로그 수준은 최소 로깅인 8입니다. 로그 수준에 대해 자세히 알아보세요: 기타 소프트웨어 개발 키트 커스터마이징

Integrating the Xamarin SDK

Integrating the Braze Xamarin SDK will provide you with basic analytics functionality as well as working in-app messages with which you can engage your users.

Prerequisites

Before you can integrate the Xamarin Braze SDK, be sure you meet the following requirements:

  • Starting in version 3.0.0, this SDK requires using .NET 6+ and removes support for projects using the Xamarin framework.
  • Starting in version 4.0.0, this SDK dropped support for Xamarin & Xamarin.Forms and added support for .NET MAUI. See Microsoft’s policy around the end of support for Xamarin.

Step 1: Get the Xamarin binding

A Xamarin binding is a way to use native libraries in Xamarin apps. The implementation of a binding consists of building a C# interface to the library, and then using that interface in your application. See the Xamarin documentation. There are two ways to include the Braze SDK binding: using NuGet or compiling from source.

The simplest integration method involves getting the Braze SDK from the NuGet.org central repository. In the Visual Studio sidebar, right click Packages folder and click Add Packages.... Search for ‘Braze’ and install the BrazePlatform.BrazeAndroidBinding package into your project.

The second integration method is to include the binding source. Under appboy-component/src/androidnet6 you will find our binding source code; adding a project reference to the BrazeAndroidBinding.csproj in your Xamarin application will cause the binding to be built with your project and provide you access to the Braze Android SDK.

A Xamarin binding is a way to use native libraries in Xamarin apps. The implementation of a binding consists of building a C# interface to the library and then using that interface in your application. There are two ways to include the Braze SDK binding: using NuGet or compiling from source.

The simplest integration method involves getting the Braze SDK from the NuGet.org central repository. In the Visual Studio sidebar, right-click Packages folder and click Add Packages.... Search for ‘Braze’ and install the latest Xamarin iOS NuGet packages: Braze.iOS.BrazeKit, Braze.iOS.BrazeUI, and Braze.iOS.BrazeLocation into your project.

We also provide the compatibility libraries packages: Braze.iOS.BrazeKitCompat and Braze.iOS.BrazeUICompat, to help make your migration to .NET MAUI easier.

The second integration method is to include the binding source. Under appboy-component/src/iosnet6 you will find our binding source code; adding a project reference to the BrazeiOSBinding.csproj in your Xamarin application will cause the binding to be built with your project and provide you access to the Braze iOS SDK. Make sure BrazeiOSBinding.csproj is showing in your project’s “Reference” folder.

Step 2: Configure your Braze instance

Step 2.1: Configure the Braze SDK in Braze.xml

Now that the libraries have been integrated, you have to create an Braze.xml file in your project’s Resources/values folder. The contents of that file should resemble the following code snippet:

1
2
3
4
5
6
7
8
9
  <?xml version="1.0" encoding="utf-8"?>
  <resources>
    <string translatable="false" name="com_braze_api_key">YOUR_API_KEY</string>
    <string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
    <string-array name="com_braze_internal_sdk_metadata">
      <item>XAMARIN</item>
      <item>NUGET</item>
    </string-array>
  </resources>

If you are including the binding source manually, remove <item>NUGET</item> from your code.

Step 2.2: Add required permissions to Android manifest

Now that you’ve added your API key, you need to add the following permissions to your AndroidManifest.xml file:

1
<uses-permission android:name="android.permission.INTERNET" />

For an example of your AndroidManifest.xml, see the Android MAUI sample application.

Step 2.3: Track user sessions and registering for in-app messages

To enable user session tracking and register your app for in-app messages, add the following call to the OnCreate() lifecycle method of the Application class in your app:

1
RegisterActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener());

When setting up your Braze instance, add the following snippet to configure your instance:

1
2
3
var configuration = new BRZConfiguration("YOUR_API_KEY", "YOUR_ENDPOINT");
configuration.Api.AddSDKMetadata(new[] { BRZSDKMetadata.Xamarin });
braze = new Braze(configuration);

See the App.xaml.cs file in the iOS MAUI sample application.

Step 3: Test the integration

Now you can launch your application and see sessions being logged to the Braze dashboard (along with device information and other analytics). For a more in-depth discussion of best practices for the basic SDK integration, consult the Android integration instructions.

Now you can launch your application and see sessions being logged to the Braze dashboard. For a more in-depth discussion of best practices for the basic SDK integration, consult the iOS integration instructions.

New Stuff!