Enviar notificaciones push a subconjuntos de usuarios de tu app

Actualizado el 16. septiembre 2022 por Jan Bunk


The features described on this page require the push notifications addon. Please contact us if it's not enabled for your app yet.
Puedes utilizar esta función con Zapier para automatizar tus tareas. Conoce más sobre nuestra integración con Zapier.

El concepto básico de cómo puedes enviar notificaciones push a un grupo de usuarios de tu app es el siguiente:

  1. El usuario John abre tu app (para este ejemplo supondremos que es una app de compras).
  2. John realiza una acción que le hace formar parte de tu grupo objetivo, por ejemplo, pulsar un botón para suscribirse a notificaciones sobre descuentos en utensilios de cocina. La acción también podría ser simplemente navegar por la sección de utensilios de cocina de tu app, lo que podría significar que John está interesado en productos para su cocina.
  3. Tu sitio web llama a la función javascript "setNotificationTopicSubscriptionStatus" con el nombre del tema al que quieres suscribir a John, por ejemplo "cocina".
  4. Después puedes enviar una notificación a John y a todos los demás usuarios que estén suscritos a este tema. Por ejemplo, si tienes un código de descuento en artículos de cocina, puedes enviar una notificación a todos los suscritos al tema "cocina" para informarles del descuento.

Funciones de Javascript disponibles

Quizá quieras consultar la función executeWhenAppReady() de nuestro script de ayuda a la aplicación. Asegura que tu sitio web no intente interactuar con la aplicación antes de que esté lista o cuando tu sitio web se cargue utilizando un navegador normal.

Cuando quieras suscribir una instancia de la app a un tema de notificaciones push, solo tienes que llamar a la función setNotificationTopicSubscriptionStatus con el nuevo estado de suscripción (true = suscrito, false = no suscrito) y el nombre del tema que desees.


<script>
    try {
        await setNotificationTopicSubscriptionStatus(true, "mytopic");
    }
    catch (e) {
        // Can occur if:
        // - you passed an invalid topic name.
        // - you didn't pass all necessary parameters to setNotificationTopicSubscriptionStatus().
        // - the app couldn't subscribe to the topic, for example because of connection issues. Should be very unlikely.
        // - the app couldn't connect to the native code. Should be very unlikely.
        // - push notifications are not enabled for your app
        console.log(e);
    }
</script>
    

Cosas a tener en cuenta:

  • El tema debe coincidir con la siguiente regex: [a-zA-Z0-9-_.~%]{1,850}
  • Aunque es poco probable, la suscripción podría fallar, así que asegúrate de detectar posibles errores.

También es posible que más adelante quieras obtener una lista de temas a los que está suscrita la instancia de la app. El valor de retorno es una lista de cadenas.


<script>
    try {
        var topics = (await getSubscribedNotificationTopics())["topics"];
    }
    catch (e) {
        // Can occur if:
        // - the app couldn't connect to the native code. Should be very unlikely.
        // - push notifications are not enabled for your app
        console.log(e);
    }
</script>
    

También puedes consultar un ejemplo de código más completo. Este es el código de un botón que suscribe/desuscribe al usuario a/de la categoría de la página actual en un sitio web de WordPress.

Capturas de pantalla

Dentro de los ajustes de la aplicación, también hay una forma de que tus usuarios se den de baja de los temas de notificación.

Una captura de pantalla del menú de configuración de la aplicación.
Una captura de pantalla del menú de configuración de la aplicación.
Una captura de pantalla del diálogo que permite darse de baja de los temas de las notificaciones push.
Una captura de pantalla del diálogo que permite darse de baja de los temas de las notificaciones push.

Enviar una notificación de tema a través de la API de webtoapp.design

Obtenga la clave API específica de tu aplicación en el tablero de mandos de la app.

Envíe su clave de API como una consulta en la URL y el cuerpo de la solicitud en formato JSON.