1

Does anyone know if it is possible to send mobile push notifications from Marketing Cloud 'MobilePush' to a hybrid mobile app (built using the Ionic framework)?

All the developer documentation I have found within Marketing Cloud is for Android and IOS 'native' applications. I am looking instead for a JavaScript solution.

Any help is much appreciated.

Thanks a lot

1 Answer 1

0

Many customers have successfully implemented the MarketingCloudSdk with their framework-based applications though it is not officially supported.

UPDATED 20230530 with 'hints' to get this to work:

Ionic SFMC Cordova Plugin integration

tldr;

Ionic works with SFMC Cordova plugin without any changes to our artifact, but we need to update our documentation to help Ionic customers know what the pain points are and how to resolve them.

Findings

  1. We can install market Cordova plugin within a ionic App (mainly capacitor based).
  2. ionic capacitor require changes capacitor.config.ts and most of our SDK config is in config.xml for Cordova.
  3. Our category AppDelegate+MCCordovaPlugin is not working in ionic.

Resolution

  1. The customer needs to edit capacitor.config.ts of their ionic project with the SFMC config settings in this file.
  2. The customer needs to implement the AppDelegate delegate methods.

Note: I have verified with a simple push and its working fine with ionic app and with our Cordova plugin.


Required Changes for Ionic to Work

1. Add plugin to your application via npm

`// Changed for capacitor`
`npm i cordova``-``plugin``-``marketingcloudsdk
``ionic build 
ionic capacitor copy ios`

Required for iOS

You must have Cocoapods installed for the iOS platform integration. Execute the following commands from terminal to install:

sudo gem install cocoapods
pod repo update

2. Modify your application's capacitor.config.ts to configure the plugin

const config: CapacitorConfig = {
  appId: 'io.ionic.starter', //Your app id
  appName: 'ionicapp',  //Your app name
  webDir: 'build',
  bundledWebRuntime: false,
  cordova: {
    preferences: { //Salesforce Marketing Cloud Config
      "com.salesforce.marketingcloud.app_id":"{Marketing Cloud application id}",
      "com.salesforce.marketingcloud.access_token":"{Marketing Cloud access token}",
      "com.salesforce.marketingcloud.tenant_specific_endpoint":"{URL retrieved from Marketing Cloud adminstration page}",
      "com.salesforce.marketingcloud.analytics": "{true|false}",
      "com.salesforce.marketingcloud.delay_registration_until_contact_key_is_set": "{true|false}"        
    },
  }
};

3. Enable iOS Push

Add the following code in App Delegate

import UserNotifications
import MarketingCloudSDK

class AppDelegate: UIResponder, UIApplicationDelegate, UNUserNotificationCenterDelegate {

  // Other customer code as needed

  func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    UNUserNotificationCenter.current().delegate = self
    return true
  }
    
  // MobilePush SDK: REQUIRED IMPLEMENTATION
    func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
    MarketingCloudSDK.sharedInstance().sfmc_setDeviceToken(deviceToken)
  }
        
  // MobilePush SDK: REQUIRED IMPLEMENTATION
  func application(_ application: UIApplication, didFailToRegisterForRemoteNotificationsWithError error: Error) {
    print(error)
  }
    
  // MobilePush SDK: REQUIRED IMPLEMENTATION
  func application(_ application: UIApplication, didReceiveRemoteNotification userInfo: [AnyHashable : Any], fetchCompletionHandler completionHandler: @escaping (UIBackgroundFetchResult) -> Void) {
    MarketingCloudSDK.sharedInstance().sfmc_setNotificationUserInfo(userInfo)
    completionHandler(.newData)
  }
    
  // MobilePush SDK: REQUIRED IMPLEMENTATION
  @available(iOS 10.0, *)
  func userNotificationCenter(_ center: UNUserNotificationCenter, didReceive response: UNNotificationResponse, withCompletionHandler completionHandler: @escaping () -> Void) {
    MarketingCloudSDK.sharedInstance().sfmc_setNotificationRequest(response.notification.request)
    completionHandler()
  }

  // MobilePush SDK: REQUIRED IMPLEMENTATION
  @available(iOS 10.0, *)
  func userNotificationCenter(_ center: UNUserNotificationCenter, willPresent notification: UNNotification, withCompletionHandler completionHandler: @escaping (UNNotificationPresentationOptions) -> Void) {
    completionHandler(.alert)
  }
}

Edit: updated the configuration to fix an issue with delay_registration_until_contact_key_is_set

3
  • I appreciate your swift reply. Do you know of any code examples? Without documentation or guidance, it's very hard to achieve.
    – Phil Allen
    Jul 6, 2017 at 16:04
  • I have no access to customer implementations. I would open a ticket with your Salesforce Account Representative. They can put you in touch with a solutions/success engineer.
    – Bill Mote
    Jul 6, 2017 at 16:29
  • @PhilAllen have you solved this issue before? appreciate if you can send documentation on how to connect mobile push to Ionic app platform. thanks! May 17, 2023 at 9:14

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .