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
- In Xcode (
platforms/ios): File > New > Target > Notification Service Extension. - Replace its
NotificationService.swiftwithplugins/cordova-plugin-pushtifly/src/ios/NotificationService/NotificationService.swift. - Start the SDK with
iosNotificationServiceExtension: true.
Image carousel
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:
- In Xcode: File > New > Target > Notification Content Extension.
- Replace its
NotificationViewController.swiftandInfo.plistwith the package's:plugins/cordova-plugin-pushtifly/src/ios/NotificationContent/. Delete the generatedMainInterface.storyboard. - Also use the updated Service Extension template (
plugins/cordova-plugin-pushtifly/src/ios/NotificationService/): it downloads all the images. - Start the SDK with
iosNotificationServiceExtension: trueandiosNotificationContentExtension: 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.