As notificações push agora podem ser usadas em navegadores diferentes

Envie notificações úteis e oportunas aos seus usuários.

Thomas Steiner

As notificações push foram padronizadas em 2016 com o lançamento da API Push e da API Notification, que fazem parte do grupo de trabalho de aplicativos da Web do W3C. Essas APIs fornecem a funcionalidade necessária para que os desenvolvedores web incorporem notificações push em seus aplicativos da web e para que os usuários recebam e interajam com as notificações em seus navegadores da web. As mensagens push são notificações enviadas ao navegador da Web de um usuário de um site ou aplicativo que o usuário já autorizou a enviar notificações. Essas mensagens podem ser usadas para alertar o usuário sobre novos conteúdos ou atualizações, lembrá-lo de eventos ou prazos futuros ou fornecer outras informações importantes. As mensagens push podem ser especialmente úteis para aplicativos que precisam enviar informações relevantes e oportunas aos usuários, como apps de notícias ou esportes, ou para sites de comércio eletrônico que querem enviar notificações aos usuários sobre ofertas especiais ou liquidações.

Para se inscrever para receber notificações push, primeiro confira se seu navegador é compatível, verificando os objetos serviceWorker e PushManager nos objetos navigator e window.

Se as notificações push forem compatíveis, use as palavras-chave async e await para registrar o service worker e se inscrever para receber notificações push. Confira um exemplo de como fazer isso usando JavaScript:

// Check if the browser supports push notifications.
if ("serviceWorker" in navigator && "PushManager" in window) {
  try {
    // Register the service worker.
    const swReg = await navigator.serviceWorker.register("/sw.js");

    // Subscribe for push notifications.
    const pushSubscription = await swReg.pushManager.subscribe({
      userVisibleOnly: true
    });

    // Save the push subscription to the database.
    savePushSubscription(pushSubscription);
  } catch (error) {
    // Handle errors.
    console.error("Error subscribing for push notifications.", error);
  }
} else {
  // Push notifications are not supported by the browser.
  console.error("Push notifications are not supported by the browser.");
}

Leitura adicional

• Visão geral das notificações push
• API Push
• Envio da Web para apps da Web no iOS e iPadOS