Push Notifications - OneSignal
Last updated
Was this helpful?
Last updated
Was this helpful?
We are using OneSignal Service to provide a Push Notification functionality.
On initialization, the element will try to get OneSignal Player Id and the current notification permission status. (No need to call it on the Page Is Load event)
OneSignal Player Id updated - get called when OneSignal Player Id was updated.
Notification permissions authorized - get called when the user clicks Allow on permission alert.
Notification permissions denied - get called when the user clicks Decline on permission alert.
Notification permissions status updated - get called when permission status was updated because of the user's action.
Permission Status - Yes or No.
OneSignal PlayerId - OneSignal Player Id's text value.
Request the user's push notification permission - displays a systems popup with your Notification Permissions Text
Open Settings - If yes and user's previously denied notification permission. A native alert will be shown with the option to open the app settings and turn on permission.
Get the user's OneSignal PlayerId - Reload the user's OneSignal PlayerId
Get the user's push notification permission status
Actions:
OneSignal - PlayerIds - Send Push - Add a field to User's object to store Player Id
OneSignal - Segments - Send Push - Use this if you need OneSignal Segments
All parameters in these actions are pretty the same. The difference is only in the Data Source section.
Title
Subtitle [iOS]
Message
Redirect Url - The url that will be opened if user's click on push (Optional)
or
Template ID - Check out OneSignal template documentation for more details
Data Source:
OneSignal - PlayerIds - Send Push action
List Type
List
Player ID field
OneSignal - Segments - Send Push action
Included - provide here a list of segments (separated by comma) that needs to be included in your push sending action
Excluded - provide here a list of segments (separated by comma) that needs to be excluded from your push sending action
The value should be like this: Active Users, Inactive Users
Android Channel Id - you need to paste your one signal channel id
iOS Sound - set "natively.wav" if you wanna to use custom sound
Request Push Notification permission whenever you need it.
The OneSignal status is updated during app initialization. As a result, any changes to the permission status will take effect on the second app launch, after the user has granted or denied permission.
Save PlayerID to your user model
Send Push Notification to PlayerID you need (Backend workflow is recommended)
Send Push examples:
const notifications = new NativelyNotifications()
const onesignal_playerid_callback = function (resp) {
console.log(resp.playerId); // a301a5b5-ac6e-4d55-9eb3-ff6d19784ae0
};
const push_register_callback = function (resp) {
console.log(resp.status); // true/false
};
const push_permission_callback = (instance) => (resp) => {
console.log(resp.status); // true/false
};
const fallbacktosettings = false; // Show alert if permission is denied
notifications.getOneSignalId(onesignal_playerid_callback);
notifications.getPermissionStatus(push_permission_callback);
notifications.requestPermission(fallbacktosettings, push_register_callback);
How to set up?
Make sure you've prepared your app and OneSignal for Push Notifications.
call requestPermissionIOS (required for both iOS & Android).
call getOneSignalId (will return PlayerId).
Save PlayerId somewhere (for example, save it in the user's playerId property).
There are 2 options:
Send it with Natively SDK from your website (Which might be useful if running the app in a Preview Mode):
const payload = {
redirect_url: "https://example.com/" // A URL where the user will be redirected after clicking the notification banner.
/// ------
title: "Title Text",
subtitle: "Subtitle Text", // Works only for iOS
description: "Description Text",
// title, subtitle, description or template_id
template_id: "{YOUR TEMPLATE ID HERE}",
/// ----
}
const appId = "123...123" // Your OneSignal app id
const isPreview = false // set it to true if you're testing the website in Natively Preview (It will replace appId with appId of Natively Preview app).
const player_ids = ["a301a5b5-aa6e-4a55-9aa3-aa6d19784ae0"] // Array of playerIds where you're sending push notification
const resp = await window.natively.sendPushNotification(appId, payload, player_ids, isPreview)
2. Other options provided by OneSignal (NodeJS SDK, WebAPI, etc.)
More information about OneSignal you can read in their documentation.
Natively sendPushNotification method doesn't support custom notification sound. Please use OneSignal API directly for it. Use android_channel_id and (ios_sound with "natively.wav" value)
Go to OneSignal App -> Settings -> Messaging
Scroll down to Android Notification Channels ->Click "Add Channel"
Scroll Down to "Sound" -> Add "natively" + Set Importance to Urgent or High
Copy Channel ID
Paste where you use it (Plugin or OneSignal API) + IMPORTANT: reinstall your Android app
Request the user's notification permission. You can do that in any necessary place. For example: show a popup that explains to the user's why your app needs it (so, it can be a better experience when just displaying a system popup)
Identify a user. By using player id.
Check a player_id value on each login (It can be changed)