Complete API reference for OneSignal Web SDK v16 with initialization, user management, push notifications, slidedown prompts, and debugging methods. Learn how to implement web push notifications, manage user subscriptions, and integrate email/SMS features.
You may notice the need to wrap your OneSignal calls with OneSignalDeferred.push(async function() { ... })
You can add as many methods into the function()
as desired.
The OneSignal SDK is loaded with the defer
attribute on your page. For example:
<script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
This means the OneSignal code will execute after the HTML document has been fully parsed, preventing any blocking of the site by the OneSignal SDK. However, this presents a problem for page scripts that depend on the OneSignalDeferred
variable existing. To resolve this, when you add OneSignal to your site, it should begin with:
window.OneSignalDeferred = window.OneSignalDeferred || [];
This creates a OneSignalDeferred
variable, and if OneSignal is already loaded, it’s then assigned to the loaded instance. Otherwise, the OneSignal variable equals an empty array - []
.
All arrays have a .push() function
, so at this point, the OneSignalDeferred
variable is simply an array of functions we’re pushing on to it. When the SDK finally loads, the SDK processes all the functions pushed so far and redefines .push().
init()
Initializes the OneSignal SDK. This should be called in the <head>
tag once on each page of your site. The ONESIGNAL_APP_ID
can be found in Keys & IDs.
If you want to delay initialization of the OneSignal SDK, we recommend using our Privacy methods.
Init options only work with Custom Code Setup. Otherwise, these are configured in the OneSignal dashboard.
Parameter | Type | Description |
---|---|---|
appId | String | Required: Your OneSignal App ID found in Keys & IDs. |
requiresUserPrivacyConsent | Boolean | Delays SDK initialization until the user provides privacy consent. Must call setConsentGiven() to complete setup. |
safari_web_id | String | The Safari Web ID for your uploaded Safari .p12 certificate. Web Quickstart. |
promptOptions | Object | Customize the permission prompts. Details below. |
notifyButton | Object | Enable and configure the Subscription Bell. Details below. |
welcomeNotification | Object | Customize or disable the welcome notification. Details below. |
persistNotification | Boolean | Chrome (desktop only) - true : notification persists until clicked, false : disappears after a short time. Firefox/Safari ignore this setting. |
webhooks | Object | Configure event callbacks. See Webhooks. |
autoResubscribe | Boolean | Recommended: Auto-resubscribes users who clear browser cache or migrate to OneSignal. Overrides dashboard setting if used in code. |
notificationClickHandlerMatch | String | "exact" (default): focuses tab with an exact URL match. "origin" : focuses any tab with the same domain. |
notificationClickHandlerAction | String | "navigate" (default): navigates to launchURL . "focus" : focuses existing tab (only used with "origin" match). |
serviceWorkerParam | Object | Set the scope of the service worker. Must be different from other service worker’s scope if applicable. Example:{ scope: "/myPath/myCustomScope/" } |
serviceWorkerPath | String | Set the location of the OneSignal service worker file. Example:"myPath/OneSignalSDKWorker.js" |
promptOptions
parametersUse promptOptions
to localize or customize the user permission prompts. All fields are optional.
Parameter | Type | Description |
---|---|---|
slidedown | Object | Contains an array of prompts with configuration options. |
prompts | Array of Objects | An array of prompt configurations. Example:"slidedown": { "prompts": [{...}, {...}] } |
type | String | Prompt types:
|
autoPrompt | Boolean |
|
delay | Object | Controls when auto-prompt is shown:{ pageViews: 3, timeDelay: 20 } = Show after 3rd pageview and 20s wait. |
text | Object | Custom text options:
|
categories | Array of Objects | Only for type: category . Each object includes:tag : internal keylabel : user-visible nameExample: [ {tag: "local_news", label: "Local News"} ] . See Data Tags. |
notifyButton
parametersConfigure the Subscription Bell (notify button) shown on the page.
Parameter | Type | Description |
---|---|---|
enable | Boolean | Enables the Subscription Bell. Disabled by default. |
displayPredicate | Function | Custom function (or Promise) that returns true or false to show/hide the Bell. Evaluated once when shown. |
size | String | 'small' , 'medium' , or 'large' . Shrinks to 'small' after subscription. |
position | String | 'bottom-left' or 'bottom-right' . |
offset | Object | CSS pixel offsets: { bottom: '50px', left: '10px' } |
prenotify | Boolean | If true , shows a “1 unread” icon and custom hover text. |
showCredit | Boolean | Set to false to hide “Powered by OneSignal” in the popup. |
text | Object | Custom text for the bell UI. |
welcomeNotification
parametersCustomize the welcome notification sent after first-time subscription.
Parameter | Type | Description |
---|---|---|
disable | Boolean | Disable welcome notification. |
message | String | Required: Notification message. Defaults to 'Thanks for subscribing!' if blank. |
title | String | Notification title. Defaults to site title. Use ' ' (space) to remove (not recommended). |
url | URL | Optional URL to open when the user clicks the notification. Typically not needed. |
Example:
setLogLevel()
Set the logging to print additional logs to the console. See Debugging with Browser DevTools for more details.
Log levels:
'trace'
'debug'
'info'
'warn'
'error'
When your users subscribe to push notifications on your website, OneSignal automatically creates a OneSignal ID (user-level) and a Subscription ID (device-level). You can associate multiple subscriptions (e.g., devices, emails, phone numbers) with a single user by calling login()
with your unique user identifier.
login(external_id)
Sets the user context to the provided external_id
. Ensures that all Subscriptions and properties associated with this external_id
are unified under a single onesignal_id
. See Users for more details.
Key behaviors:
external_id
already exists, the SDK switches to that user. Anonymous data collected before login is not merged and will be discarded.external_id
does not exist, the local state will be saved under the current onesignal_id
. Any data collected while the user was anonymous will be kept.login
every time the app identifies a user. logout()
Unlinks the current user from the subscription.
external_id
from the current push subscription.login
method.OneSignal.User.onesignalId
Retrieve the current OneSignal ID. May be null
if called before user state is initialized. Instead, use User State addObserver()
to listen for user state changes.
OneSignal.User.externalId
Retrieve the current External ID. May be null
if not set or called before user state is initialized. Instead, use User State addObserver()
to listen for user state changes.
addEventListener()
User StateListen for changes in the user context (e.g., login, logout, ID assignment).
addAlias()
, addAliases()
, removeAlias()
, removeAliases()
Aliases are alternative identifiers (like usernames or CRM IDs).
external_id
with login()
before adding aliases. Aliases added to subscriptions without external_id
will not sync across multiple subscriptions.getLanguage()
, setLanguage()
Get and/or override the auto-detected language of the user. See Multi-language messaging for a list of available language codes.
Tags are custom key : value
pairs of string data you set on users based on events or user properties. See Data Tags for more details.
addTag()
, addTags()
Set a single or multiple tags on the current user.
removeTag()
, removeTags()
Delete a single or multiple tags from the current user.
getTags()
Returns the local copy of the user’s tags. Tags are updated from the server during login()
or new app sessions.
setConsentRequired()
Enforces user consent before data collection begins. Must be called before initializing the SDK.
This method is the same as adding the requiresUserPrivacyConsent: true
to the init
method.
setConsentGiven()
Grants or revokes user consent for data collection. Without consent, no data is sent to OneSignal and no subscription is created.
setConsentRequired()
or requiresUserPrivacyConsent
is set to true
, our SDK will not be fully enabled until setConsentGiven
is called with true
.setConsentGiven
is set to true
and a Subscription is created, then later it is set to false
, that Subscription will no longer receive updates. The current data for that Subscription remains unchanged until setConsentGiven
is set to true
again.See Subscriptions for more details.
User.PushSubscription.id
Returns the current push subscription ID. May return null
if called too early. Its recommended to get this data within the subscription observer to react to changes.
User.PushSubscription.token
Returns the current push subscription token. May return null
if called too early. Its recommended to get this data within the subscription observer to react to changes.
addEventListener()
push subscription changesUse this method to respond to push subscription changes like:
optedIn
value changes (e.g. called optIn()
or optOut()
)When this happens, the SDK triggers the onPushSubscriptionChange
event. Your listener receives a state object with the previous
and current
values so you can detect exactly what changed.
To stop listening for updates, call the associated removeObserver()
or removeEventListener()
method.
optOut()
, optIn()
, optedIn
Control the subscription status (subscribed
or unsubscribed
) of the current push Subscription. Use these methods to control the push subscription status on your site. Common use cases: 1) Prevent push from being sent to users that log out. 2) Implement a notification preference center within your site.
optOut()
: Sets the current push subscription status to unsubscribed (even if the user has a valid push token).optIn()
: Does one of three actions:
subscribed
.optedIn
: Returns true
if the current push subscription status is subscribed, otherwise false
. If the push token is valid but optOut()
was called, this will return false
.addEmail()
, removeEmail()
Adds or removes an email Subscription (email address) to/from the current user. Call addEmail
after login()
to set the correct user context. Compatible with Identity Verification.
addSms()
, removeSms()
Adds or removes an SMS Subscription (phone number) to/from the current user. Requires E.164 format. Call addSms
after login()
to set the correct user context. Compatible with Identity Verification.
Display the various slidedown prompts on your sites. See Web permission prompts for more details.
{force: true}
to the method. However, to provide a good user experience, bind the action to a UI-initiated event like a button click.This does not replace the Native Browser Prompt required for subscription. You must obtain permissions using the native browser prompt.
promptPush()
Displays the regular slidedown prompt for push notifications.
promptPushCategories()
Displays the category slidedown prompt, allowing users to update their tags. Also triggers the native notification permission prompt if the user has not already granted permission.
promptSms()
Displays the SMS subscription prompt.
promptEmail()
Displays the email subscription prompt.
promptSmsAndEmail()
Displays the SMS and email subscription prompts simultaneously.
addEventListener()
SlidedownAdd a callback to detect the Slidedown prompt shown event.
requestPermission()
Requests push notifications permission via the native browser prompt.
isPushSupported()
Returns true
if the current browser supports web push.
OneSignal.Notifications.permission
Returns true
when your site has permission to display notifications.
This is just the sites’s permission, does not factor in OneSignal’s optOut
status or the existence of the Subscription ID and Push Token, see OneSignal.User.PushSubscription
for these.
addEventListener()
notificationsYou can hook into the notification life-cycle by attaching your event handlers to a notification event. Calling addEventListener
lets you add an arbitrary number of event handlers for notification events.
To stop listening for events, call the associated removeEventListener()
method.
permissionChange
This event occurs when the user clicks Allow or Block or dismisses the browser’s native permission request.
permissionPromptDisplay
This event occurs when the browser’s native permission request has just been shown.
click
This event will fire when the notification’s body/title or action buttons are clicked.
foregroundWillDisplay
This event occurs before a notification is displayed. This event is fired on your page. If multiple browser tabs are open on your site, this event will be fired on all pages on which OneSignal is active.
dismiss
This event occurs when:
This event does not occur if a user clicks on the notification body or one of the action buttons. That is considered a notification click
event.
setDefaultUrl()
Sets the default URL for notifications.
If you haven’t set a default URL, your notification will open to the root of your site by default.
To set the default URL for notifications, provide a valid URL that you want to be launched when the notification is clicked. This default URL will be used if no other URL is specified when creating a notification. If you do specify a URL when creating a notification, the default URL will be overridden.
In the case of Safari, the default notification icon URL will be set to the Site URL that you have specified in your Safari settings, as this function is not available.
setDefaultTitle()
Sets the default title to display on notifications.
If a notification is created with a title, the specified title always overrides this default title.
A notification’s title defaults to the title of the page the user last visited. If your page titles vary between pages, this inconsistency can be undesirable. Call this to standardize page titles across notifications, as long as a notification title isn’t specified.
sendOutcome()
Triggers an outcome which can be viewed in the OneSignal dashboard. Accepts an outcome name (string
, required) and a value (number
, optional). Each time sendOutcome
method is invoked with the same outcome name passed, the outcome count will increase, and the outcome value will be increased by the amount passed in (if included). See Custom Outcomes for more details.
sendUniqueOutcome()
Triggers an outcome which can be viewed in the OneSignal dashboard. Accepts only the outcome name (string
, required). sendUniqueOutcome
will increase the count for that outcome only once per user. See Custom Outcomes for more details.
Complete API reference for OneSignal Web SDK v16 with initialization, user management, push notifications, slidedown prompts, and debugging methods. Learn how to implement web push notifications, manage user subscriptions, and integrate email/SMS features.
You may notice the need to wrap your OneSignal calls with OneSignalDeferred.push(async function() { ... })
You can add as many methods into the function()
as desired.
The OneSignal SDK is loaded with the defer
attribute on your page. For example:
<script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
This means the OneSignal code will execute after the HTML document has been fully parsed, preventing any blocking of the site by the OneSignal SDK. However, this presents a problem for page scripts that depend on the OneSignalDeferred
variable existing. To resolve this, when you add OneSignal to your site, it should begin with:
window.OneSignalDeferred = window.OneSignalDeferred || [];
This creates a OneSignalDeferred
variable, and if OneSignal is already loaded, it’s then assigned to the loaded instance. Otherwise, the OneSignal variable equals an empty array - []
.
All arrays have a .push() function
, so at this point, the OneSignalDeferred
variable is simply an array of functions we’re pushing on to it. When the SDK finally loads, the SDK processes all the functions pushed so far and redefines .push().
init()
Initializes the OneSignal SDK. This should be called in the <head>
tag once on each page of your site. The ONESIGNAL_APP_ID
can be found in Keys & IDs.
If you want to delay initialization of the OneSignal SDK, we recommend using our Privacy methods.
Init options only work with Custom Code Setup. Otherwise, these are configured in the OneSignal dashboard.
Parameter | Type | Description |
---|---|---|
appId | String | Required: Your OneSignal App ID found in Keys & IDs. |
requiresUserPrivacyConsent | Boolean | Delays SDK initialization until the user provides privacy consent. Must call setConsentGiven() to complete setup. |
safari_web_id | String | The Safari Web ID for your uploaded Safari .p12 certificate. Web Quickstart. |
promptOptions | Object | Customize the permission prompts. Details below. |
notifyButton | Object | Enable and configure the Subscription Bell. Details below. |
welcomeNotification | Object | Customize or disable the welcome notification. Details below. |
persistNotification | Boolean | Chrome (desktop only) - true : notification persists until clicked, false : disappears after a short time. Firefox/Safari ignore this setting. |
webhooks | Object | Configure event callbacks. See Webhooks. |
autoResubscribe | Boolean | Recommended: Auto-resubscribes users who clear browser cache or migrate to OneSignal. Overrides dashboard setting if used in code. |
notificationClickHandlerMatch | String | "exact" (default): focuses tab with an exact URL match. "origin" : focuses any tab with the same domain. |
notificationClickHandlerAction | String | "navigate" (default): navigates to launchURL . "focus" : focuses existing tab (only used with "origin" match). |
serviceWorkerParam | Object | Set the scope of the service worker. Must be different from other service worker’s scope if applicable. Example:{ scope: "/myPath/myCustomScope/" } |
serviceWorkerPath | String | Set the location of the OneSignal service worker file. Example:"myPath/OneSignalSDKWorker.js" |
promptOptions
parametersUse promptOptions
to localize or customize the user permission prompts. All fields are optional.
Parameter | Type | Description |
---|---|---|
slidedown | Object | Contains an array of prompts with configuration options. |
prompts | Array of Objects | An array of prompt configurations. Example:"slidedown": { "prompts": [{...}, {...}] } |
type | String | Prompt types:
|
autoPrompt | Boolean |
|
delay | Object | Controls when auto-prompt is shown:{ pageViews: 3, timeDelay: 20 } = Show after 3rd pageview and 20s wait. |
text | Object | Custom text options:
|
categories | Array of Objects | Only for type: category . Each object includes:tag : internal keylabel : user-visible nameExample: [ {tag: "local_news", label: "Local News"} ] . See Data Tags. |
notifyButton
parametersConfigure the Subscription Bell (notify button) shown on the page.
Parameter | Type | Description |
---|---|---|
enable | Boolean | Enables the Subscription Bell. Disabled by default. |
displayPredicate | Function | Custom function (or Promise) that returns true or false to show/hide the Bell. Evaluated once when shown. |
size | String | 'small' , 'medium' , or 'large' . Shrinks to 'small' after subscription. |
position | String | 'bottom-left' or 'bottom-right' . |
offset | Object | CSS pixel offsets: { bottom: '50px', left: '10px' } |
prenotify | Boolean | If true , shows a “1 unread” icon and custom hover text. |
showCredit | Boolean | Set to false to hide “Powered by OneSignal” in the popup. |
text | Object | Custom text for the bell UI. |
welcomeNotification
parametersCustomize the welcome notification sent after first-time subscription.
Parameter | Type | Description |
---|---|---|
disable | Boolean | Disable welcome notification. |
message | String | Required: Notification message. Defaults to 'Thanks for subscribing!' if blank. |
title | String | Notification title. Defaults to site title. Use ' ' (space) to remove (not recommended). |
url | URL | Optional URL to open when the user clicks the notification. Typically not needed. |
Example:
setLogLevel()
Set the logging to print additional logs to the console. See Debugging with Browser DevTools for more details.
Log levels:
'trace'
'debug'
'info'
'warn'
'error'
When your users subscribe to push notifications on your website, OneSignal automatically creates a OneSignal ID (user-level) and a Subscription ID (device-level). You can associate multiple subscriptions (e.g., devices, emails, phone numbers) with a single user by calling login()
with your unique user identifier.
login(external_id)
Sets the user context to the provided external_id
. Ensures that all Subscriptions and properties associated with this external_id
are unified under a single onesignal_id
. See Users for more details.
Key behaviors:
external_id
already exists, the SDK switches to that user. Anonymous data collected before login is not merged and will be discarded.external_id
does not exist, the local state will be saved under the current onesignal_id
. Any data collected while the user was anonymous will be kept.login
every time the app identifies a user. logout()
Unlinks the current user from the subscription.
external_id
from the current push subscription.login
method.OneSignal.User.onesignalId
Retrieve the current OneSignal ID. May be null
if called before user state is initialized. Instead, use User State addObserver()
to listen for user state changes.
OneSignal.User.externalId
Retrieve the current External ID. May be null
if not set or called before user state is initialized. Instead, use User State addObserver()
to listen for user state changes.
addEventListener()
User StateListen for changes in the user context (e.g., login, logout, ID assignment).
addAlias()
, addAliases()
, removeAlias()
, removeAliases()
Aliases are alternative identifiers (like usernames or CRM IDs).
external_id
with login()
before adding aliases. Aliases added to subscriptions without external_id
will not sync across multiple subscriptions.getLanguage()
, setLanguage()
Get and/or override the auto-detected language of the user. See Multi-language messaging for a list of available language codes.
Tags are custom key : value
pairs of string data you set on users based on events or user properties. See Data Tags for more details.
addTag()
, addTags()
Set a single or multiple tags on the current user.
removeTag()
, removeTags()
Delete a single or multiple tags from the current user.
getTags()
Returns the local copy of the user’s tags. Tags are updated from the server during login()
or new app sessions.
setConsentRequired()
Enforces user consent before data collection begins. Must be called before initializing the SDK.
This method is the same as adding the requiresUserPrivacyConsent: true
to the init
method.
setConsentGiven()
Grants or revokes user consent for data collection. Without consent, no data is sent to OneSignal and no subscription is created.
setConsentRequired()
or requiresUserPrivacyConsent
is set to true
, our SDK will not be fully enabled until setConsentGiven
is called with true
.setConsentGiven
is set to true
and a Subscription is created, then later it is set to false
, that Subscription will no longer receive updates. The current data for that Subscription remains unchanged until setConsentGiven
is set to true
again.See Subscriptions for more details.
User.PushSubscription.id
Returns the current push subscription ID. May return null
if called too early. Its recommended to get this data within the subscription observer to react to changes.
User.PushSubscription.token
Returns the current push subscription token. May return null
if called too early. Its recommended to get this data within the subscription observer to react to changes.
addEventListener()
push subscription changesUse this method to respond to push subscription changes like:
optedIn
value changes (e.g. called optIn()
or optOut()
)When this happens, the SDK triggers the onPushSubscriptionChange
event. Your listener receives a state object with the previous
and current
values so you can detect exactly what changed.
To stop listening for updates, call the associated removeObserver()
or removeEventListener()
method.
optOut()
, optIn()
, optedIn
Control the subscription status (subscribed
or unsubscribed
) of the current push Subscription. Use these methods to control the push subscription status on your site. Common use cases: 1) Prevent push from being sent to users that log out. 2) Implement a notification preference center within your site.
optOut()
: Sets the current push subscription status to unsubscribed (even if the user has a valid push token).optIn()
: Does one of three actions:
subscribed
.optedIn
: Returns true
if the current push subscription status is subscribed, otherwise false
. If the push token is valid but optOut()
was called, this will return false
.addEmail()
, removeEmail()
Adds or removes an email Subscription (email address) to/from the current user. Call addEmail
after login()
to set the correct user context. Compatible with Identity Verification.
addSms()
, removeSms()
Adds or removes an SMS Subscription (phone number) to/from the current user. Requires E.164 format. Call addSms
after login()
to set the correct user context. Compatible with Identity Verification.
Display the various slidedown prompts on your sites. See Web permission prompts for more details.
{force: true}
to the method. However, to provide a good user experience, bind the action to a UI-initiated event like a button click.This does not replace the Native Browser Prompt required for subscription. You must obtain permissions using the native browser prompt.
promptPush()
Displays the regular slidedown prompt for push notifications.
promptPushCategories()
Displays the category slidedown prompt, allowing users to update their tags. Also triggers the native notification permission prompt if the user has not already granted permission.
promptSms()
Displays the SMS subscription prompt.
promptEmail()
Displays the email subscription prompt.
promptSmsAndEmail()
Displays the SMS and email subscription prompts simultaneously.
addEventListener()
SlidedownAdd a callback to detect the Slidedown prompt shown event.
requestPermission()
Requests push notifications permission via the native browser prompt.
isPushSupported()
Returns true
if the current browser supports web push.
OneSignal.Notifications.permission
Returns true
when your site has permission to display notifications.
This is just the sites’s permission, does not factor in OneSignal’s optOut
status or the existence of the Subscription ID and Push Token, see OneSignal.User.PushSubscription
for these.
addEventListener()
notificationsYou can hook into the notification life-cycle by attaching your event handlers to a notification event. Calling addEventListener
lets you add an arbitrary number of event handlers for notification events.
To stop listening for events, call the associated removeEventListener()
method.
permissionChange
This event occurs when the user clicks Allow or Block or dismisses the browser’s native permission request.
permissionPromptDisplay
This event occurs when the browser’s native permission request has just been shown.
click
This event will fire when the notification’s body/title or action buttons are clicked.
foregroundWillDisplay
This event occurs before a notification is displayed. This event is fired on your page. If multiple browser tabs are open on your site, this event will be fired on all pages on which OneSignal is active.
dismiss
This event occurs when:
This event does not occur if a user clicks on the notification body or one of the action buttons. That is considered a notification click
event.
setDefaultUrl()
Sets the default URL for notifications.
If you haven’t set a default URL, your notification will open to the root of your site by default.
To set the default URL for notifications, provide a valid URL that you want to be launched when the notification is clicked. This default URL will be used if no other URL is specified when creating a notification. If you do specify a URL when creating a notification, the default URL will be overridden.
In the case of Safari, the default notification icon URL will be set to the Site URL that you have specified in your Safari settings, as this function is not available.
setDefaultTitle()
Sets the default title to display on notifications.
If a notification is created with a title, the specified title always overrides this default title.
A notification’s title defaults to the title of the page the user last visited. If your page titles vary between pages, this inconsistency can be undesirable. Call this to standardize page titles across notifications, as long as a notification title isn’t specified.
sendOutcome()
Triggers an outcome which can be viewed in the OneSignal dashboard. Accepts an outcome name (string
, required) and a value (number
, optional). Each time sendOutcome
method is invoked with the same outcome name passed, the outcome count will increase, and the outcome value will be increased by the amount passed in (if included). See Custom Outcomes for more details.
sendUniqueOutcome()
Triggers an outcome which can be viewed in the OneSignal dashboard. Accepts only the outcome name (string
, required). sendUniqueOutcome
will increase the count for that outcome only once per user. See Custom Outcomes for more details.