README

React Native Adobe Experience Platform Messaging Extension

@adobe/react-native-aepmessaging is a wrapper around the iOS and Android Adobe Journey Optimizer Messaging to allow for integration with React Native applications.

Prerequisites

The messaging extension has the following peer dependenices, which must be installed prior to installing the messaging extension:

Installation

See Requirements and Installation instructions on the main page

Install the @adobe/react-native-aepmessaging package:

cd MyReactApp
npm install @adobe/react-native-aepmessaging

Usage

Messaging

Installing and registering the extension with the AEP Mobile Core

Initialization

Initializing the SDK should be done in native code, additional documentation on how to initialize the SDK can be found here.

Example:

iOS

@import AEPCore;
@import AEPLifecycle;
@import AEPEdge;
@import AEPEdgeIdentity;
@import AEPMessaging;
...
@implementation AppDelegate
-(BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  [AEPMobileCore setLogLevel: AEPLogLevelDebug];
  [AEPMobileCore configureWithAppId:@"yourAppID"];
  [AEPMobileCore registerExtensions: @[AEPMobileEdge.class, AEPMobileEdgeIdentity.class, AEPMobileMessaging.class] completion:^{
    [AEPMobileCore lifecycleStart:@{@"contextDataKey": @"contextDataVal"}];
  }
  ];

  return YES;
}

@end

Android

import com.adobe.marketing.mobile.AdobeCallback;
import com.adobe.marketing.mobile.InvalidInitException;
import com.adobe.marketing.mobile.Lifecycle;
import com.adobe.marketing.mobile.LoggingMode;
import com.adobe.marketing.mobile.MobileCore;
import com.adobe.marketing.mobile.Edge;
import com.adobe.marketing.mobile.edge.identity;
import com.adobe.marketing.mobile.Messaging;
  
...
import android.app.Application;
...
public class MainApplication extends Application implements ReactApplication {
  ...
  @Override
  public void on Create(){
    super.onCreate();
    ...
    MobileCore.setApplication(this);
    MobileCore.setLogLevel(LoggingMode.DEBUG);
    try {
      Edge.registerExtension();
      Identity.registerExtension();
      Messaging.registerExtension();
      MobileCore.configureWithAppID("yourAppID");
      MobileCore.start(new AdobeCallback() {
        @Override
        public void call(Object o) {
          MobileCore.lifecycleStart(null);
        }
      });
    } catch (InvalidInitException e) {
      ...
    }
  }
}

Importing the extension:

import {AEPMessaging} from '@adobe/react-native-aepmessaging';

API reference

extensionVersion

Syntax

extensionVersion(): Promise<string>;

Example

Messaging.extensionVersion().then(version => console.log("AdobeExperienceSDK: Messaging version: " + version));

Configure Adobe Journey Optimizer

To configure Adobe Journey optimizer Messaging in Launch follow steps in Configure Adobe Journey optimizer

Push Notification Setup

Handling push notifications must be done in native (Android/iOS) code for the React Native app. To configure push notification in the native project, follow the instructions provided by their respective platforms:

Messaging SDK API usage

Messaging SDK APIs must be called from the native Android/iOS project of React Native app.

iOS API usage

Android API usage

In Android, MessagingPushPayload can be used for getting the notification attributes like title, body, and action. These are useful for push notification creation.

Usage no npm install needed!