Notificaciones push con Firebase, OneSignal y Kodular

Las notificaciones push son aquellas que los clientes móviles reciben sin tener que abrir la aplicación. La tecnología en este caso permite que sea un servidor de internet el que inicie la comunicación con el celular o la tablet sin que el usuario tenga que establecerla a través del inicio manual de la propia app. Son muy útiles ya que permiten el intercambio de mensajes inmediato entre los creadores de la app y las personas que la tienen instalada informando de nuevas versiones, actualizaciones, productos nuevos o cualquier otro dato de interés para el usuario.

En este tutorial vamos a realizar una sencilla prueba de concepto de cómo podemos enviar notificaciones push a todos aquellos usuarios que tengan nuestra app instalada en sus dispositivos. Para conseguirlo utilizaremos Firebase, el servicio de OneSignal y el constructor de aplicaciones basado en MIT App Inventor de nombre Kodular(antes conocido como Makeroid).

Comenzando con Firebase

Firebase, cuya utilidad ya la vimos en otros artículos, es la encargada de gestionar la base de datos en tiempo real.


Si aún no tenemos creada una cuenta en Firebase nos la crearemos, podemos usar la propia cuenta de Google que dispongamos e iremos a la consola.

Añadiremos un nuevo proyecto con nombre, por ejemplo, “Push”:

 

Vista consola Clave Servidor e ID remitente en Firebase

Una nueva pantalla con la consola de administración del proyecto aparecerá y de ésta a través de Project Overview, Configuración del Proyecto(pestaña Mensajería en la nube), obtendremos la información que posteriormente necesitaremos en OneSignal: la denominada “Clave del Servidor” (“Firebase Server Key”) y clave del remitente(“Firebase Sender ID”).

 

OneSignal

Accedemos al servicio OneSignal (https://onesignal.com/) con nuestra cuenta de Gmail y lo conectaremos con Firebase; de nuevo tendremos que aceptar los términos del servicio, crear una nueva app, de nuevo usaremos el nombre “Push” para no liarnos, y copiaremos los valores que obtuvimos de la página de Firebase.

 

Pulsaremos sobre el botón de guardar(“Save”), cerraremos la siguiente ventana ya que no vamos a usar propiamente un SDK haciendo clic en la esquina superior derecha y diciéndole “Leave Setup”.

Un Dashboard de las estadísticas de las notificaciones de nuestro proyecto aparecerá, en principio y lógicamente totalmente vacío :-)

Nuestra app con Kodular

Para hacer nuestra app usaremos el creador de aplicaciones Kodular que dispone de un componente experimental para notificaciones push.

Accederemos con nuestra cuenta de Gmail y crearemos un nuevo proyecto de nombre "Push".

Para configurar correctamente el componente tendremos que volver a OneSignal, Settings y accederemos a la pestaña sobre “Keys & IDs” donde encontraremos el valor de “OneSignal App ID”; un identificador que haciendo clic en Kodular sobre el componente Push deberemos copiar en la propiedad correspondiente.

En la pantalla de bloques gestionaremos el evento de Screen1 inicializar para comprobar si el dispositivo tiene no tiene una suscripción activada se suscriba al servicio de OneSignal para poder recibir notificaciones y en cualquier caso, esas mismas notificaciones puedan sonar y realizar una vibración en el dispositivo.
Instalaremos la app en nuestro dispositivo mediante el menú Export y tan sólo nos quedará hacer la prueba del envío de mensajes desde OneSignal para verificar que todo funciona correctamente.

Probando que funciona la app

Al iniciar la app en el teléfono o tablet, el código de la misma hará que si nuestro dispositivo no está suscrito al servicio, primer inicio, se suscriba para poder recibir mensajes, se activará el sonido y la vibración.
Podemos verificar que se ha suscrito en esta pantalla de OneSignal.

Enviando una notificación Push

Desde la pestaña Messages podremos crear una nueva notificación que será enviada a los usuarios suscritos.
Las opciones para las notificaciones son realmente amplias pudiendo incluso programarlas o usar plantillas.
Una vez enviada podremos consultar el reparto de las mismas a través de la pestaña Delivery lo cual no deja de ser muy útil cuando queremos saber estadísticas de envíos en tiempo real de las notificaciones.

...y eso es todo!!!

Espero que os sea útil este tutorial para que podáis incluir esta interesante opción en vuestras apps.
 

Saludos y happy inventing!!!

 

Jose Luis Núñez

@twajoseluis

 

IMPORTANTE: Dispositivos con la últimas versiones de Android 8 podrían mostrar un mensaje de error al iniciar; es un fallo conocido que el equipo de Makeroid solucionará en la próxima versión (¡¡acordaros que el componente es experimental!!)