Menu

#1408 Complete web push example with non-interactive subscription

open
nobody
None
2025-02-07
2025-02-07
Anonymous
No

Originally created by: maxrothman

Currently, the cookbook.push example only features manually subscribing to the pushmanager in the service worker's devtools. Obviously this is not a real solution for live extensions. Getting the subscription created requires this additional code:

addEventListener('activate', (e) => {
  e.waitUntil(subscribeUserVisibleOnlyFalse());
})

This should be noted somewhere in the documentation or the example, and currently there's no information about this in either source or any other source I could find. The extension docs imply that you can use a top-level await to block until the subscription is created:

const SERVER_PUBLIC_KEY = '_INSERT_VALUE_HERE_';
const applicationServerKey = urlB64ToUint8Array(SERVER_PUBLIC_KEY);

async function subscribe() {
  try {
    let subscription = await self.registration.pushManager.subscribe({
      userVisibleOnly: true,
      applicationServerKey
    });

    console.log(`Subscribed: ${JSON.stringify(subscription,0,2)}`);

    return subscription
  } catch (error) {
    console.error('Subscribe error: ', error);
  }
}

const subscription = await subscribe();

But of course top-level await isn't allowed in BSWs.

Related

Tickets: #1410
Tickets: #1422
Tickets: #1423
Tickets: #1424
Tickets: #1698

Discussion

  • Anonymous

    Anonymous - 2025-02-07

    Originally posted by: patrickkettner

    Hi Max!
    Out of curiosity, why is it not a “real solution“? Statistically a majority
    of usage of push notifications subscriptions within an extensions happen as
    the result of user interaction. Not questioning your use case, but I would
    love to better understand it so we can properly document it

     
  • Anonymous

    Anonymous - 2025-02-07

    Originally posted by: maxrothman

    Interesting, whats's an example of push notification subscriptions resulting from a user interaction? I'm not sure I understand how that would work.

    My use case is that I'm using silent push notifications to sync data to the extension. The user performs an interaction on some other device, then when they open the extension popup that information should be instantly available in the popup view. Of course I could queue those updates on my backend and poll for them/use websockets when the popup is opened, but it significantly simplifies my backend if I don't have to handle that data queueing.

     

Log in to post a comment.