onesignal / onesignal-website-sdk

OneSignal is a push notification service for web and mobile apps. This SDK makes it easy to integrate your website with OneSignal Push Notifications. https://onesignal.com

Showing web push notifications from Chrome, Safari, and Firefox

OneSignal Web Push SDK

OneSignal is the market leader in customer engagement, powering mobile push, web push, email, and in-app messages.

This SDK allows your site's visitors to receive push notifications from you. Send visitors custom notification content, target specific users, and send automatically based on triggers.

Getting Started

View our documentation to get started.

Please reference the OneSignal SDK on your webpage via our CDN URL (listed in our setup documentation) instead of copying the source into another file. This is because our SDK updates frequently for new features and bug fixes.

onesignal-website-sdk's Issues

If user deleted from OneSignal dashboard, wipe client-side data

It's not intuitive that deleting a user from the OneSignal dashboard still leaves behind client-side data on the browser. IndexedDB should be wiped and the service worker should be unregistered (if possible, on HTTPS) if we get a no user with this ID found error indicating the user is deleted.

Investigate allowing a CNAME'd subdomain to be used in place of ours for HTTP websites

Allow setDefaultTitle to have a blank title of ''

For a web push notification with a non-empty title specified when sending the message, that title will always be used.

For a web push notification sent without a title:

• We check for whether a default title has been explicitly set. You would set a default title by calling OneSignal.setDefaultTitle() and this value is persisted in the site's web storage. If a default title has been explicitly set, it is used.
• On any page with OneSignal active on it, our SDK stores the current page's title. In case the notification was sent without a title, and in case no default title has been explicitly set, we use the last visited page's title as the notification's title.
• If, for any reason, neither the default title or the last visited page's title is stored, no title is displayed and the notification's title is left blank.

---

setDefaultTitle('') currently chokes because of this check: https://github.com/OneSignal/OneSignal-Website-SDK/blob/master/src/serviceWorker.js#L592. It should really be if (defaultTitle !== null) to allow the empty string as a valid title.

Currently users must call setDefaultTitle(' ') with a space in order to get around this.

Add Referrer header to API calls made by the web SDK

Notify button pulse animation is overridden by animate.css's pulse

Our notify button has a pulse animation which causes a white circle to grow outward from the center of the notify button.

The animate.css library overwrites our identically named pulse animation on this line.

On https://onesignal.com/webpush, this results in the pulse animation not being shown, in addition to possibly causing issues with the drop-shadow border.

Slim down SDK size

The current minified SDK size is 342 KB, and is 70.2 KB after browser compression.

Notify button on Safari shows violet highlight color on click

On Safari, there is a violet highlight color that is usually displayed on click.

Support the Yandex browser

Other push providers support the Yandex browser so we should too.

Show the welcome notification again if the user subscribed

Currently the welcome notification is only shown to "new" users who have just had their IndexedDB database created for the first time. Change this so that the welcome notification is always shown on re-subscription to confirm that the user re-subscribed successfully.

Firefox IndexedDb InvalidStateError - Print typed descriptive error

with Firefox 45 we on some workstations with windows (7, 8.1, 10) we are not able to use website push notifications. while using chrome browser this works on the same workstation.

we debugged the error in firebug:
Unable to open IndexedDB. error
OneSignalSDK.js (Zeile 5)
UnknownError
OneSignalSDK.js (Zeile 5, Spalte 15054)

Wipe IndexedDB storage if user no longer exists in OneSignal

If an API call involving a player returns "No user with this id found", then wipe the local IndexedDB database so that the user can re-subscribe.

HTTPS native prompt is re-displaying within the same page session

The native prompt should only display once per new tab/window.

Add automatically appearing in-page modal dialog for users to subscribe for HTTP sites

Requests since issue created: 2

Some of the users asking for this feature:

https://app.intercom.io/a/apps/344a89aeac3f033e4dec4370781543b948aece6d/inbox/web-push-team/conversations/5039983145

You have new updates shown if user is missing IndexedDB with service worker still active

Somehow, users' IndexedDB data is being cleared while the service worker is still active (as if only 'Offline Website Data' is cleared). When a push event is triggered on the service worker by Chrome, our service worker is unable to contact OneSignal to retrieve the notification contents, because the API to do so requires a valid user ID, which was stored in IndexedDB but is now missing.

InvalidStateError

(unknown): InvalidStateError
File https://cdn.onesignal.com/sdks/OneSignalSDK.js line 8 in [anonymous]
InvalidStateError Firefox 44.0 Windows 8.1

Hello, I am occasionally getting these errors reported to my rollbar tracker.

Add custom tags to display notifications in parallel

Currently each service worker displays all of its notifications with the same tag. Allow multiple tags so that notifications can be grouped and won't cancel each other out.

Add a notification displayed event handler

We currently have a notification clicked event handler but no notification displayed event handler, which has led to some users using difficult workarounds.

Automate documentation and type information from source

I'm building an angular2 app with OneScript to do push, and it would be nice to have a definition file to use with typescript that helps implement the API correctly. Are you likely to provide one in the future? If not and I end up writing one, would you guys be interested in bundling it with your SDK?

It would also be a good thing to write/provide for the cordova SDK, since then we could integrate it more easily into our ionic2 app.

Please remove "onfetch" that catching everything (or an option to disable this)

Hello!
First of all thank you for OneSignal. It's very convenient to use.

My problem is that OneSignal ServiceWorker catching all requests. It seems useless cause it doesn't do anything except fetch. Even more, it's harmful!

In my case it broke all videos on my site. There are two reasons:

1. Seems like "fetch" doesn't allow request to http video from https (while browser allow this).
2. Even if I use https to request video, "fetch" seems like trying to download whole video and video player waiting until it would be done.

So, please remove it or add an option to disable it.

getIdsAvailable return data even I deleted this user on onesignal user page

I tried to delete user on onesignal page but the javascript api "getIdsAvailable" still returns data. My purpose is to check if user is already registered on onesignal.
Please help

Sometimes I receive the following notification "The site has been updated in the background"out of nowhere?

Sometimes when I send a notification, I receive the following notification with the content as "The site has been updated in the background".

I never write this text. I think it is an one signal SDK bug. How can I fix this?

Add notification action buttons

Add notification action buttons implemented in Chrome 48+.

Check that local storage and IndexedDB is accessible before using it

Notification URLs without a scheme open relative to the subscribing origin

For example, if we a send a notification using the URL www.google.com, our service worker says this is an invalid URL and it only works if we add https:// or http://.

Notify button text containing HTML entity characters should be decoded

For example:

Merci d'avoir activé les notifications

should read:

Merci d'avoir activé les notifications

This error occurs on any text containing HTML entities that is displayed on the notify button, as part of the customized notify button text init parameters.

SDK initialization event is incompatible with CloudFlare's rocket loader

console.warn('Current Document ReadyState:', document.readyState);
document.onreadystatechange = () => console.warn('onreadystatechange ReadyState:', document.readyState);
window.addEventListener('DOMContentLoaded', () => console.warn('DOMContentLoaded ReadyState:', document.readyState));
window.addEventListener('load', () => console.warn('load ReadyState:', document.readyState));

Results:

Current Document ReadyState: loading
onreadystatechange ReadyState: loading
DOMContentLoaded ReadyState: loading
onreadystatechange ReadyState: loading
load ReadyState: loading

CloudFlare's rocket loader somehow modifies the loading events. However this event is still fired:

onreadystatechange: complete

So we should listen for that.

Session count and last active broken for HTTP sites and Safari

The last active and session count is not updated when the user opens a new tab or window to their site for all HTTP sites and for Safari.

Print a console warning the web SDK from being loaded twice

Currently the web SDK silently fails if loaded twice.

Add renotify notification flag to notifications

Default behavior for alerting users of subsequent notifications sharing the same tag got changed in Chrome 50. https://developers.google.com/web/updates/2016/03/notifications?hl=en

dashboard giving wrong Delivery Status

I am sending push Notifications to n devices,after sending message in delivery Status it is showing that the notification sent successfully to all the n devices but none of the device received any notification.
How can i solve this issue

Allow hiding the bell on pages after subscribing

Fix HTTP prompt Roboto font loading

The Roboto font is loaded all the time with the new CSS, which is not necessary and impacts site performance.

Add in NPM

You can add your project in NPM?

npm install onesignal-web-sdk --save

listen to push notification

Is there a way to listen to the push notification ? I may need to perform a certain action when the user receives a certain type of notification while reading a certain article on my website. It would be nice to give users the option of displaying the Chrome notification message OR running a custom script or both.
The cordova implementation of of notificationOpenedCallback seem to do exactly what I need. However, I am unable to find a similar callback with the Web Push SDK. https://documentation.onesignal.com/docs/phonegap--cordova-sdk-api#notificationOpenedCallback

The only relevant callback for Web Push is addListenerForNotificationOpened but it requires the user to click the displayed message for the callback function to run. Also, it does not give me the option of disabling the default notification message when my website tab is active.

In other words, I may want to tap into the following

self.addEventListener('push', function(event) {  

});

as described in the following link:
https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web?hl=en

Notifications can sometimes not appear when using a specific tag

When the notification tag is changed to be any other value (or no tag at all), the notification will appear. This seems like a Chrome bug and should be reported.

Firefox 45 not working (Ubuntu)

Website SDK isn't working on Firefox 45 (Ubuntu) :

TypeError: window.localStorage is null
 init()
  OneSignalSDK.js:4
 push()
  OneSignalSDK.js:5
 _processPushes()
  OneSignalSDK.js:5
 <anonyme>
  OneSignalSDK.js:1
 __webpack_require__()
  OneSignalSDK.js:1
 <anonyme>
  OneSignalSDK.js:1
 <anonyme>
  OneSignalSDK.js:1

Notify button circular drop shadow occasionally truncates and becomes rectangular

Causes:

• On mobile, clicking the notify button to subscribing, dismissing the permission prompt, and clicking again on the page can cause the button to exhibit the rectangular truncated drop shadow
• Pulse animation on desktop. Setting a display: none; to the .pulse-ring class seems to make it go away. Seems to occur on onesignal.com/webpush but not a local testing site.

Cannot resubscribe after clicking "No Thanks" on HTTPS modal prompt

Variable _sessionInitAlreadyRunning needs to be unset from true.

Notification permission changed event not firing on Chrome mobile

HTTP prompt default icon is blank

https://github.com/OneSignal/OneSignal-Website-SDK/blob/master/src/popover/popover.js#L120 always returns true, so default-icon is never returned.

how to iso chrome push?

how to iso chrome push?

Support Firefox 48+ mobile push notifications

Push is now enabled by default in Firefox 48, and users can subscribe, but:

• Our isPushNotificationsSupported() method says Firefox 47 on Android supports push notifications, which isn't correct

Multiple subscriptions are made if multiple registerForPushNotifications() calls are made

If a user clicks the notify button, which brings up the permission prompt the first time, but instead of interacting with the prompt clicks the notify button one or more times again, the user is subscribed multiple times when he finally clicks Allow. The event handlers should not stack.

However, the registration IDs have been unique in the single test case I've observed.

Safari error

Hi there,

I'm seeing this error on Safari browser

TypeError: undefined is not an object (evaluating 'navigator.serviceWorker.controller') ... sdk.js:1869

But notification are working.

In our website we are including this js file https://cdn.onesignal.com/sdks/OneSignalSDK.js

Let me know if you need more info.

Allow customization of HTTP popup text "This website"

All the other text in the popup can be customized except for that.

Investigate supporting the Samsung browser

Notify button dialog popup does not show site icon after initial subscribe

The icon also does not show if you unsubscribe after subscribing. Looks like it doesn't show until you're subscribed, which isn't correct behavior.

Restore moved WordPress manifest location

Add notification dismissed event

Added in Chrome 50 https://developers.google.com/web/updates/2016/03/notifications?hl=en

Unable to receive chomre push notification in Samsung duos running Android Kitkat

Hello

I have configured my website with one signal push SDK.

When I send notifications, I am able to receive them in all my devices except for Samsung galaxy duos running Android Kitkat.

Is a an android version bug. Are chrome push notification supported in Kitkat?