Blog

Cómo enviar notificaciones push desde WordPress a navegadores y teléfonos

· Andrij Tkachenko · 7 min de lectura

Un portátil y un teléfono, cada uno con una tarjeta de notificación, unidos por líneas finas a una nube con una campana

Un miembro de tu sitio recibe un mensaje nuevo, pero cerró la pestaña de tu sitio hace una hora. Puede que un correo le llegue más tarde, perdido entre los boletines. Una notificación push aparece en su ordenador o en su teléfono en cuestión de segundos, incluso con el sitio cerrado, y un clic abre la conversación.

Los navegadores lo permiten desde hace años, y un sitio WordPress también puede aprovecharlo. Este artículo explica cómo funciona el web push, qué lo hace más difícil de lo que parece en WordPress, qué hacer con los iPhone y cómo envía WordPlus Cloud las notificaciones push de un sitio WordPress.

Cómo funciona el web push

El web push tiene tres partes: el navegador, el servicio push de la empresa que lo desarrolla y tu sitio.

  • Permiso, una sola vez. El navegador pregunta al miembro si tu sitio puede mostrarle notificaciones. La decisión queda asociada al sitio, y el miembro puede cambiarla en cualquier momento desde el navegador.
  • Un service worker. Es un pequeño script que el navegador guarda para tu sitio y que arranca por sí solo cuando llega una notificación push, así que esta aparece aunque no haya ninguna página del sitio abierta.
  • Una suscripción. El navegador se registra en su servicio push (el de Google para Chrome, el de Mozilla para Firefox, el de Apple para Safari, etc.) y da a tu sitio una dirección y unas claves para ese navegador concreto. Un miembro con un portátil y un teléfono tiene dos suscripciones.
  • El envío. Tu sitio cifra la notificación con las claves de ese navegador, firma la petición con un par de claves propio y la envía a esa dirección. El servicio push la entrega en cuanto el dispositivo está en línea. No hace falta una cuenta en ningún servicio push.

Por qué es más difícil de lo que parece en WordPress

La parte del navegador es la fácil. Los problemas de un sitio WordPress empiezan con el envío.

  • Cada notificación push se cifra para un solo navegador. Un mensaje a un grupo de 50 miembros, cada uno con un teléfono y un ordenador, supone 100 cifrados por separado y 100 peticiones a los servicios push. En PHP, en un hosting compartido, eso lleva segundos, ya sea dentro de la petición del miembro que envió el mensaje, que tiene que esperar, o en segundo plano.
  • El trabajo en segundo plano espera a las visitas. WordPress ejecuta sus tareas programadas, WP-Cron, cuando alguien abre una página. En una tarde tranquila, una cola de notificaciones push puede esperar minutos hasta el siguiente visitante, y la notificación llega cuando el momento ya ha pasado.
  • WordPress no sabe quién está mirando. Una notificación push debería llegar a los miembros que no están, no aparecer encima de la conversación que alguien está leyendo en ese momento. WordPress solo ve peticiones, así que no puede saber quién tiene el sitio abierto en una pestaña. Para saberlo hace falta una conexión que se mantenga abierta, y, como explicamos en por qué WordPress no puede mantener abierto un websocket, un hosting de WordPress no puede mantenerla.
  • Un service worker por sitio. Un navegador guarda un solo worker por dirección. Dos plugins que instalan cada uno el suyo se sustituyen entre sí, y las notificaciones de uno de ellos dejan de llegar, sin ningún error.
  • Las suscripciones se quedan obsoletas. Los miembros borran los datos del navegador, cambian de dispositivo o desactivan las notificaciones. El servicio push rechaza entonces esa dirección, y un sitio que no la elimina sigue enviando notificaciones que no llegan a nadie.

Los servicios push alojados se encargan del envío, pero normalmente con su propio script en tus páginas, su propio worker y los dispositivos de tus miembros registrados en sus sistemas, no en tu sitio.

iPhone y iPad

Safari en un iPhone o un iPad muestra notificaciones web push solo para un sitio añadido a la pantalla de inicio, a partir de iOS 16.4. En una pestaña normal de Safari no hay notificaciones push en absoluto, y pocos miembros añaden alguna vez un sitio a su pantalla de inicio.

Así que en el iPhone la vía fiable es una app. Una app nativa recibe sus notificaciones push a través del servicio de la propia Apple, y en Android a través del de Google, y una llamada entrante puede sonar como una llamada telefónica, también con la pantalla bloqueada. Por eso un sitio con muchos miembros en el teléfono suele querer las dos cosas: web push para ordenadores y navegadores de Android, y una app para todos los demás.

Cómo envía WordPlus Cloud las notificaciones push de WordPress

WordPlus Cloud for WordPress envía las notificaciones push de los plugins de tu sitio, para que tu hosting nunca tenga que hacerlo. Better Messages lo usa desde el primer momento, para los mensajes nuevos y las llamadas entrantes:

  • Tu sitio nunca envía una notificación push por sí mismo. Cuando un miembro envía un mensaje, Better Messages lo pasa a nuestros servidores en tiempo real junto con las suscripciones de los miembros que puedan necesitar una notificación push. Los servidores cifran y envían cada notificación, así que tu hosting hace una sola petición corta, como con cualquier mensaje, sea cual sea el tamaño del grupo.
  • Solo a los miembros que no están. Los mismos servidores entregan el mensaje a cada página que tiene la conversación abierta, así que saben quién está en el sitio en este momento. Una notificación push va solo a los miembros que no lo están o, si lo eliges, también a los que no han leído el mensaje 5 segundos después.
  • Nada de la conversación en la pantalla de bloqueo. Una notificación de mensaje muestra el nombre de quien lo envía, con su foto, y abre la conversación con un clic. El mensaje en sí se queda en tu sitio, así que nada de él espera en un teléfono bloqueado ni pasa por los servicios push.
  • Una notificación por conversación. Una notificación push más reciente de la misma conversación sustituye a la anterior, así que cinco mensajes seguidos son una sola notificación, no cinco.
  • Se pide una vez, para todo el sitio. WordPress sirve un solo service worker y guarda una sola suscripción por navegador, compartida por todos los plugins de WordPlus del sitio, así que un miembro permite las notificaciones una sola vez. Las suscripciones que un servicio push rechaza se eliminan solas.
  • Todos los navegadores que tienen web push. Chrome, Edge, Firefox y Opera en ordenadores y Android, Safari en un Mac, y Safari en un iPhone o un iPad para un sitio añadido a la pantalla de inicio. Los miembros que no permiten nada de esto siguen recibiendo las notificaciones por correo electrónico.

Activarlo es un solo ajuste en Better Messages, como muestra su documentación de web push. Después, el navegador pregunta a cada miembro en un momento que tiene sentido, cuando abre una conversación por primera vez, no nada más cargar una página.

Tu propia app para iPhone y Android

Para los miembros que usan el teléfono, Better Messages crea tus propias apps para iOS y Android, con el nombre y el icono de tu sitio, listas para publicar en la App Store y Google Play. Sus notificaciones push pasan por Apple y Google, las llamadas entrantes suenan como llamadas telefónicas y los miembros inician sesión con su cuenta de tu sitio. Las compilaciones, las llamadas y las notificaciones push funcionan en WordPlus Cloud y vienen incluidas en la suscripción. Para publicar una app necesitas tus propias cuentas de desarrollador de Apple y Google, y la documentación de la app para iOS recorre cada paso.

Notificaciones push sin un servidor propio

Las notificaciones push vienen con cada suscripción a WordPlus Cloud for WordPress, junto a las actualizaciones en tiempo real, las llamadas, la transmisión en directo y la IA, con un precio por sitio. Tu hosting sigue respondiendo a peticiones, y los miembros se enteran de cada mensaje nuevo estén donde estén.

Descubre WordPlus Cloud for WordPress, o consulta los precios para tu número de sitios.