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

Envie notificações úteis e oportunas aos 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 da Web incorporem notificações push aos aplicativos da Web e para que os usuários recebam e interajam com notificações nos navegadores da Web. As mensagens push são notificações enviadas ao navegador da Web de um usuário por um site ou aplicativo a que ele concedeu permissão para enviar notificações. Essas mensagens podem ser usadas para alertar o usuário sobre novos conteúdos ou atualizações, lembrar de eventos ou prazos futuros ou fornecer outras informações importantes. As mensagens push podem ser especialmente úteis para aplicativos que precisam fornecer informações relevantes e oportunas aos usuários, como apps de notícias ou esportes, ou para sites de e-commerce que querem enviar notificações sobre ofertas especiais ou liquidações.

Para se inscrever nas notificações push, primeiro verifique se seu navegador é compatível com elas. Para isso, procure 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 nas notificações push. Veja 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
• Notificações push da Web para apps da Web no iOS e iPadOS