campusMVP_Notification

Estos días he estado creando un módulo JavaScript para facilitar el uso de las notificaciones del navegador usando la API estándar "Web Notifications" del World Wide Web Consortium (W3C).

La idea es poder mostrar notificaciones nativas al usuario (de las que aparecen al lado del reloj en Windows, por ejemplo) pero desde aplicaciones web. Por ejemplo, cuando llega un nuevo correo (como hace GMail), o cualquier otra circunstancia que necesitemos notificar en segundo plano al usuario, pero desde el navegador.

Actualmente el único navegador que NO las soporta es Internet Explorer / Edge, y no parece que tengan intención de soportarlas tampoco, pero en todos los demás funcionarán sin problemas.

En su día escribí un artículo explicando con detalle cómo utilizarlas "a pelo", sin usar ninguna biblioteca intermedia. Esto es una especie de continuación. Lo que he hecho es crear una biblioteca que, en mi opinión, hace más sencillo el uso de esta característica. Además homogeniza cuestiones como el tiempo de mostrar una notificación o el estado actual de permisos para mostrarlas.

Se trata de un modulo dual y se puede utilizar tanto directamente, incluyéndolo con una etiqueta <script> normal y corriente, como mediante inyección de dependencias con AMD (por ejemplo con Require.js).

He creado un repositorio en GitHub que incluye:

  • Documentación completa del módulo, con explicaciones de las funciones expuestas, su funcionamiento, etc... De momento está solo en inglés, pero entiendo que no debería suponer demasiado problema.
  • El código fuente completo (WebNotifications.js). Incluye comentarios explicativos para entender mejor cómo funciona.
  • La versión minimizada del módulo (WebNotifications.min.js), para usarlo con la mínima carga posible (962 bytes). Incluye un archivo de mapa (WebNotifications.min.js.map) para ayudar a la depuración en producción si fuera necesario.
  • Un archivo de ejemplo de uso (WebNotificationsTest.htm) que implementa todas las funcionalidades para comprobar que funcionan (debe usarse desde un servidor web: en local no funcionará).

¡Espero que lo encuentres útil!

💪🏻 ¿Este post te ha ayudado?, ¿has aprendido algo nuevo?
Pues NO te pido que me invites a un café... Te pido algo más fácil y mucho mejor