Criando notificações de desktop para seu site

By Thiago Santos, 10 de Março de 2016

A algum tempo percebi que sites como WhatsApp Web e Superplayer utilizam um esquema de notificação nos seus sites, sendo assim fui pesquisar e achei como é o funcionamento.
Essa é uma funcionalidade chamada Notification, que no momento é suportada, no desktop, pelos browsers Firefox, Chrome e Safari.
No Stackoverflow achei a seguinte solução:


function notify() {
    Notification.requestPermission(function() {
        var notification = new Notification("Título da notificação", {
            icon: 'http://www.url-da-imagem.com.br',
            body: "Texto da notificação"
        });
        notification.onclick = function() {
            window.open("http://www.seu-link.com.br");
        }
    });
}

Assim é só chamar a função notify() onde desejar. Em um projeto o qual participei, utilizei ao carregar o site, via onload=”notyfy()”, na tag <body>

5 Comentário

  1. Cara, vou testar e depois comento com você ok?
    Mas Parabéns pela iniciativa!

  2. Ok, @Leonardo.
    Dá para utilizar de várias formas essas notificações, uma delas é para mensagens em formulários.

  3. Raphael diz:

    muito legal, também tinha curiosidade em saber.

  4. Obrigado @Raphael. Espero que seja útil em algum projeto que esteja desenvolvendo.
    Caso utilize, peço que disponibilize um link para visualizarmos a maneira que aproveitou esse recurso.

  5. Tarcisio diz:

    Messenger do também faz.

O que você achou?

Deixe uma resposta

O seu endereço de email não será publicado.