A React Native component to access the native Salesforce Marketing Cloud MobilePush SDKs
npm install react-native-marketingcloudsdkUse this module to implement the Marketing Cloud MobilePush SDK for your iOS and Android applications.
Release notes for the plugin can be found here
#### iOS
- Import both SFMCSDK and MarketingCloudSDK in AppDelegate and update the configuration of the SDK as outlined in Step 2 Configure the SDK for iOS.
- Update the delegate methods and verify your implementation by following iOS guide.
#### Android
Ensure that you import SFMCSdk and properly configure the SDK as specified in Step 3 Configure the SDK for Android, which details the process of configuring the SDK for Android in this guide.
* Plugin has a version dependency on React Native v0.60+
#### 1. Add plugin to your application via npm
``shell`
npm install react-native-marketingcloudsdk --save
or via yarn
`shell`
yarn add react-native-marketingcloudsdk
#### 1. Add Marketing Cloud SDK repository
android/build.gradle`groovy`
allprojects {
repositories {
maven { url "https://salesforce-marketingcloud.github.io/MarketingCloudSDK-Android/repository" }
//... Other repos
}
}
#### 2. Provide FCM credentials
1. To enable push support for the Android platform you will need to include the google-services.json file. Download the file from your Firebase console and place it into the android/app directory
2. Include the Google Services plugin in your build
android/build.gradle`groovy
buildscript {
repositories {
google() // Google's Maven repository
}
dependencies {
// ...
// Add the following line:
classpath 'com.google.gms:google-services:4.3.15'
}
}
`android/app/build.gradle
3. Apply the plugin`groovy`
// Add the google services plugin to your build.gradle file
apply plugin: 'com.google.gms.google-services'
#### 3. Configure the SDK in your MainApplication.java class
`java
@Override
public void onCreate() {
super.onCreate();
SFMCSdk.configure((Context) this, SFMCSdkModuleConfig.build(builder -> {
builder.setPushModuleConfig(MarketingCloudConfig.builder()
.setApplicationId("{MC_APP_ID}")
.setAccessToken("{MC_ACCESS_TOKEN}")
.setSenderId("{FCM_SENDER_ID_FOR_MC_APP}")
.setMarketingCloudServerUrl("{MC_APP_SERVER_URL}")
.setNotificationCustomizationOptions(NotificationCustomizationOptions.create(R.drawable.ic_notification))
.setAnalyticsEnabled(true)
.build(this));
return null;
}), initializationStatus -> {
Log.e("TAG", "STATUS "+initializationStatus);
if (initializationStatus.getStatus() == 1) {
Log.e("TAG", "STATUS SUCCESS");
}
return null;
});
// ... The rest of the onCreate method
}
`
#### 1. Install pod for Marketing Cloud SDK
`shell`
// In your App, go to ios directory after installing plugin via npm or yarn.
cd ios
pod install
#### 2. Configure the SDK in your AppDelegate.m class
`objc
#import
#import
// Other imports ...
- (BOOL)application:(UIApplication *)application
didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Configure the SFMC sdk
PushConfigBuilder *pushConfigBuilder = [[PushConfigBuilder alloc] initWithAppId:@"{MC_APP_ID}"];
[pushConfigBuilder setAccessToken:@"{MC_ACCESS_TOKEN}"];
[pushConfigBuilder setMarketingCloudServerUrl:[NSURL URLWithString:@"{MC_APP_SERVER_URL}"]];
[pushConfigBuilder setMid:@"MC_MID"];
[pushConfigBuilder setAnalyticsEnabled:YES];
[SFMCSdk initializeSdk:[[[SFMCSdkConfigBuilder new] setPushWithConfig:[pushConfigBuilder build] onCompletion:^(SFMCSdkOperationResult result) {
if (result == SFMCSdkOperationResultSuccess) {
//Enable Push
} else {
// SFMC sdk configuration failed.
NSLog(@"SFMC sdk configuration failed.");
}
}] build]];
// ... The rest of the didFinishLaunchingWithOptions method
}
`
#### 3. Enable Push
Follow these instructions to enable push for iOS.
The SDK doesn’t automatically present URLs from these sources.
* CloudPage URLs from push notifications
* OpenDirect URLs from push notifications
* Action URLs from in-app messages
To handle URLs from push notifications, you'll need to implement the following for Android and iOS.
#### Android
`java
@Override
public void onCreate() {
super.onCreate();
SFMCSdk.configure((Context) this, SFMCSdkModuleConfig.build(builder -> {
builder.setPushModuleConfig(MarketingCloudConfig.builder()
.setApplicationId("{MC_APP_ID}")
.setAccessToken("{MC_ACCESS_TOKEN}")
.setSenderId("{FCM_SENDER_ID_FOR_MC_APP}")
.setMarketingCloudServerUrl("{MC_APP_SERVER_URL}")
.setNotificationCustomizationOptions(NotificationCustomizationOptions.create(R.drawable.ic_notification))
.setAnalyticsEnabled(true)
// Here we set the URL handler to present URLs from CloudPages, OpenDirect, and In-App Messages
.setUrlHandler((context, s, s1) -> PendingIntent.getActivity(
context,
new Random().nextInt(),
new Intent(Intent.ACTION_VIEW, Uri.parse(s)),
PendingIntent.FLAG_UPDATE_CURRENT
)).build(this));
return null;
}), initializationStatus -> {
Log.e("TAG", "STATUS "+initializationStatus);
if (initializationStatus.getStatus() == 1) {
Log.e("TAG", "STATUS SUCCESS");
}
return null;
});
// The rest of the onCreate method
}
`
#### iOS
`objc
// AppDelegate.h ----
#import
#import
...
// Implement the SFMCSdkURLHandlingDelegate delegate
@interface AppDelegate : RCTAppDelegate
// AppDelegate.mm ----
// This method is called after successfully initializing the SFMCSdk
- (void)pushSetup {
dispatch_async(dispatch_get_main_queue(), ^{
// Here we set the URL Handling delegate to present URLs from CloudPages, OpenDirect, and In-App Messages
[[SFMCSdk mp] setURLHandlingDelegate:self];
// Set UNUserNotificationCenter delegate, register for remote notifications, etc...
});
}
// ...
// Implement the required delegate method to handle URLs
- (void)sfmc_handleURL:(NSURL _Nonnull)url type:(NSString _Nonnull)type {
if ([[UIApplication sharedApplication] canOpenURL:url]) {
[[UIApplication sharedApplication] openURL:url options:@{} completionHandler:^(BOOL success) {
if (success) {
NSLog(@"url %@ opened successfully", url);
} else {
NSLog(@"url %@ could not be opened", url);
}
}];
}
}
`
Please also see additional documentation on URL Handling on https://developer.salesforce.com/docs/marketing/mobilepush/guide/handle-urls-custom-keys.html
Kind: global class
* MCReactModule
* .isPushEnabled() ⇒ Promise.<boolean>
* .enablePush()
* .disablePush()
* .getSystemToken() ⇒ Promise.<?string>
* .getAttributes() ⇒ Promise.<Object.<string, string>>
* .setAttribute(key, value)
* .clearAttribute(key)
* .addTag(tag)
* .removeTag(tag)
* .getTags() ⇒ Promise.<Array.<string>>
* .setContactKey(contactKey)
* .getContactKey() ⇒ Promise.<?string>
* .enableLogging()
* .disableLogging()
* .logSdkState()
* .track(event)
* .getDeviceId() ⇒ Promise.<?string>
* .setAnalyticsEnabled(analyticsEnabled)
* .isAnalyticsEnabled() ⇒ Promise.<boolean>
* .setPiAnalyticsEnabled(analyticsEnabled)
* .isPiAnalyticsEnabled() ⇒ Promise.<boolean>
Kind: static method of MCReactModule
Returns: Promise.<boolean> - A promise to the boolean representation of whether push is
enabled.
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)pushEnabled)
Kind: static method of MCReactModule
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)setPushEnabled:)
Kind: static method of MCReactModule
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)setPushEnabled:)
Kind: static method of MCReactModule
Returns: Promise.<?string> - A promise to the system token string.
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)deviceToken)
Kind: static method of MCReactModule
Returns: Promise.<Object.<string, string>> - A promise to the key/value map of attributes set
in the registration.
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)attributes)
Kind: static method of MCReactModule
See
- Android Docs
- iOS DocsSFMCSdkIDENTITY(im)setProfileAttributes:)
| Param | Type | Description |
| --- | --- | --- |
| key | string | The name of the attribute to be set in the registration. |
| value | string | The value of the key` attribute to be set in the registration. |
Kind: static method of MCReactModule
See
- Android Docs
- iOS DocsSFMCSdkIDENTITY(im)clearProfileAttributeWithKey:)
| Param | Type | Description |
| --- | --- | --- |
| key | string | The name of the attribute whose value should be cleared from the registration. |
MCReactModule - Android Docs
- iOS DocsSFMCSdkPushModule(im)addTag:)
| Param | Type | Description |
| --- | --- | --- |
| tag | string | The tag to be added to the list of tags in the registration. |
MCReactModule - Android Docs
- iOS DocsSFMCSdkPushModule(im)removeTag:)
| Param | Type | Description |
| --- | --- | --- |
| tag | string | The tag to be removed from the list of tags in the registration. |
Kind: static method of MCReactModule
Returns: Promise.<Array.<string>> - A promise to the array of tags currently set in the native SDK.
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)tags)
Kind: static method of MCReactModule
See
- Android Docs
- iOS DocsSFMCSdkIDENTITY(im)setProfileId:)
| Param | Type | Description |
| --- | --- | --- |
| contactKey | string | The value to be set as the contact key of the device's user. |
Kind: static method of MCReactModule
Returns: Promise.<?string> - A promise to the current contact key.
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)contactKey)
Kind: static method of MCReactModule
See
Kind: static method of MCReactModule
See
Kind: static method of MCReactModule
See
- Android Docs
- iOS DocsSFMCSdk(cm)state)
Kind: static method of MCReactModule
See
- Docs
| Param | Type | Description |
| --- | --- | --- |
| event | CustomEvent \| EngagementEvent \| IdentityEvent \| SystemEvent \| CartEvent \| OrderEvent \| CatalogObjectEvent | The event to be tracked. |
Kind: static method of MCReactModule
Returns: Promise.<?string> - A promise to the device Id.
See
- Android Docs
- iOS DocsSFMCSdkPushModule(im)deviceIdentifier)
Kind: static method of MCReactModule
See
- Docs
| Param | Type | Description |
| --- | --- | --- |
| analyticsEnabled | boolean | A flag indicating whether analytics should be enabled. |
Kind: static method of MCReactModule
Returns: Promise.<boolean> - A promise to the boolean representation of whether analytics is enabled.
See
- Docs
Kind: static method of MCReactModule
See
- Docs
| Param | Type | Description |
| --- | --- | --- |
| analyticsEnabled | boolean | A flag indicating whether PI analytics should be enabled. |
Kind: static method of MCReactModule
Returns: Promise.<boolean> - A promise to the boolean representation of whether PI analytics is enabled.
See
- Docs