Native Push Notifications Support for NodeBB

[email protected]

I'm particularly excited about this new development because it opens the door for richer integration between NodeBB and the push notifications themselves.

With (probably) every iteration prior, when you clicked on the notification, it likely opened a new window. With direct access to the Push API and service worker, we can now accurately detect whether the site is already open (in another tab), and open it there.

In the future, we'll also be able to add in things like icons, pictures, and custom actions, right from the notification itself.

One particular nice-to-have is the ability to update notifications. Being able to merge notifications (like they already do in NodeBB) or potentially rescind notifications would be a nice step forward in usability as well.

[email protected]

@julian Thanks a lot. Have enabled push on desktop(Edge) and mobile (Chrome), will report if anything unusual is noticed.

[email protected]

@julian Although I don't have an apple device, but I think web push will work properly now. I read in some articles that when apple first introduced service workers and push both were half baked, but things have improved with each new release of safari. Maybe, some iOS/macbook user would like to volunteer, by reversing the committ and then reporting the result on their device here. There is one caveat: On iOS, web push notifications work only on websites which are "Added to Home Screen" .

[email protected]

@julian doesn't seem to work for me even with cache cleared.

[email protected]

@phenomlab clearing the browser cache wouldn't actually remove the service worker, unfortunately.

It's proving surprisingly hard to find instructions to teach people how to clear the existing service worker

Chrome, at least, will check for a new one after 24 hours I think .

[email protected]

@julian OK. Still no activity for me though despite updates here. Did you also remove ntfy as that isn't issuing alerts anymore.

A bit greedy, but this js would probably work

if ('serviceWorker' in navigator) {
  caches.keys().then(function(cacheNames) {
    cacheNames.forEach(function(cacheName) {
      caches.delete(cacheName);
    });
  });
}

Or perhaps this header

Cache-Control: no-cache,no-store,must-revalidate

Or this modified js

function async deleteCaches() {
  try {
    const keys = await window.caches.keys();
    await Promise.all(keys.map(key =&gt; caches.delete(key)));
  } catch (err) {
    console.log('deleteCache err: ', err);
  }
}

// run this function on your app load
function resetCacheForUpdate() {
  if (!localStorage.getItem('cacheReset')) {
    deleteCaches()
      .then(_ =&gt; {
        localStorage.setItem('cacheReset', 'yes');
      }) 
  }
}

Source

https://jun711.github.io/web/service-worker-cache-busting/

[email protected]

@phenomlab It is not the service worker cache that is at fault, it's the fact that the service worker itself is outdated on your machine

But that will resolve over time, and I will look into further strategies.

That said, twice already I've lost my subscription to the push service. Will have to dig into it and see what error is thrown.

[email protected]

@julian understood. I now have this working on my phone at least.

Edit - and it works perfectly. I get the notification, click it and it uses my already open browser session to display.

[email protected]

@phenomlab Glad to hear it!

I updated the service worker so that when it is sent to the browser, it indicates that it is to immediately replace the existing worker, so hopefully my changes should be reflected quicker.

[email protected]

The web-push plugin has now been promoted in v4 beta to "bundled" status, with a corresponding demotion of the ntfy plugin.

https://github.com/NodeBB/NodeBB/commit/aa060d31d130cd54d18cd8dc2f25ba7de58f4fea

[email protected]

@julian Is there a link where we can install the v4 beta version of this plugin? I'd love to test it out over on Sudonix.

EDIT - NVM - I found the link..

[email protected]

@phenomlab glad to hear you found it

For those interested in updating, you can just grab the latest commit from activitypub branch or perhaps the more the specific commit:

git fetch
git checkout activitypub    # if you're not already on activitypub branch
git reset --hard 86f624f8172fb96fbd3c83683affd8814e8b5156`

[email protected]

The plugin also successfully removes notifications if they're no longer relevant (e.g. queued posts that have already been handled), and merges notification content just like it does in-app:

[email protected]

@julian I'm using the GIT link you provided to install. Plugin installs fine, but cannot get it to send any notification - even on my mobile device which works fine for NodeBB?

[email protected]

@phenomlab There's not terribly much to configure, just make sure that when you start NodeBB, that you see the output info: [plugins/web-push] VAPID keys OK.

That's how the messages are encoded to be sent to the corresponding browser push endpoints.

Other than that make sure the user has toggled push notifications on in their settings and allowed notifications for the site.

On Windows, you have to specifically also allow your browser access to send notifications to the user.

[email protected]

@julian Yes, I've done that, but can't seem to make it work.

[email protected]

On windows you need to enable notifications in the OS settings, it wasn't working without that for me.

[email protected]

@baris thanks. That setting is already on for me.

[email protected]

@phenomlab you need to be on v4.

Alternatively I believe you can update the service worker manually with the one from the ActivityPub branch.

[email protected]

@julian thanks. I'll check this later.

agnos.is Forums

Native Push Notifications Support for NodeBB