JavaScript
API de notificaciones

Sintaxis

• Notification.requestPermission ( devolución de llamada )
• Notification.requestPermission (). Then ( callback , rejectFunc )
• Nueva notificación ( título , opciones )
• notificación .close ()

Observaciones

Solicitando Permiso para enviar notificaciones

Usamos Notification.requestPermission para preguntar al usuario si desea recibir notificaciones de nuestro sitio web.

Notification.requestPermission(function() {
    if (Notification.permission === 'granted') {
        // user approved.
        // use of new Notification(...) syntax will now be successful
    } else if (Notification.permission === 'denied') {
        // user denied.
    } else { // Notification.permission === 'default'
        // user didn’t make a decision.
        // You can’t send notifications until they grant permission.
    }
});

Desde Firefox 47 El método .requestPermission también puede devolver una promesa al manejar la decisión del usuario de otorgar permiso

Notification.requestPermission().then(function(permission) {
    if (!('permission' in Notification)) {
        Notification.permission = permission;
    }
    // you got permission !
    }, function(rejection) {
    // handle rejection here.
    }
);

Enviando notificaciones

Después de que el usuario haya aprobado una solicitud de permiso para enviar notificaciones , podemos enviar una notificación simple que dice Hola al usuario:

new Notification('Hello', { body: 'Hello, world!', icon: 'url to an .ico image' });

Esto enviará una notificación como esta:

Hola

¡Hola Mundo!

Cerrando una notificación

Puede cerrar una notificación utilizando el método .close() .

let notification = new Notification(title, options);
// do some work, then close the notification
notification.close()

Puede utilizar la función setTimeout para cerrar automáticamente la notificación en el futuro.

let notification = new Notification(title, options);
setTimeout(() => {
    notification.close()
}, 4000);

El código anterior generará una notificación y la cerrará después de 4 segundos.

Eventos de notificación

Las especificaciones de la API de notificaciones admiten 2 eventos que pueden activarse mediante una notificación.

1. El evento click .

Este evento se ejecutará cuando haga clic en el cuerpo de la notificación (excluyendo la X de cierre y el botón de configuración de Notificaciones).

Ejemplo:

notification.onclick = function(event) {
    console.debug("you click me and this is my event object: ", event);
}

2. El evento de error

La notificación activará este evento siempre que ocurra algo incorrecto, como no poder mostrar

notification.onerror = function(event) {
    console.debug("There was an error: ", event);
}