Callbacks
Callbacks are useful for understanding the lifecycle stages of WebEngage messages. All WebEngage callbacks are called on the main thread. All callbacks must be registered as soon as the App launches before the Webengage.engage()
call.
Push message Callbacks
Push Notification Clicked
WebengagePush.onClick
allows you to register a callback function which is executed when the user taps on a received push notification.
The callback handler receives two parameters:
deeplink
: The deep link URLString
associated with the push messagecustomData
: Custom dataObject
passed from the dashboard
useEffect(() => {
WebengagePush.onClick(function(deeplink, customData) {
console.log("Push clicked");
});
...
...
Webengage.engage();
}, []);
If this callback is registered in iOS, the deep link will not be opened automatically. Your app is supposed to handle it. For Android, the deep link is fired irrespective.
In-App Notification Callbacks
In-App Notification Prepared
This callback gets triggered before the in-app message is shown to your users. It allows you to customize the UI, colors, CTAs (buttons) and content of the In-app message received from WebEngage before displaying it to your users.
The callback handler receives one parameter:
inAppData
: The data Object
for the prepared in-app notification.
useEffect(() => {
WebengageNotification.onPrepared(function(inAppData) {
console.log("InApp Prepared Callback Received, Data: " + JSON.stringify(inAppData));
});
...
...
Webengage.engage();
}, []);
In-App Notification Shown
WebengageNotification.onShown
allows you to register a callback function which is executed after an in-app notification is shown to the user.
The callback handler receives one parameter:
inAppData
: The dataObject
for the shown in-app notification
useEffect(() => {
WebengageNotification.onShown(function(inAppData) {
console.log("In-app shown");
});
...
...
Webengage.engage();
}, []);
In-App Notification Dismissed
WebengageNotification.onDismiss
allows you to register a callback function which is executed after an in-app notification is closed by the user.
The callback handler receives one parameter:
inAppData
: The dataObject
for the shown in-app notification
useEffect(() => {
WebengageNotification.onDismiss(function(inAppData) {
console.log("In-app dismissed");
});
...
...
Webengage.engage();
}, []);
In-App Notification Clicked
WebengageNotification.onClick
allows you to register a callback function which is executed after an in-app notification is clicked by the user.
The callback handler receives two parameters:
inAppData
: The dataObject
for the shown in-app notificationactionId
: TheString
identifier for the action button
useEffect(() => {
WebengageNotification.onClick(function(inAppData, actionId) {
console.log(“In-app clicked”);
});
...
...
Webengage.engage();
}, []);
Data received from in-app callbacks adheres to the below format.
{
"description": null,
"id": "173050749",
"actions": [
{
"actionEId": "~3284c402",
"actionText": "Hello",
"actionLink": "http://www.google.com",
"actionCategory": "CTA",
"actionTarget": "_top",
"isPrime": true,
"type": "EXTERNAL_URL"
}
],
"layoutId": "~483819e",
"showTitle": true,
"canMinimize": true,
"layoutAttributes": {
"exitAnimation": "FADE_OUT",
"fullscreen": true,
"wvHeight": 100,
"image_url": "https://s3-ap-southeast-1.amazonaws.com/wk-static-files/~2024c585/6035287f-62e3-4c6b-8d56-e893941da6bf.png",
"posX": 0,
"animDuration": 1000,
"type": "BLOCKING",
"posY": 0,
"wvWidth": 100,
"entryAnimation": "FADE_IN"
},
"title": null,
"config": {
"closeIconColor": "#FFFFFF",
"hideLogo": false,
"c2aTextColor": "#FFFFFF",
"c2aTextFont": "Sans-Serif",
"c2aBackgroundColor": "#4A90E2"
},
"canClose": true,
"notificationEncId": "13cjj4m",
"direction": "ltr",
"isActive": true
}
Updated 25 days ago