Notificações

A interface da API de Notificações é usada para configurar e exibir notificações  na área de trabalho do usuário.

Construtor

Notification()

Cria uma nova instancia do objeto Notification.

Propriedades

Propriedades estáticas

Estas propriedades estão disponíveis apenas no próprio objeto  Notification.

Notification.permission Somente leitura

 

Uma seqüência de caracteres que representa a permissão atual para exibir notificações. Valor possíveis são: "denied" (o usuário se recusa a ter notificações exibidas), "granted" (o usuário aceita ter notificações exibidas) ou "default" (a escolha do usuário é desconhecido e, portanto, o navegador irá agir como se o valor foram negados).

Propriedades da instância

Estas propriedades estão disponíveis apenas em instâncias do objeto Notification.

Notification.title Somente leitura

Retorna o título da notificação conforme foi definido no parâmetro opções do construtor.

Notification.dir Somente leitura

A direção do texto da notificação, conforme especificado no parâmetro opções do construtor.

Notification.lang Somente leitura

O código de idioma da notificação, conforme especificado no parâmetro opções do construtor.

Notification.body Somente leitura

O corpo(mensagem) da notificação, conforme especificado no parâmetro opções do construtor.

Notification.tag Somente leitura

O ID da notificação (se houver), conforme especificado no parâmetro opções do construtor.

Notification.icon Somente leitura

A URL da imagem usada como um ícone da notificação, conforme especificado no parâmetro opções do construtor.

Notification.data Somente leitura

Retorna um clone estruturado de dados da notificação.

Notification.silent Somente leitura

Especifica se a notificação deve ser silenciosa, ou seja, sons ou vibrações não devem ser emitidos, independentemente das configurações do dispositivo.

Propriedades não suportadas

As propriedades a seguir estão listados na especificação mais up-to-date, mas não são suportadas em quaisquer navegadores ainda. É aconselhável manter a verificação de volta regularmente para ver se o status destes actualiza, e deixe-nos saber se você encontrar qualquer informações desatualizadas.

Notification.noscreen Somente leitura

Especifica se o disparo notificação deve permitir que a tela do dispositivo ou não.

Notification.renotify Somente leitura

Especifica se o usuário deve ser notificado após uma nova notificação substitui um antigo.

Notification.sound Somente leitura

Especifica um recurso de som para reproduzir durante o disparo da notificação, em vez do som de notificação do sistema padrão.

Notification.sticky Somente leitura

Especifica se a notificação deve ser "fixa", ou seja, não facilmente eliminável pelo usuário.

Notification.vibrate Somente leitura

Especifica um padrão de vibração para dispositivos com hardware de vibração.

Manipuladores de Eventos

Notification.onclick

O manipulador para o evento click é acionado cada vez que o usuário clica sobre a notificação.

Notification.onerror

O manipulador para o evento error é acionado quando a notificação encontra um erro.

Manipuladores Obsoletos

Os seguintes manipuladores de eventos ainda são suportados, conforme listado na seção browser compatibility. Estes serão listados abaixo, mas não são listados na especificação atual. Saiba que eles são obsoletos, e pode parar de funcionar em versões futuras do navegador.

Notification.onclose

Manipulador do evento close é acionado quando a notificação é fechada.

Notification.onshow

Manipulador do evento show. é acionado quando a notificação é exibida.

Métodos

Métodos Estáticos

Estes métodos estão disponíveis apenas no próprio objeto Notification.

Notification.requestPermission()

Solicita a permissão do usuário para exibir notificações.

Métodos de instância

These properties are available only on an instance of the Notification object or through its prototype. O objeto de notificação também herda a interface EventTarget.

Notification.close()

Programaticamente fecha uma notificação.

Exemplo

Assume this basic HTML:

<button onclick="notifyMe()">Notifique me!</button>

É possível enviar uma notificação da seguinte forma - aqui nós apresentamos um conjunto bastante detalhado e completo de código que você pode usar se você quiser verificar primeiro se as notificações são suportados, em seguida, verifique se a permissão foi concedida para a origem atual para enviar notificações, em seguida, solicitar permissão, se necessário, antes, em seguida, enviar uma notificação.

function notifyMe() {
  // Let's check if the browser supports notifications
  if (!("Notification" in window)) {
    alert("This browser does not support desktop notification");
  }

  // Let's check whether notification permissions have already been granted
  else if (Notification.permission === "granted") {
    // If it's okay let's create a notification
    var notification = new Notification("Hi there!");
  }

  // Otherwise, we need to ask the user for permission
  else if (Notification.permission !== 'denied') {
    Notification.requestPermission(function (permission) {
      // If the user accepts, let's create a notification
      if (permission === "granted") {
        var notification = new Notification("Hi there!");
      }
    });
  }

  // At last, if the user has denied notifications, and you 
  // want to be respectful there is no need to bother them any more.
}

Em muitos casos, você não precisa estar presente detalhado. Por exemplo, na nosso Emogotchi demo (veja o código fonte), basta simlesmente executar Notification.requestPermission independentemente de se certificar de que pode obter permissão para enviar notificações:

Notification.requestPermission();

Em seguida executar um simples spawnNotification() quando queremos disparar uma notificação — este é passado argumentos para especificar o, ícone corpo e título que queremos, então ele cria as opções necessárias objeto e dispara a notificação usando o construtor Notification().

function spawnNotification(corpo,icone,titulo) {
  var opcoes = {
      body: corpo,
      icon: icone
  }
  var n = new Notification(titulo,opcoes);
}

Specifications

Compartibilidade dos Navegadores

[1] Versões anteriores ao Chrome 22, o suporte de notificações seguindo o Antiga especificação para versão prefixadas e usando o objeto navigator.webkitNotifications para instanciar uma nova notificação.

Versões anteriores ao Chrome 32, Notification.permission não é suportado.

Versões anteriores ao Chrome 42, adições trabalhador de serviço não são suportadas.

[2] Versões inferiores ao Firefox 22 (Firefox OS <1.2), a instanciação de uma nova notificação deve ser feita com o objeto navigator.mozNotification atravéz de seu método createNotification.

Versões inferiores ao Firefox 22 (Firefox OS <1.2),A notificação é exibida ao chamar o método show e suportado apenas o clique e eventos próximos.

Nick Desaulniers escreveu Notification shim para cobrir ambas as implementações mais novas e mais velhas.

Um particular problema Firefox OS é que você precisa passar um caminho para um ícone para usar a notificação, mas se o app é embalado você não pode usar um caminho relativo como /my_icon.png. Você também não pode usarwindow.location.origin + "/my_icon.png" porque window.location.origin é nulo in em apps embalados. O manifest origin field fcorrige isso, mas está disponível apenas no Firefox 1.1+ OS. Uma solução potencial para suportar o Firefox OS <1.1 é passar um URL absoluto para uma versão hospedada externamente do ícone.Isso é menos do que ideal como a notificação é exibida imediatamente, sem o ícone, o ícone é buscada, mas ele funciona em todas as versões do Firefox OS.

Ao usar notificações em um aplicativo Firefox OS, certifique-se de adicionar a permissão de desktop de notificação em seu arquivo de manifesto. As notificações podem ser utilizados em qualquer nível de permissão, hospedado ou acima: "permissions": { "desktop-notification": {} }

[3] Safari começou a apoiar notificação com o Safari 6, mas apenas no Mac OSX 10.8+ (Mountain Lion).

Veja também

• Usando a API de Notificações