Cordova / Ionic + Cordova

Official cordova-plugin-pushtifly plugin on top of @havesource/cordova-plugin-push, or integration via REST.

The official plugin cordova-plugin-pushtifly (Cordova 12+, cordova-android 13+, cordova-ios 7+) builds on @havesource/cordova-plugin-push, which is installed automatically, and adds:

  • device registration, with an offline queue;
  • the iOS environment detected from the provisioning profile;
  • the Android channel;
  • notifications while the app is open on Android, with image and buttons;
  • reported opens and clicks;
  • users, tags and topics.

Tokens:

  • Android: FCM. You need the Firebase credential.
  • iOS: APNs, the usual with cordova-plugin-push. You need the .p8 key in Pushtifly. If you configure the plugin for FCM on iOS, use iOS via FCM.

Installation

cordova plugin add cordova-plugin-pushtifly

In config.xml, the Firebase file for Android:

<platform name="android">
  <resource-file src="google-services.json" target="app/google-services.json" />
</platform>

The Content-Security-Policy in index.html must allow the API: connect-src 'self' https://api.pushtifly.com.

Usage

document.addEventListener('deviceready', async () => {
  await Pushtifly.init({
    appKey: 'pk_live_YOUR_PUBLIC_KEY',           // PUBLIC key only
    androidChannel: { id: 'general', name: 'General notices' },
  });
  Pushtifly.onNotificationOpened((n) => {
    // n.deepLink, n.actionId (tapped button), n.data (your data)
  });
});

// Ask for permission once the user understands what it's for
const state = await Pushtifly.requestPermission();

Pushtifly.identify('customer-123');
Pushtifly.setTags({ plan: 'gold' });
Pushtifly.subscribe('offers');
await Pushtifly.pairTestDevice('483920');   // test device
Pushtifly.logout();

The init options are the same as in Capacitor. For TypeScript, the types are in cordova-plugin-pushtifly/types.

Images and buttons on iOS

  1. In Xcode (platforms/ios): File > New > Target > Notification Service Extension.
  2. Replace its NotificationService.swift with plugins/cordova-plugin-pushtifly/src/ios/NotificationService/NotificationService.swift.
  3. Start the SDK with iosNotificationServiceExtension: true.

On Android a send with a carousel shows as a notification with the first image (no extra steps). On iOS it can be shown in full:

The carousel needs, besides the Service Extension, a Notification Content Extension:

  1. In Xcode: File > New > Target > Notification Content Extension.
  2. Replace its NotificationViewController.swift and Info.plist with the package's: plugins/cordova-plugin-pushtifly/src/ios/NotificationContent/. Delete the generated MainInterface.storyboard.
  3. Also use the updated Service Extension template (plugins/cordova-plugin-pushtifly/src/ios/NotificationService/): it downloads all the images.
  4. Start the SDK with iosNotificationServiceExtension: true and iosNotificationContentExtension: true.

On long press the carousel appears; the View button opens the app with the visible image's link.

Without the SDK (REST)

With any push plugin, register the token yourself:

fetch('https://api.pushtifly.com/v1/devices', {
  method: 'POST',
  headers: { Authorization: 'Bearer pk_live_YOUR_PUBLIC_KEY', 'Content-Type': 'application/json' },
  body: JSON.stringify({ token, platform: cordova.platformId, framework: 'cordova', environment: 'auto' }),
});

The send's id arrives in _phid and the link in deepLink. Report it to /v1/events on open.