Notificaciones Push Web

Introducción

Las notificaciones push de Catalyst para aplicaciones web son un servicio completamente administrado que puedes usar para habilitar y activar fácilmente las notificaciones push en tu aplicación web.

Las notificaciones push de una aplicación web de Catalyst se muestran a los usuarios cuando la aplicación web está abierta en su navegador activo. Sin embargo, el navegador debe ser compatible con web push y service workers para que las notificaciones se entreguen al usuario. Puedes obtener más información sobre estos conceptos en la sección de Arquitectura de la documentación.

Puedes escribir tu propia acción para diseñar la lógica de las notificaciones push en el fragmento de código que Catalyst proporciona e implementarlo en tu aplicación.

Dependiendo de las directrices de los navegadores web, puedes habilitar una opción para que los usuarios de tu aplicación web acepten recibir notificaciones push. Esto se puede hacer incluyendo un aviso que solicite permiso para permitir las notificaciones push. Una vez que el usuario otorgue el permiso, se suscribirá para recibir notificaciones push de tu aplicación web. Se crea un ID de suscripción de usuario único cuando otorgan el permiso, lo que permite que la aplicación web les envíe notificaciones push. Puedes almacenar este ID en tu base de datos para identificar a los suscriptores.

Después de habilitar y configurar las notificaciones push en tu aplicación web, puedes enviar notificaciones push de prueba a usuarios específicos desde la consola de Catalyst. Podrás enviar notificaciones de texto sin formato a los clientes de prueba para verificar errores en la implementación. Los usuarios a los que las envíes deben tener sesiones activas de tu aplicación web abiertas en sus navegadores para recibir las notificaciones.

Conceptos Clave

Elementos de las Notificaciones Push Web

Los elementos de una notificación push varían dependiendo de si es para una aplicación web o móvil, principalmente debido a las diferencias en estándares y restricciones impuestas por los distintos navegadores web y las plataformas móviles.

La mayoría de los navegadores web no contienen restricciones estrictas sobre las personalizaciones HTML o los elementos interactivos que se incorporan en las notificaciones push web. Sin embargo, a diferencia de las notificaciones push de aplicaciones móviles nativas, las notificaciones push web no ofrecen soporte para una amplia variedad de tipos de medios y elementos interactivos como GIFs o audio. Además, las notificaciones push de aplicaciones móviles pueden acceder a la cámara del teléfono, al acelerómetro y más, lo cual no es posible desde una aplicación web.

Los diferentes navegadores web implementan diferentes estándares en cuanto al soporte de funcionalidades para notificaciones push. Por lo tanto, debes diseñar su apariencia y lógica de acuerdo con esto.

En general, una notificación push web puede contener elementos como:

• Título y descripción
• Ícono de la aplicación
• Botón de llamada a la acción
• URL del sitio web

Habilitar Notificaciones Push Web

Para aplicaciones web, puedes usar el fragmento de código proporcionado en la consola de Catalyst para definir la apariencia y la acción de tus notificaciones push mediante tu propia lógica e incorporarlos en el código fuente de tu aplicación. Después de que el código esté configurado, puedes enviar notificaciones push de prueba a las direcciones de correo electrónico de usuarios seleccionados para verificar que funcionan correctamente. Catalyst envía una llamada a la Push API al servicio push para solicitar la entrega de un mensaje push.

El fragmento de código proporcionado por Catalyst para la plataforma web también maneja el proceso de registro de los dispositivos de usuario para recibir notificaciones push de la aplicación. No necesitas registrar los dispositivos de usuario de forma exclusiva. Puedes habilitar las notificaciones push y comenzar a probarlas desde la consola.

Para habilitar las notificaciones push en una aplicación web en Catalyst:

1. Dirígete a Push Notifications desde la sección Cloud Scale en tu proyecto. Haz clic en la pestaña Web.

2. Copia el fragmento de código proporcionado y pégalo en el código fuente de tu aplicación web donde sea necesario.
   

catalyst.notification.enableNotification().then(resp=>{
catalyst.notification.messageHandler = msg => {
                 // escribe tu propia acción
             }
       });

El fragmento de código invoca la función enableNotification() y te permite definir tu propia acción bajo messageHandler. Como se mencionó anteriormente en la sección de Conceptos Clave, puedes manejar la apariencia y el funcionamiento de las notificaciones push en el código de tu aplicación usando tu propia lógica.

Probar Notificaciones Push Web

Después de incorporar y habilitar las notificaciones push en el código de tu aplicación, puedes verificar si funcionan desde la consola. Catalyst te permite enviar una notificación de texto de prueba a una dirección de correo electrónico a la vez desde la consola. Si la cuenta de prueba recibe la notificación exitosamente, puedes estar seguro de que la configuración funciona correctamente.

Para enviar una notificación push de prueba para una aplicación web alojada en Catalyst:

1. Dirígete a Push Notifications desde la sección Cloud Scale en tu proyecto. Haz clic en la pestaña Web.

2. Ingresa el ID de correo electrónico de la cuenta de usuario a la que deseas enviar notificaciones push de prueba y el mensaje en la sección Web.
   

3. Haz clic en Send.

La notificación push se enviará al usuario especificado inmediatamente.

Para que el usuario pueda recibir la notificación, se deben cumplir los siguientes criterios:

1. El usuario debe tener la aplicación web abierta en su navegador. Si el usuario está activo en una pestaña diferente del navegador, aún podrá recibir la notificación push.
2. El navegador en el que la aplicación web está abierta debe ser compatible con web push y service workers.
3. Si has incluido un aviso de permiso en la lógica de tu aplicación para permitir notificaciones push, los usuarios finales deben haber otorgado el permiso.