Event

Braze is a comprehensive customer engagement platform that powers relevant experiences between consumers and brands they love. Braze helps brands foster human connection through interactive conversations across channels.

Braze offers a broad range of functionality via their solution and it is critically important that you work directly with your Braze representative to ensure that you are correctly planning and implementing their features. mParticle does not recommend enabling forwarding to Braze until you have completed the Braze planning process with your Braze team.

• Braze Documentation

mParticle Braze Implementation Scenarios

The mParticle SDK allows you to include the Braze kit which allows Braze interface components (images, layout files, etc.) and as a result supports many Braze features, including:

• App Analytics
• User Segmentation
• Push Notifications
• Email
• News Feed
• In-App Messaging
• Feedback
• Geolocation

Features are supported by the mParticle SDK only after you install the mParticle Braze Kit (formerly Appboy), which then forwards data from your app to Braze.

Features are supported in two ways:

• The kit itself provides functionality directly without you having to call the third-party SDK. For example, most partners have a method called or equivalent to logEvent. When someone calls mParticle.logEvent, our kits map to the partner SDK logEvent method, in this case, Braze.logEvent, and automatically sends it to Braze. You don’t have to call Braze.logEvent because mParticle does it for you after you call mParticle.logEvent.
• For some features, for example some Braze banners or modals, you must call Braze.bannerMethod() or Braze.modalMethod(). Our kit loads Braze so that you can call any Braze method you need, even if our kit does not call it for you.

The mParticle S2S API allows you to send data server side (API reference). The S2S API supports iOS, Android and Web data. In this scenario, mParticle forwards data via Braze’s REST API which supports a limited set of features.

For server-side data to be forwarded to Braze, it must include your selected External Identity Type.

The following event types can be forwarded to Braze via S2S:

• Commerce Event
• Custom Event
• Opt Out
• Push Message
• Push Message Registration
• Screen View
• Session Start / End

Kit Integration

The Braze solution offers features that involve Braze-proprietary user interaction components including Newsfeed, In-App Messaging, and Feedback.

To use Braze with one of the mParticle mobile SDKs, please review the kit documentation for the Android SDK or the iOS SDK.

You must directly call the Braze kit to use the Newsfeed, In-App Messaging, and Feedback features. Examples of directly calling a kit are provided for both Android and iOS.

To use Braze with the mParticle web SDK, continue reading below.

Push Notifications

Push notifications work differently for web and for mobile.

Web

mParticle integrates with Braze to allow web push notifications to further engage your visitors. We integrated Braze’s Soft Push Prompts, which allows you to ask your user if they’d like to stay in touch before the browser alerts them to allow notifications. This is done since the browser throttles how often you can prompt the user for push notifications, and if the user denies permission, you can never ask them again. See below for directions on how to implement push notifications, which customizes Braze’s implementation instructions to work with mParticle.

1. Configure your site

   • Create a service-worker.js file to your root directory. Inside your service-worker.js file, include

   self.importScripts('https://static.mparticle.com/sdk/js/braze/service-worker-3.5.0.js');

   mParticle hosts Braze’s service worker in order to prevent unpredictable versioning issues. Do not use Braze’s service-worker.js CDN.

2. Configure Safari Push

   • Generate a Safari Push Certificate following these “Registering with Apple” Instructions
   • In the Braze dashboard, on the app settings page (where your API keys are located), select your Web app. Click “Configure Safari Push” and follow the instructions, uploading the push certificate you just generated.
   • In your mParticle dashboard, open your Braze connection settings. Under Safari Website Push ID, type in your Website Push ID you used when generating your Safari Push Certificate (beginning with web) and click Save.

3. Create a “Prime for Push” in-app messaging Campaign on the Braze dashboard. Note that this is an In-App Messaging Campaign, and not a Push Notification messaging campaign.

   • Make it a “Modal” In-App Message. Give it whatever text and styling you wish to present to the user (“Can we stay in touch?”).
   • Give the in-app message a Button 1 Text value of “OK” (or whatever affirmative text you wish), and set the On-Click Behavior to “Close Message.”
   • Under the gear composer section, add a key-value pair. Give it a key of msg-id and a value of push-primer.
   • You can create a prime-for-push custom event (or name it whatever you’d like) from the Braze dashboard. While still in the Braze dashboard, create a trigger action of whatever your custom event is (ie, prime-for-push). In the mParticle Braze connection settings, fill in the "Soft Push" Custom Event Name with your custom event name (ie. prime-for-push). When this field is filled, users will be sent the Soft Push Prompt on session load.

   • Optionally, you can change the name and location of service-worker.js. The following example will clarify the steps:

     • Let’s say that you want to rename your service-worker.js file to braze-push-worker.js and store it in inside a directory in your root folder called thirdParty/.
     • In your mParticle dashboard, open your Braze connection settings. Under Push Notification Service Worker File Location, type in /thirdParty/braze-push-worker.js and click Save.
     • Warning - Setting a value here limits the scope of push notifications on your site. For instance, in the above example, because the service worker file is located within the /thirdParty/ directory, asking for push notifications MAY ONLY BE CALLED from web pages that start with http://your-site-name.com/thirdParty/.

Web Troubleshooting Tips

• Firefox - starting with version 72, Firefox requires user interaction before showing a full push permission dialogue box. See here for more details.
• Ensure that your OS-wide notifications for the browser you are testing are not disabled.
• If you have previously allowed or rejected push requests while testing, you will need to clear local storage/cookies as well as the browser’s notification preference for your development URL for optimal testing.

Mobile

As long as the Appboy Kit is included in your app, mParticle will pass any Push Notifications from Braze to the kit for display. However, you will need to provide credentials in the Braze dashboard.

See the main iOS and Android Push Notification documentation for more detail.

Location Tracking

The Braze kits for iOS and Android support Braze’s automatic location tracking features, provided that the appropriate app-level permissions are granted by the user.

Android

For Android push notifications you will need to provide your Server Key in your app settings page under Push Notification Settings.

iOS

For iOS push notifications you will need to upload your APNs Push SSL certificate to Braze. See the Braze documentation for more.

Special Considerations for mParticle A/B Testing With Braze and the mParticle SDK

mParticle supports the ability to conduct A/B testing with different integrations by sending a sample of users and their data to one integration and a different sample of users and their data to a different integration. If you are using the mParticle SDK for Braze deployment and calling Braze methods directly, when instrumenting with the mParticle SDK you must ensure that the Appboy kit is active in the App before calling an Appboy method. This is very important and ensures that you are not inadvertently calling Braze methods for apps/users that are not part of an Braze A/B sample.

Roku

mParticle supports the ability to forward server-side events for the Roku platform. Note that only data that includes your selected External Identity Type can be forwarded to Braze.

Data Processing Notes

mParticle will always forward events if sent via the mParticle SDK, provided you have included the Braze kit, but will only forward events sent via the mParticle S2S API if the following conditions apply:

1. The App Group REST API Key setting is specified.
2. Either your set External Identity Type, or a push token is specified.
3. Braze has limits on the number of characters in a property key - they must be less than or equal to 255 characters, with no leading dollar signs. mParticle will remove the dollar sign ($) when forwarding property keys for user attributes, custom and e-commerce events.

Braze Instance

Braze maintains several instances. As part of the Configuration Settings, you need to specify which one your data should be forwarded to. You can tell your Braze Instance from the URL of your Braze Dashboard.

Check with your Braze account manager if you are unsure which Braze instance you are using.

There is also the ability to specify a Custom instance, which allows you to specify separate endpoints for REST, SDK and Javascript.

Prerequisites

In order to activate the Braze integration, you will need your Braze App Identifier API key and your “App Group REST API Key” if using the S2S API.

1. Sign into your Braze Account.
2. Click on Developer Console in the left navigation, then API Settings, Identification, and choose the Identifier for the platform you’re building to.
3. If you are sending data to mParticle via the S2S API, your “App Group REST API Key” value is required. Click on the Developer Console in the left navigation to get this value.

Event Data Mapping

Commerce Events

All commerce events are expanded based on the number of products. In other words, a single incoming event with 2 unique products would result in at least 2 outgoing Braze events.

Purchase Events

A purchase event is expanded and mapped to Braze purchase event(s). For each product, a single outgoing Braze event is generated.

In addition to the Common Commerce Fields, the following information is also captured, if defined:

Other Commerce Events

All other e-commerce event types are expanded and mapped to Braze custom events. Note:

• Each product results in the generation of a single Braze event.
• If a refund, an additional event representing the total is also generated.

As such, all relevant product and transaction information is conveyed via the properties field.

In addition to the Common Commerce Fields, the following information is also captured, if defined:

Common Commerce Fields

All commerce events, regardless of type, capture these common fields in the properties dictionary in the following way:

Note that in order to forward the TransactionId, you must include the transactionAttributes as the fifth argument below. See our API docs for how to build transaction attributes.

mParticle.eCommerce.logProductAction(
    mParticle.ProductActionType.AddToCart,
    [product1, product2],
    customAttributes,
    customFlags, //can also be `null`, but can't be blank
    transactionAttributes);

Screen Views

Your screen view events will be passed to Braze using the screen name that you passed to our logScreen SDK method, as the event name.

If you are using automatic screen tracking in our Android SDK, the automatically-generated screen view events will be forwarded to Braze using the name of the associated Activity class.

Session Start / End

To send session start and end events for S2S to Braze, enable the Forward Session Events connection setting. After enabling this setting, session start and end events are forwarded to Braze as custom events with the names Session Start and Session End. When available, session IDs are also sent in the session_id property on all session starts and ends, screen view, and custom events.

However, note that mParticle SDK kits do not support session events, which are never forwarded with a kit, whether or not Forward Session Events is enabled.

Custom Events

All custom events will be forwarded to Braze using the event name that you passed to your logEvent SDK method. All event attributes will be forwarded to Braze as Braze custom event properties using the attribute names you passed to your logEvent SDK method as well.

User Attributes

The table below describes how the mParticle integration maps user attributes to Braze’s profile attributes.

Braze advises to coerce data types on user attributes shared with Braze before sending Production volume data. This ensure that the custom attributes received by Braze are of the expected data type. This can impact segment building and triggering campaigns. If incorrect data types are identified after data has been flowing, there can be extra work to true up the users with the legacy data type on those attributes. To give Braze’s type detection a better opportunity to evaluate data types properly, you can enable the following 2 Connection Settings: Enable API Custom Attribute Type Detection and Enable Kit Custom Attribute Type Detection.

Enriched Attributes and Identities

By default, mParticle forwards all available user attributes and user identities to Braze, including attributes added during profile enrichment. You can disable this behavior in the Connection Settings. Only data which is sent to Braze Server to Server can be enriched.

Configuration Settings

Connection Settings

Braze Web Kit Citical Updates and Timelines

Braze occasionally makes breaking changes to their SDK, so if you call Braze directly in your code, you will have to update your code to ensure your website performs as expected when updating versions of Braze.

Customers who implement mParticle via NPM and self-host our SDK can choose when they want to update their code and @mParticle/web-braze-kit version, but customers who implement mParticle via our snippet/CDN must pay close attention to the following timelines and instructions.

Opt In to Braze SDK Version 4 from Version 3

Please review Braze’s Changelog notes as well as Braze’s migration guide between version 3 and 4 to understand these changes and what code updates are needed from your side. The largest change is the move from class name appboy to braze. Braze also removed and renamed some APIs. As a result, we are also updating our mParticle Braze web kit from 3.0.X to 4.0.X in order to support Braze’s Web SDK version 4.2.1.

Customers will be able to opt in to using the latest version of Braze’s Web SDK both via npm and via snippet/CDN

• Customers who self-host mParticle via npm - You can use @mparticle/web-braze-kit version 4.0.0 in your package.json now! This has been available since 10/15/2022.
• Customers who load mParticle via snippet/CDN - Opting in will be available soon via the mParticle UI in your Braze connection settings.

Note that the following is only one example. Everywhere you manually call appboy needs to be updated similar to the below.

• Step 1: Legacy code sample. Find all the places where your code references the appboy.display namespace. Braze has removed all instances of the display namespace:

window.appboy.display.destroyFeed();

Step 2: Roll out code changes to be used before you opt in to using Version 4 of the Braze Web SDK so that it works under both versions:

if (window.appboy) {
    window.appboy.display.destroyFeed();
} else if (window.braze) {
    window.braze.destroyFeed();
}

Step 3: After opting in to Version 4 of the Braze Web SDK, you can simplify your code:

window.braze.destroyFeed();

Step 4: Push Notifications via service-worker.js If you use Push Notifications, we have updated the service-worker.js file. In our testing, Braze’s push notifications work as expected regardless of what version of the service-worker is used, but we recommend updating this file to ensure future compatibility. In your service-worker.js file, update the code to reference https://static.mparticle.com/sdk/js/braze/service-worker-4.2.0.js instead of https://static.mparticle.com/sdk/js/braze/service-worker-3.5.0.js. Your service-worker.js file should now contain:

self.imports('https://static.mparticle.com/sdk/js/braze/service-worker-4.2.0.js')

Transition from @mparticle/web-appboy-kit to @mparticle/web-braze-kit

The legacy @mparticle/web-appboy-kit from npm includes version 2 of the Braze Web SDK. As part of this update, we’ve created a new Braze web kit repo to replace our deprecated Appboy web kit repo. If you are still using @mparticle/web-appboy-kit, you will need to consider the breaking changes Braze made between V2 and V3 of the Braze SDK (found here) as well as the instructions above to get from V2 to V4 of the Braze SDK.