5 ms·

Push.js – A minimalist JavaScript library for desktop notifications

122 points by Nickersoft 10y ago

jflowers45 10y ago
I'm a little bit new to the desktop notifications game, but it would be cool to know how this compares/relates to something like roost
acbabis 10y ago
I just downloaded this and made a 1-liner to try it out. Really cool. Worked just fine in FF. Not sure why it didn't do anything in Chrome on Mac. > setInterval(function() { Push.create('Hi') }, 2000);
- lprubin 10y ago
  Usually chrome requires a service worker for notifications and I don't see one in this library. Anybody else get this working with chrome?
- K-Wall 10y ago
  I too had this issue. I appears that notifications don't show in full screen mode. When I returned Chrome to a windowed app on my Mac the notifications appeared.
  - Nickersoft 10y ago
    I think I ran into the issue before as well.. however, I think that's an issue with how Chrome handles its notifications. I don't think there's anything in the library that could cause this behavior. A known issue is that the library is currently broken in Safari. I will investigate why when I have some free time.
philippnagel 10y ago
Is there a similar library for mobile?
- shortstuffsushi 10y ago
  Does mobile have a comparable feature? Native Push Notifications are an entirely different beast; afaik, there is no way to have browser type notifications like this.
  - Fogest 10y ago
    Chrome on Android does support push notifications from the browser. Facebook makes use of this and you can actually get push notifications from Facebook without using their app. Facebook requests in the Chrome browser to use notifications and then you can receive them without even having the browser app open.
    - shortstuffsushi 10y ago
      For push notifications, yes, but these are "browser / desktop" notifications, which only show up while the application is running. It's possible this works on mobile with the app running in the background, but I haven't seen it before.
echeese 10y ago
I hate to be pedantic but these are not push notifications. Those are the ones that can be sent even if the webapp is closed, for example, this Chrome demo: https://developers.google.com/web/fundamentals/getting-started/push-notifications/?hl=en https://developers.google.com/web/fundamentals/getting-start...
- andreasklinger 10y ago
  unsure here but isnt it the same but in this case it is just not yet using a service worker to listen for new push notifications ?
- jvehent 10y ago
  See also https://hacks.mozilla.org/2016/01/web-push-arrives-in-firefox-44/ https://hacks.mozilla.org/2016/01/web-push-arrives-in-firefo... WebPush is (going to be) an IETF standard: https://datatracker.ietf.org/wg/webpush/documents/ https://datatracker.ietf.org/wg/webpush/documents/
  - andrewstuart2 10y ago
    Yikes, that really seems like abuse of HTTP/2 semantics to me. My understanding has always been that server push in HTTP/2 is only intended to prime the client cache for requests you know they're about to (or likely to) make. [1] > Pushed responses are always associated with an explicit request from the client. I'd rather see additional frame types defined that allow for bidirectional communication (i.e. websockets 2.0) than overriding and conflating the PUSH_PROMISE frame type. [1] https://tools.ietf.org/html/rfc7540#section-8.2 https://tools.ietf.org/html/rfc7540#section-8.2
- dang 10y ago
  Ok we replaced 'push' with 'desktop' which is what the Github page says.
- untog 10y ago
  Sort of. There's nothing stopping you from using script inside a Service Worker to send those notifications. Calling them push notification is troublesome as the Web Push API and Notification API are actually two entirely separate things.
adalyz 10y ago
super nifty and really useful, does it require https ?
- shortstuffsushi 10y ago
  Why would it require HTTPS? This is a javascript library that allows you to hook into a native browser function (showing desktop notifications). There are no web services involved.
  - ludamad 10y ago
    Presumably grandparent post was paranoid that http websites have some lower status in terms of being able to send notifications. Not a likely scenario, but not an entirely unreasonable question.
    - Nullabillity 10y ago
      The browser push APIs do require HTTPS, since browsers refuse to install service workers otherwise (which is required for them to function...). That said, the demo is hosted over plain HTTP, and seems to work for me (Chrome 50, Linux).
      - shortstuffsushi 10y ago
        These are not actual "push" notifications, they are desktop notifications. Different functionality, and no service workers.
  - adalyz 10y ago
    https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web?hl=en https://developers.google.com/web/updates/2015/03/push-notif... Why does this require HTTPS? How do I work around this during development? Service workers require secure origins to ensure that the service worker script is from the intended origin and hasn’t come about from a man-in-the-middle attack. Currently, that means using HTTPS on live sites, though localhost will work during development.
bikamonki 10y ago
I think you may be confusing push notifications with browser notifications?
abimaelmartell 10y ago
Not working on Safari.
- nodesocket 10y ago
  Does not seem to work locally using Chrome 50.0.2661.102 (64-bit) either. Not a good sign.
  - softawre 10y ago
    > eighter Niner one niner five copy that.
    - nodesocket 10y ago
      I type good.
      - chrisper 10y ago
        You should write a JavaScript library for typing!
  - Nickersoft 10y ago
    I just tested on Chrome 50.0.2661.102 (64-bit) on OSX 10.11.4 and it seems to work. What OS are you running? Did it ask you permission to show notifications? Are there any errors in the developer console?
- Nickersoft 10y ago
  This is a known issue. The underlying code works, but the library doesn't for some reason. Will investigate when I have the time.
deleted 10y ago
[deleted]
ramon 10y ago
Nice project, I liked the fact that it has a fallback to older browser versions, will test it later.
philfreo 10y ago
Any reason why you couldn't instead have an optional drop-in Shim that allows developers to use the current/modern HTML5 Notifications API syntax, where the shim simply adds supports to older/other browsers? I hate introducing additional APIs if it's not necessary. In the future when the browsers you care about support the Notifications API it's easiest to simply remove the shim.
SimeVidas 10y ago
No demo?
- Nickersoft 10y ago
  Sorry, I meant to mention the demo is at http://nickersoft.github.io/push.js/demo.html http://nickersoft.github.io/push.js/demo.html.
Nickersoft 10y ago
Quick apology for confusing the terms "push notification" and "desktop notification". I forgot "push" usually refers to sites that use service workers to send notifications to the desktop regardless of whether the browser window is open. This library requires the window remain open for the notification to be shown.
TheAceOfHearts 10y ago
In the web app I work on, we have a toast component that we use to show the user status messages. It's usually used for showing error messages. I've been aware of desktop notifications being around or a couple years now, but I haven't used em. What guidelines or general rule of thumb do you use when deciding if something is worth a notification?

122 points by Nickersoft 10y ago

I'm a little bit new to the desktop notifications game, but it would be cool to know how this compares/relates to something like roost

acbabis 10y ago

I just downloaded this and made a 1-liner to try it out. Really cool. Worked just fine in FF. Not sure why it didn't do anything in Chrome on Mac. > setInterval(function() { Push.create('Hi') }, 2000);

lprubin 10y ago
Usually chrome requires a service worker for notifications and I don't see one in this library. Anybody else get this working with chrome?
K-Wall 10y ago
I too had this issue. I appears that notifications don't show in full screen mode. When I returned Chrome to a windowed app on my Mac the notifications appeared.
- Nickersoft 10y ago
  I think I ran into the issue before as well.. however, I think that's an issue with how Chrome handles its notifications. I don't think there's anything in the library that could cause this behavior. A known issue is that the library is currently broken in Safari. I will investigate why when I have some free time.

philippnagel 10y ago

Is there a similar library for mobile?

shortstuffsushi 10y ago
Does mobile have a comparable feature? Native Push Notifications are an entirely different beast; afaik, there is no way to have browser type notifications like this.
- Fogest 10y ago
  Chrome on Android does support push notifications from the browser. Facebook makes use of this and you can actually get push notifications from Facebook without using their app. Facebook requests in the Chrome browser to use notifications and then you can receive them without even having the browser app open.
  - shortstuffsushi 10y ago
    For push notifications, yes, but these are "browser / desktop" notifications, which only show up while the application is running. It's possible this works on mobile with the app running in the background, but I haven't seen it before.

echeese 10y ago

I hate to be pedantic but these are not push notifications. Those are the ones that can be sent even if the webapp is closed, for example, this Chrome demo: https://developers.google.com/web/fundamentals/getting-started/push-notifications/?hl=en https://developers.google.com/web/fundamentals/getting-start...

andreasklinger 10y ago
unsure here but isnt it the same but in this case it is just not yet using a service worker to listen for new push notifications ?
jvehent 10y ago
See also https://hacks.mozilla.org/2016/01/web-push-arrives-in-firefox-44/ https://hacks.mozilla.org/2016/01/web-push-arrives-in-firefo... WebPush is (going to be) an IETF standard: https://datatracker.ietf.org/wg/webpush/documents/ https://datatracker.ietf.org/wg/webpush/documents/
- andrewstuart2 10y ago
  Yikes, that really seems like abuse of HTTP/2 semantics to me. My understanding has always been that server push in HTTP/2 is only intended to prime the client cache for requests you know they're about to (or likely to) make. [1] > Pushed responses are always associated with an explicit request from the client. I'd rather see additional frame types defined that allow for bidirectional communication (i.e. websockets 2.0) than overriding and conflating the PUSH_PROMISE frame type. [1] https://tools.ietf.org/html/rfc7540#section-8.2 https://tools.ietf.org/html/rfc7540#section-8.2
dang 10y ago
Ok we replaced 'push' with 'desktop' which is what the Github page says.
untog 10y ago
Sort of. There's nothing stopping you from using script inside a Service Worker to send those notifications. Calling them push notification is troublesome as the Web Push API and Notification API are actually two entirely separate things.

adalyz 10y ago

super nifty and really useful, does it require https ?

shortstuffsushi 10y ago
Why would it require HTTPS? This is a javascript library that allows you to hook into a native browser function (showing desktop notifications). There are no web services involved.
- ludamad 10y ago
  Presumably grandparent post was paranoid that http websites have some lower status in terms of being able to send notifications. Not a likely scenario, but not an entirely unreasonable question.
  - Nullabillity 10y ago
    The browser push APIs do require HTTPS, since browsers refuse to install service workers otherwise (which is required for them to function...). That said, the demo is hosted over plain HTTP, and seems to work for me (Chrome 50, Linux).
    - shortstuffsushi 10y ago
      These are not actual "push" notifications, they are desktop notifications. Different functionality, and no service workers.
- adalyz 10y ago
  https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web?hl=en https://developers.google.com/web/updates/2015/03/push-notif... Why does this require HTTPS? How do I work around this during development? Service workers require secure origins to ensure that the service worker script is from the intended origin and hasn’t come about from a man-in-the-middle attack. Currently, that means using HTTPS on live sites, though localhost will work during development.

bikamonki 10y ago

I think you may be confusing push notifications with browser notifications?

abimaelmartell 10y ago

Not working on Safari.

nodesocket 10y ago
Does not seem to work locally using Chrome 50.0.2661.102 (64-bit) either. Not a good sign.
- softawre 10y ago
  > eighter Niner one niner five copy that.
  - nodesocket 10y ago
    I type good.
    - chrisper 10y ago
      You should write a JavaScript library for typing!
- Nickersoft 10y ago
  I just tested on Chrome 50.0.2661.102 (64-bit) on OSX 10.11.4 and it seems to work. What OS are you running? Did it ask you permission to show notifications? Are there any errors in the developer console?
Nickersoft 10y ago
This is a known issue. The underlying code works, but the library doesn't for some reason. Will investigate when I have the time.

deleted 10y ago

[deleted]

ramon 10y ago

Nice project, I liked the fact that it has a fallback to older browser versions, will test it later.

philfreo 10y ago

Any reason why you couldn't instead have an optional drop-in Shim that allows developers to use the current/modern HTML5 Notifications API syntax, where the shim simply adds supports to older/other browsers? I hate introducing additional APIs if it's not necessary. In the future when the browsers you care about support the Notifications API it's easiest to simply remove the shim.

SimeVidas 10y ago

No demo?

Nickersoft 10y ago
Sorry, I meant to mention the demo is at http://nickersoft.github.io/push.js/demo.html http://nickersoft.github.io/push.js/demo.html.

Nickersoft 10y ago

Quick apology for confusing the terms "push notification" and "desktop notification". I forgot "push" usually refers to sites that use service workers to send notifications to the desktop regardless of whether the browser window is open. This library requires the window remain open for the notification to be shown.

TheAceOfHearts 10y ago

In the web app I work on, we have a toast component that we use to show the user status messages. It's usually used for showing error messages. I've been aware of desktop notifications being around or a couple years now, but I haven't used em. What guidelines or general rule of thumb do you use when deciding if something is worth a notification?