Integrating the Braze SDK

Integrating the Android SDK

Step 1: Update your `build.gradle`

In your build.gradle , add mavenCentral() to your list of repositories.

repositories { mavenCentral()

Next, add Braze to your dependencies.

If you don’t plan on using Braze UI components, add the following code to your build.gradle. Replace SDK_VERSION with the current version of your Android Braze SDK. For the full list of versions, see Changelogs.

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.
If you plan on using Braze UI components later, add the following code to your build.gradle.  Replace SDK_VERSION with the current version of your Android Braze SDK. For the full list of versions, see Changelogs.

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.
 note: 

As of December 2019, custom endpoints are no longer given out, if you have a pre-existing custom endpoint, you may continue to use it. For more details, refer to our list of available endpoints.
Create a braze.xml file in your project’s res/values folder. If you are on a specific data cluster or have a pre-existing custom endpoint, you need to specify the endpoint in your braze.xml file as well.
The contents of that file should resemble the following code snippet. Make sure to substitute YOUR_APP_IDENTIFIER_API_KEY with the identifier found in the Manage Settings page of the Braze dashboard. Log in at dashboard.braze.com to find your cluster address.

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string 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>
Step 3: Add permissions to AndroidManifest.xml
Next, add the following permissions to your AndroidManifest.xml:

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

With the release of Android M, Android switched from an install-time to a runtime permissions model. However, both of these permissions are normal permissions and are granted automatically if listed in the app manifest. For more information, visit Android’s permission documentation.
Step 4: Enable user session tracking
When you enable user session tracking, calls to openSession(), closeSession(),ensureSubscribedToInAppMessageEvents(), and InAppMessageManager registration can be handled automatically.
To register activity lifecycle callbacks, add the following code to the onCreate() method of your Application class.
    kotlin

public class MyApplication extends Application {
  @Override
  public void onCreate() {
    super.onCreate();
    registerActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener());

class MyApplication : Application() {
  override fun onCreate() {
    super.onCreate()
    registerActivityLifecycleCallbacks(BrazeActivityLifecycleCallbackListener())
For the list of available parameters, see BrazeActivityLifecycleCallbackListener.

Testing session tracking

You can also use the SDK Debugger to diagnose SDK issues.

If you experience issues while testing, enable verbose logging , then use logcat to detect missing openSession and closeSession calls in your activities.

In Braze, go to Overview , select your app, then in the Display Data For dropdown choose Today .

Open your app, then refresh the Braze dashboard. Verify that your metrics have increased by 1.

Navigate through your app and verify that only one session has been logged to Braze.

Send the app to the background for at least 10 seconds, then bring it to the foreground. Verify that a new session was logged.

Optional configurations

Runtime configuration

To set your Braze options in code rather than your braze.xml file, use runtime configuration . If a value exists in both places, the runtime value will be used instead. After all required settings are supplied at runtime, you can delete your braze.xml file.

In the following example, a builder object is created and then passed to Braze.configure() . Note that only some of the available runtime options are shown—refer to our KDoc for the full list.

kotlin

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

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)

Google Advertising ID

The Google Advertising ID (GAID) is an optional user-specific, anonymous, unique, and resettable ID for advertising, provided by Google Play services. GAID gives users the power to reset their identifier, opt-out of interest-based ads within Google Play apps, and provides developers with a simple, standard system to continue to monetize their apps.

The Google Advertising ID is not automatically collected by the Braze SDK and must be set manually via the Braze.setGoogleAdvertisingId() method.

kotlin

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

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()
Location tracking
To enable Braze location collection, set com_braze_enable_location_collection to true in your braze.xml file:

<bool name="com_braze_enable_location_collection">true</bool>
 important: 

Starting with Braze Android SDK version 3.6.0, Braze location collection is disabled by default.
Logging
By default, the Braze Android SDK log level is set to INFO. You can suppress these logs or set a different log level, such as VERBOSE, DEBUG, or WARN.
Enabling logs
To help troubleshoot issues in your app, or reduce turnaround times with Braze Support, you’ll want to enable verbose logs for the SDK. When you send verbose logs to Braze Support, ensure they begin as soon as you launch your application and end far after your issue occurs.
Keep in mind, verbose logs are only intended for your development environment, so you’ll want to disable them before releasing your app.
 important: 

Enable verbose logs before any other calls in Application.onCreate() to ensure your logs are as complete as possible.
    application
To enable logs directly in your app, add the following to your application’s onCreate() method before any other methods.
    kotlin

BrazeLogger.setLogLevel(Log.MIN_LOG_LEVEL);

BrazeLogger.logLevel = Log.MIN_LOG_LEVEL

For example, the following code will forward log levels 2, 3, 4, 5, 6, and 7 to the Log method.

kotlin

BrazeLogger.setLogLevel(Log.VERBOSE);

BrazeLogger.logLevel = Log.VERBOSE

For example, the following code will forward log levels 2, 3, 4, 5, 6, and 7 to the Log method.

Verifying verbose logs

To verify that your logs are set to VERBOSE, check if V/Braze occurs somewhere in your logs. If it does, then verbose logs have been successfully enabled. For example:

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

Suppressing logs

To suppress all logs for the Braze Android SDK, set the log level to BrazeLogger.SUPPRESS in your application’s onCreate() method before any other methods.

kotlin

BrazeLogger.setLogLevel(BrazeLogger.SUPPRESS);

BrazeLogger.setLogLevel(BrazeLogger.SUPPRESS)

Multiple API keys

The most common use case for multiple API keys is separating API keys for debug and release build variants.

To easily switch between multiple API keys in your builds, we recommend creating a separate braze.xml file for each relevant build variant. A build variant is a combination of build type and product flavor. By default, new Android projects are configured with debug and release build types and no product flavors.

For each relevant build variant, create a new braze.xml in the src/<build variant name>/res/values/ directory. When the build variant is compiled, it will use the new API key.

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

To learn how to set up the API key in your code, see Runtime configuration.

Exclusive in-app message TalkBack

In adherence to the Android accessibility guidelines, the Braze Android SDK offers Android Talkback by default. To ensure that only the contents of in-app messages are read out loud—without including other screen elements like the app title bar or navigation—you can enable exclusive mode for TalkBack.

To enable exclusive mode for in-app messages:

braze xml

kotlin

<bool name="com_braze_device_in_app_message_accessibility_exclusive_mode_enabled">true</bool>

val brazeConfigBuilder = BrazeConfig.Builder()
brazeConfigBuilder.setIsInAppMessageAccessibilityExclusiveModeEnabled(true)
Braze.configure(this, brazeConfigBuilder.build())

BrazeConfig.Builder brazeConfigBuilder = new BrazeConfig.Builder() brazeConfigBuilder.setIsInAppMessageAccessibilityExclusiveModeEnabled(true); Braze.configure(this, brazeConfigBuilder.build());

R8 and ProGuard

Code shrinking configuration is automatically included with your Braze integration.

Client apps that obfuscate Braze code must store release mapping files for Braze to interpret stack traces. If you want to continue to keep all Braze code, add the following to your ProGuard file:

-keep class bo.app.** { *; }
-keep class com.braze.** { *; }
Integrating the Swift SDK
You can integrate and customize the Braze Swift SDK using the Swift Package Manager (SPM), CocoaPods, or manual integration methods. For more information about the various SDK symbols, see Braze Swift reference documentation.
Prerequisites
Before you start, verify your environment is supported by the latest Braze Swift SDK version.
Step 1: Install the Braze Swift SDK
We recommend using the Swift Package Manager (SwiftPM) or CocoaPods to install the Braze Swift SDK. Alternatively, you can install the SDK manually.
    swift package manager
    cocoapods
    manual
Step 1.1: Import SDK version
Open your project and navigate to your project’s settings. Select the Swift Packages tab and click on the  add button below the packages list.

 note: 

Starting in version 7.4.0, the Braze Swift SDK has additional distribution channels as static XCFrameworks and dynamic XCFrameworks. If you’d like to use either of these formats instead, follow the installation instructions from its respective repository.
Enter the URL of our iOS Swift SDK repository https://github.com/braze-inc/braze-swift-sdk in the text field. Under the Dependency Rule section, select the SDK version. Finally, click Add Package.
Step 1.2: Select your packages
The Braze Swift SDK separates features into standalone libraries to provide developers with more control over which features to import into their projects.
      BrazeLocation
      Location library providing support for location analytics and geofence monitoring.
      BrazeUI
      Braze-provided user interface library for in-app messages, Content Cards, and Banners. Import this library if you intend to use the default UI components.
      BrazeNotificationService
      Notification service extension library providing support for rich push notifications.
      BrazePushStory
      Notification content extension library providing support for Push Stories.
Step 1.1: Install CocoaPods
For a full walkthrough, see CocoaPods’ Getting Started Guide. Otherwise, you can run the following command to get started quickly:

$ sudo gem install cocoapods
If you get stuck, checkout CocoaPods’ Troubleshooting Guide.
Step 1.2: Constructing the Podfile
Next, create a file in your Xcode project directory named Podfile.
 note: 

Starting in version 7.4.0, the Braze Swift SDK has additional distribution channels as static XCFrameworks and dynamic XCFrameworks. If you’d like to use either of these formats instead, follow the installation instructions from its respective repository.




    

Add the following line to your Podfile:

target 'YourAppTarget' do
  pod 'BrazeKit'
BrazeKit contains the main SDK library, providing support for analytics and push notifications.
We suggest you version Braze so pod updates automatically grab anything smaller than a minor version update. This looks like pod 'BrazeKit' ~> Major.Minor.Build. If you want to automatically integrate the latest Braze SDK version, even with major changes, you can use pod 'BrazeKit' in your Podfile.
About additional libraries
The Braze Swift SDK separates features into standalone libraries to provide developers with more control over which features to import into their projects. In addition to BrazeKit, you may add the following libraries to your Podfile:
      pod 'BrazeLocation'
      Location library providing support for location analytics and geofence monitoring.
      pod 'BrazeUI'
      Braze-provided user interface library for in-app messages, Content Cards, and Banners. Import this library if you intend to use the default UI components.
Extension libraries
BrazeNotificationService and BrazePushStory are extension modules that provide additional functionality and should not be added directly to your main application target. Instead, you will need to create separate extension targets for each of these modules and import the Braze modules into their corresponding targets.
      pod 'BrazeNotificationService'
      Notification service extension library providing support for rich push notifications.
      pod 'BrazePushStory'
      Notification content extension library providing support for Push Stories.
Step 1.3: Install the SDK
To install the Braze SDK CocoaPod, navigate to the directory of your Xcode app project within your terminal and run the following command:

pod install
At this point, you should be able to open the new Xcode project workspace created by CocoaPods. Make sure to use this Xcode workspace instead of your Xcode project.
Updating the SDK using CocoaPods
To update a CocoaPod, simply run the following command within your project directory:

pod update
Step 1.1: Download the Braze SDK
Go to the Braze SDK release page on GitHub, then download braze-swift-sdk-prebuilt.zip.
Step 1.2: Choose your frameworks
The Braze Swift SDK contains a variety of standalone XCFrameworks, which gives you the freedom to integrate the features you want—without needing to integrate them all. Reference the following table to choose your XCFrameworks:
      BrazeLocation
      Location library that provides support for location analytics and geofence monitoring.
      BrazeUI
      Braze-provided user interface library for in-app messages, Content Cards, and Banners. Import this library if you intend to use the default UI components.
      BrazeNotificationService
      Notification service extension library that provides support for rich push notifications. Do not add this library directly to your main application target, instead add the BrazeNotificationService library separately.
      BrazePushStory
      Notification content extension library that provides support for Push Stories. Do not add this library directly to your main application target, instead add the BrazePushStory library separately.
      BrazeKitCompat
      Compatibility library containing all the Appboy and ABK* classes and methods that were available in the Appboy-iOS-SDK version 4.X.X. For usage details, refer to the minimal migration scenario in the migration guide.
      BrazeUICompat
      Compatibility library containing all the ABK* classes and methods that were available in the AppboyUI library from Appboy-iOS-SDK version 4.X.X. For usage details, refer to the minimal migration scenario in the migration guide.
      SDWebImage
      Dependency used only by BrazeUICompat in the minimal migration scenario.
Step 1.3: Prepare your files
Decide whether you want to use Static or Dynamic XCFrameworks, then prepare your files:
  Create a temporary directory for your XCFrameworks.
  In braze-swift-sdk-prebuilt, open the dynamic directory and move BrazeKit.xcframework into your directory. Your directory should be similar to the following:

 temp_dir
 └── BrazeKit.xcframework
  Move each of your chosen XCFrameworks into your temporary directory. Your directory should be similar to the following:

 temp_dir
 ├── BrazeKit.xcframework
 ├── BrazeKitCompat.xcframework
 ├── BrazeLocation.xcframework
 └── SDWebImage.xcframework
Step 1.4: Integrate your frameworks
Next, integrate the Dynamic or Static XCFrameworks you prepared previously:
In your Xcode project, select your build target, then General. Under Frameworks, Libraries, and Embedded Content, drag and drop the files you prepared previously.
 note: 

Starting with the Swift SDK 12.0.0, you should always select Embed & Sign for the Braze XCFrameworks for both the static and dynamic variants. This ensures that the frameworks resources are properly embedded in your app bundle.
To enable GIF support, add SDWebImage.xcframework, located in either braze-swift-sdk-prebuilt/static or braze-swift-sdk-prebuilt/dynamic.
Common errors for Objective-C projects
If your Xcode project only contains Objective-C files, you may get “missing symbol” errors when you try to build your project. To fix these errors, open your project and add an empty Swift file to your file tree. This will force your build toolchain to embed Swift Runtime and link to the appropriate frameworks during build time.

FILE_NAME.swift
Replace FILE_NAME with any non-spaced string. Your file should look similar to the following:

empty_swift_file.swift
Step 2: Set up delayed initialization (optional)
You can choose to delay when the Braze Swift SDK is initialized, which is useful if your app needs to load config or wait for user consent before starting the SDK. Delayed initialization ensures Braze push notifications are queued until the SDK is ready.
To enable this, call Braze.prepareForDelayedInitialization() as early as possible—ideally inside or before your application(_:didFinishLaunchingWithOptions:).
 note: 

This only applies to push notifications from Braze. Other push notifications are handled normally by system delegates.
    swift
    objective-c

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

@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

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  // Prepare the SDK for delayed initialization
  [Braze prepareForDelayedInitialization];
  // ... Additional non-Braze setup code
  return YES;
 note: 

Braze.prepareForDelayedInitialization(pushAutomation:) accepts an optional pushAutomation parameter. If set to nil, all push automation features are enabled, except requesting push authorization at launch.
Step 3: Update your app delegate
 important: 

The following assumes you’ve already added an AppDelegate to your project (which are not generated by default). If you don’t plan on using one, be sure to initialize the Braze SDK as early as possible, like during the app’s launch.
    swift
    objective-c
Add the following line of code to your AppDelegate.swift file to import the features included in the Braze Swift SDK:

import BrazeKit
Next, add a static property to your AppDelegate class to keep a strong reference to the Braze instance throughout your application’s lifetime:

class AppDelegate: UIResponder, UIApplicationDelegate {
  static var braze: Braze? = nil
Finally, in AppDelegate.swift, add the following snippet to your application:didFinishLaunchingWithOptions: method:

let configuration = Braze.Configuration(
    apiKey: "YOUR-APP-IDENTIFIER-API-KEY",
    endpoint: "YOUR-BRAZE-ENDPOINT"
let braze = Braze(configuration: configuration)
AppDelegate.braze = braze
Update YOUR-APP-IDENTIFIER-API-KEY and YOUR-BRAZE-ENDPOINT with the correct value from your App Settings page. Check out our API identifier types for more information on where to find your app identifier API key.




    

Add the following line of code to your AppDelegate.m file:

@import BrazeKit;
Next, add a static variable to your AppDelegate.m file to keep a reference to the Braze instance throughout your application’s lifetime:

static Braze *_braze;
@implementation AppDelegate
+ (Braze *)braze {
  return _braze;
+ (void)setBraze:(Braze *)braze {
  _braze = braze;
Finally, within your AppDelegate.m file, add the following snippet within your application:didFinishLaunchingWithOptions: method:

BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:"YOUR-APP-IDENTIFIER-API-KEY"
                                                                  endpoint:"YOUR-BRAZE-ENDPOINT"];
Braze *braze = [[Braze alloc] initWithConfiguration:configuration];
AppDelegate.braze = braze;
Update YOUR-APP-IDENTIFIER-API-KEY and YOUR-BRAZE-ENDPOINT with the correct value from your Manage Settings page. Check out our API documentation for more information on where to find your app identifier API key.
Optional configurations
Logging
Log levels
The default log level for the Braze Swift SDK is .error—it’s also the minimum supported level when logs are enabled. These are the full list of log levels:
Setting the log level
You can assign the log level at runtime in your Braze.Configuration object. For complete usage details, see Braze.Configuration.Logger.
    swift
    objective-c

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)

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];
About the Web Braze SDK
The Web Braze SDK lets you collect analytics and display rich in-app messages, push, and Content Card messages to your web users. For more information, see Braze JavaScript reference documentation.
 note: 

This guide uses code samples from the Braze Web SDK 4.0.0+. To upgrade to the latest Web SDK version, see SDK Upgrade Guide.
Integrating the Web SDK
You can integrate the Web Braze SDK using the following methods. For additional options, see other integration methods.
  Code-Based Integration: Integrate the Web Braze SDK directly in your codebase using your preferred package manager or the Braze CDN. This will give you full control over how the SDK is loaded and configured.
  Google Tag Manager: A no-code solution that let’s you integrate the Web Braze SDK without modifying your site’s code. For more information, see Google Tag Manager with the Braze SDK.
    code-based integration
    google tag manager
Step 1: Install the Braze library
You can install the Braze library using one of the following methods. However, if your website uses a Content-Security-Policy, review the Content Security Policy before continuing.
 important: 

While most ad blockers will not block the Braze Web SDK, some more-restrictive ad blockers are known to cause issues.
    package manager
    braze cdn
If your site uses NPM or Yarn package managers, you can add the Braze NPM package as a dependency.
Typescript definitions are now included as of v3.0.0. For notes on upgrading from 2.x to 3.x, see our changelog.

npm install --save @braze/web-sdk
# or, using yarn:
# yarn add @braze/web-sdk
Once installed, you can import or require the library in the typical fashion:

import * as braze from "@braze/web-sdk";
// or, using `require`
const braze = require("@braze/web-sdk");
Add the Braze Web SDK directly to your HTML by referencing our CDN-hosted script, which loads the library asynchronously.
Step 2: Initialize the SDK
After the Braze Web SDK is added to your website, initialize the library with the API key and SDK endpoint URL found in Settings > App Settings within your Braze dashboard. For a complete list of options for braze.initialize(), along with our other JavaScript methods, see Braze JavaScript documentation.

// 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();
 important: 

Anonymous users on mobile or web devices may be counted towards your MAU. As a result, you may want to conditionally load or initialize the SDK to exclude these users from your MAU count.
Prerequisites
Before you can use this integration method, you’ll need to create an account and container for Google Tag Manager.
Step 1: Open the tag template gallery
In Google Tag Manager, choose your workspace, then select Templates. In the Tag Template pane, select Search Gallery.
Step 2: Add the initialization tag template
In the template gallery, search for braze-inc, then select Braze Initialization Tag.
Select Add to workspace > Add.
Step 3: Configure the tag
From the Templates section, select your newly added template.
Select the pencil icon to open the Tag Configuration dropdown.
Enter the minimum required information:
      API Endpoint
      Your REST endpoint URL. Your endpoint will depend on the Braze URL for your instance.
      SDK Version
      The most recent MAJOR.MINOR version of the Web Braze SDK listed in the changelog. For example, if the latest version is 4.1.2, enter 4.1. For more information, see About SDK version management.
Step 5: Verify your integration
You can verify your integration using either of the following options:
  Option 1: Using Google Tag Manager’s debugging tool, you can check if the Braze Initialization Tag is triggering correctly on your configured pages or events.
  Option 2: Check for any network requests made to Braze from your web page. Additionally, the global window.braze library should now be defined.
Logging
To quickly enable logging, you can add ?brazeLogging=true as a parameter to your website URL. Alternatively, you can enable basic or custom logging.
Basic logging
    before initialization
    after initialization
Use enableLogging to log basic debugging messages to the JavaScript console before the SDK is initialized.

enableLogging




    
: true
Your method should be similar to the following:

braze.initialize('API-KEY', {
    baseUrl: 'API-ENDPOINT',
    enableLogging: true
braze.openSession();
Use braze.toggleLogging() to log basic debugging messages to the JavaScript console after the SDK is initialized. Your method should be similar to the following:

braze.initialize('API-KEY', {
    baseUrl: 'API-ENDPOINT',
braze.openSession();
braze.toggleLogging();
 important: 

Basic logs are visible to all users, so consider disabling, or switch to setLogger, before releasing your code to production.
Custom logging
Use setLogger to log custom debugging messages to the JavaScript console. Unlike basic logs, these logs are not visible to users.

setLogger(loggerFunction: (message: STRING) => void): void
Replace STRING with your message as a single string parameter. Your method should be similar to the following:

braze.initialize('API-KEY');
braze.setLogger(function(message) {
    console.log("Braze Custom Logger: " + message);
braze.openSession();
Upgrading the SDK
 note: 

This guide uses code samples from the Braze Web SDK 4.0.0+. To upgrade to the latest Web SDK version, see SDK Upgrade Guide.
When you reference the Braze Web SDK from our content delivery network, for example, https://js.appboycdn.com/web-sdk/a.a/braze.min.js (as recommended by our default integration instructions), your users will receive minor updates (bug fixes and backward compatible features, versions a.a.a through a.a.z in the above examples) automatically when they refresh your site.
However, when we release major changes, we require you to upgrade the Braze Web SDK manually to ensure that nothing in your integration will be impacted by any breaking changes. Additionally, if you download our SDK and host it yourself, you won’t receive any version updates automatically and should upgrade manually to receive the latest features and bug fixes.
You can keep up-to-date with our latest release following our release feed with the RSS Reader or service of your choice, and see our changelog for a full accounting of our Web SDK release history. To upgrade the Braze Web SDK:
  Update the Braze library version by changing the version number of https://js.appboycdn.com/web-sdk/[OLD VERSION NUMBER]/braze.min.js, or in your package manager’s dependencies.
  If you have web push integrated, update the service worker file on your site - by default, this is located at /service-worker.js at your site’s root directory, but the location may be customized in some integrations. You must access the root directory to host a service worker file.
These two files must be updated in coordination with each other for proper functionality.
Other integration methods
Accelerated Mobile Pages (AMP)
See more

Step 1: Include AMP web push script
Add the following async script tag to your head:

<script async custom-element="amp-web-push" src="https://cdn.ampproject.org/v0/amp-web-push-0.1.js"></script>
Step 2: Add subscription widgets
Add a widget to the body of your HTML that allows users to subscribe and unsubscribe from push.

<!-- 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>
Step 3: Add helper-iframe and permission-dialog
The AMP Web Push component creates a popup to handle push subscriptions, so you’ll need to add the following helper files to your project to enable this feature:
  helper-iframe.html
  permission-dialog.html
Step 4: Create a service worker file
Create a service-worker.js file in the root directory of your website and add the following snippet:
Step 5: Configure the AMP web push HTML element
Add the following amp-web-push HTML element to your HTML body. Keep in mind, you need to append your apiKey and baseUrl as query parameters to service-worker-URL.

<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}"
Module loader
If you use RequireJS or other AMD module-loaders we recommend self-hosting a copy of our library and referencing it as you would with other resources:

require(['path/to/braze.min.js'], function(braze) {
  braze.initialize('YOUR-API-KEY-HERE', { baseUrl: 'YOUR-SDK-ENDPOINT' });
  braze.automaticallyShowInAppMessages();
  braze.openSession();
Electron
Electron does not officially support web push notifications (see: this GitHub issue). There are other open source workarounds you may try that have not been tested by Braze.
Jest framework
When using Jest, you may see an error similar to SyntaxError: Unexpected token 'export'. To fix this, adjust your configuration in package.json to ignore the Braze SDK:

"jest": {
  "transformIgnorePatterns": [
    "/node_modules/(?!@braze)"
SSR frameworks
If you use a Server-Side Rendering (SSR) framework such as Next.js, you may encounter errors because the SDK is meant to be run in a browser environment. You can resolve these issues by dynamically importing the SDK.
You can retain the benefits of tree-shaking when doing so by exporting the parts of the SDK that you need in a separate file and then dynamically importing that file into your component.

// 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();
}, []);
Alternatively, if you’re using webpack to bundle your app, you can take advantage of its magic comments to dynamically import only the parts of the SDK that you need.

// 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 offers a basic turnkey Braze integration. To configure the integration, search for Braze in the Tealium Tag Management interface, and provide the Web SDK API key from your dashboard.
For more details or in-depth Tealium configuration support, check out our integration documentation or reach out to your Tealium account manager.
If you use Vite and see a warning around circular dependencies or Uncaught TypeError: Class extends value undefined is not a constructor or null, you may need to exclude the Braze SDK from its dependency discovery:

optimizeDeps: {
    exclude: ['@braze/web-sdk']
Other tag managers
Braze may also be compatible with other tag management solutions by following our integration instructions within a custom HTML tag. Reach out to a Braze representative if you need help evaluating these solutions.
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
 warning: 

Only add the Braze Cordova SDK using the methods below. Do not attempt to install using other methods as it could lead to a security breach.
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.
    geofence disabled
    geofence enabled
If you don’t plan on using location collection and geofences, use the master branch from GitHub.

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.

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.
    android

<preference name="com.braze.ios_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.ios_api_endpoint" value="CUSTOM_API_ENDPOINT" />

<preference name="com.braze.android_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.android_api_endpoint" value="CUSTOM_API_ENDPOINT" />

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

<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
    android
Integer preferences are read as string representations, like in the following example:

<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:

<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>
Boolean preferences are read by the SDK using YES and NO keywords as a string representation, like in the following example:

<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:

<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:
    android
      ios_disable_automatic_push_registration
      Sets whether automatic push registration should be disabled.
      ios_disable_automatic_push_handling
      Sets whether automatic push handling should be disabled.
      ios_enable_idfa_automatic_collection
      Sets whether the Braze SDK should automatically collect the IDFA information. For more information, see the Braze IDFA method documentation.
      enable_location_collection
      Sets whether the automatic location collection is enabled (if the user permits). The geofence-branch
      geofences_enabled
      Sets whether geofences are enabled.
      ios_session_timeout
      Sets the Braze session timeout for your application in seconds. Defaults to 10 seconds.
      sdk_authentication_enabled
      Sets whether to enable the SDK Authentication feature.
      display_foreground_push_notifications
      Sets whether push notifications should be displayed while the application is in the foreground.
      ios_disable_un_authorization_option_provisional
      Sets whether UNAuthorizationOptionProvisional should be disabled.
      trigger_action_minimum_time_interval_seconds
      Sets the minimum time interval in seconds between triggers. Defaults to 30 seconds.
      ios_push_app_group
      Sets the app group ID for iOS push extensions.
      ios_forward_universal_links
      Sets if the SDK should automatically recognize and forward universal links to the system methods.
      ios_log_level
      Sets the minimum logging level for Braze.Configuration.Logger.
      ios_use_uuid_as_device_id
      Sets if a randomly generated UUID should be used as the device ID.
      ios_flush_interval_seconds
      Sets the interval in seconds between automatic data flushes. Defaults to 10 seconds.
      ios_use_automatic_request_policy
      Sets whether the request policy for Braze.Configuration.Api should be automatic or manual.
      should_opt_in_when_push_authorized
      Sets if a user’s notification subscription state should automatically be set to optedIn when push permissions are authorized.
      android_notification_accent_color
      Sets the notification accent color using a hexadecimal representation.
      android_default_session_timeout
      Sets the Braze session timeout for your application in seconds. Defaults to 10 seconds.
      android_handle_push_deep_links_automatically
      Sets whether the Braze SDK should automatically handle push deep links.
      android_log_level
      Sets the log level for your application. The default log level is 4 and will minimally log info. To enable verbose logging for debugging, use log level 2.
      firebase_cloud_messaging_registration_enabled
      Sets whether to use Firebase Cloud Messaging for push notifications.
      android_fcm_sender_id
      Sets the Firebase Cloud Messaging sender ID.
      enable_location_collection
      Sets whether the automatic location collection is enabled (if the user permits).
      geofences_enabled
      Sets whether geofences are enabled.
      android_disable_auto_session_tracking
      Disable the Android Cordova plugin from automatically tracking sessions. For more information, see Disabling automatic session tracking
      sdk_authentication_enabled
      Sets whether to enable the SDK Authentication feature.
      trigger_action_minimum_time_interval_seconds
      Sets the minimum time interval in seconds between triggers. Defaults to 30 seconds.
      is_session_start_based_timeout_enabled
      Sets whether the session timeout behavior to be based either on session start or session end events.
      default_notification_channel_name
      Sets the user-facing name as seen via NotificationChannel.getName for the Braze default NotificationChannel.
      default_notification_channel_description
      Sets the user-facing description as seen via NotificationChannel.getDescription for the Braze default NotificationChannel.
      does_push_story_dismiss_on_click
      Sets whether a Push Story is automatically dismissed when clicked.
      is_fallback_firebase_messaging_service_enabled
      Sets whether the use of a fallback Firebase Cloud Messaging Service is enabled.
      fallback_firebase_messaging_service_classpath
      Sets the classpath for the fallback Firebase Cloud Messaging Service.
      is_content_cards_unread_visual_indicator_enabled
      Sets whether the Content Cards unread visual indication bar is enabled.
      is_firebase_messaging_service_on_new_token_registration_enabled
      Sets whether the Braze SDK will automatically register tokens in com.google.firebase.messaging.FirebaseMessagingService.onNewToken.
      is_push_deep_link_back_stack_activity_enabled
      Sets whether Braze will add an activity to the back stack when automatically following deep links for push.
      push_deep_link_back_stack_activity_class_name
      Sets the activity that Braze will add to the back stack when automatically following deep links for push.
      should_opt_in_when_push_authorized
      Sets if Braze should automatically opt-in the user when push is authorized.

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

<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:

<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.
About the Flutter Braze SDK
After you integrate the Braze Flutter SDK on Android and iOS, you’ll be able to use the Braze API within your Flutter apps written in Dart. This plugin provides basic analytics functionality and lets you integrate in-app messages and Content Cards for both iOS and Android with a single codebase.
Integrating the Flutter SDK
Prerequisites
Before you integrate the Braze Flutter SDK, you’ll need to complete the following:
      Braze API app identifier
      To locate your app’s identifier, go to Settings > APIs and Identifiers > App Identifiers. For more information see, API Identifier Types.
      Braze REST endpoint
      Your REST endpoint URL. Your endpoint will depend on the Braze URL for your instance.
      Flutter SDK
      Install the official Flutter SDK and ensure it meets the Braze Flutter SDK’s minimum supported version.
Step 1: Integrate the Braze library
Add the Braze Flutter SDK package from the command line. This will add the appropriate line to your pubspec.yaml.

flutter pub add braze_plugin
Step 2: Complete native SDK setup
    android
To connect to Braze servers, create a braze.xml file in your project’s android/res/values folder. Paste the following code and replace the API identifier key and endpoint with your values:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string 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>
Add the required permissions to your AndroidManifest.xml file:

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    swift
    objective-c
Add Braze SDK import at the top of the AppDelegate.swift file:

import BrazeKit
import braze_plugin
In the same file, create the Braze configuration object in the application(_:didFinishLaunchingWithOptions:) method and replace the API key and endpoint with your app’s values. Then, create the Braze instance using the configuration, and create a static property on the AppDelegate for easy access:

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
Import BrazeKit at the top of the AppDelegate.m file:

@import BrazeKit;
In the same file, create the Braze configuration object in the application:didFinishLaunchingWithOptions: method and replace the API key and endpoint with your app’s values. Then, create the Braze instance using the configuration, and create a static property on the AppDelegate for easy access:

- (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;
Then, initialize an instance of the Braze plugin by calling new BrazePlugin() like in our sample app.
 important: 

To avoid undefined behaviors, only allocate and use a single instance of the BrazePlugin in your Dart code.
Testing the integration
You can verify that the SDK is integrated by checking session statistics in the dashboard. If you run your application on either platform, you should see a new session in dashboard (in the Overview section).
Open a session for a particular user by calling the following code in your app.

BrazePlugin braze = BrazePlugin();
braze.changeUser("{some-user-id}");
Search for the user with {some-user-id} in the dashboard under Audience > Search Users. There, you can verify that session and device data have been logged.
About the React Native Braze SDK
Integrating the React Native Braze SDK provides basic analytics functionality and lets you integrate in-app messages and Content Cards for both iOS and Android with just one codebase.
New Architecture compatibility
The following minimum SDK version is compatible with all apps using React Native’s New Architecture:
React Native: 2.0.1+  

Starting with SDK version 6.0.0, Braze uses a React Native Turbo Module, which is compatible with both the New Architecture and legacy bridge architecture—meaning no additional setup is required.
 warning: 

If your iOS app conforms to RCTAppDelegate and follows our previous AppDelegate setup, review the samples in Complete native setup to prevent any crashes from occurring when subscribing to events in the Turbo Module.
Integrating the React Native SDK
Prerequisites
To integrate the SDK, React Native version 0.71 or later is required. For the full list of supported versions, see our React Native SDK GitHub repository.
Step 1: Integrate the Braze library

Integrating the Android SDK

Step 1: Update your build.gradle

Step 3: Add permissions to AndroidManifest.xml

Step 4: Enable user session tracking

Testing session tracking

Optional configurations

Runtime configuration

Google Advertising ID

Location tracking

Logging

Enabling logs

Verifying verbose logs

Suppressing logs

Multiple API keys

Exclusive in-app message TalkBack

R8 and ProGuard

Integrating the Swift SDK

Prerequisites

Step 1: Install the Braze Swift SDK

Step 1.1: Import SDK version

Step 1.2: Select your packages

Step 1.1: Install CocoaPods

Step 1.2: Constructing the Podfile

About additional libraries

Extension libraries

Step 1.3: Install the SDK

Updating the SDK using CocoaPods

Step 1.1: Download the Braze SDK

Step 1.2: Choose your frameworks

Step 1.3: Prepare your files

Step 1.4: Integrate your frameworks

Common errors for Objective-C projects

Step 2: Set up delayed initialization (optional)

Step 3: Update your app delegate

Optional configurations

Logging

Log levels

Setting the log level

About the Web Braze SDK

Integrating the Web SDK

Step 1: Install the Braze library

Step 2: Initialize the SDK

Prerequisites

Step 1: Open the tag template gallery

Step 2: Add the initialization tag template

Step 3: Configure the tag

Step 5: Verify your integration

Logging

Basic logging

Custom logging

Upgrading the SDK

Other integration methods

Accelerated Mobile Pages (AMP)

Step 1: Include AMP web push script

Step 2: Add subscription widgets

Step 3: Add helper-iframe and permission-dialog

Step 4: Create a service worker file

Step 5: Configure the AMP web push HTML element

Module loader

Electron

Jest framework

SSR frameworks

Tealium iQ

Other tag managers

Integrating the Cordova SDK

Prerequisites

Step 1: Add the SDK to your project

Step 2: Configure your project

Platform-specific syntax

Integers

Optional configurations

Disabling automatic session tracking (Android only)

About the Flutter Braze SDK

Integrating the Flutter SDK

Prerequisites

Step 1: Integrate the Braze library

Step 2: Complete native SDK setup

Testing the integration

About the React Native Braze SDK

New Architecture compatibility

Step 1: Update your `build.gradle`

Step 3: Add permissions to `AndroidManifest.xml`

Step 3: Add `helper-iframe` and `permission-dialog`

Step 3.1: Configure `AndroidManifest.xml`

Step 3.2: Update `AndroidManifest.xml` with your package name