Notificaciones Push en Android. Parte 2. Instalación y uso de Push Plugin en phonegap.

Este tutorial está desactualizado y el plugin que usa está deprecado. Recomiendo que lean este nuevo tutorial Notificaciones Push Phonegap. Parte 2. Instalación y uso del phonegap-plugin-push en la aplicación.

 

Nota: este tutorial ha sido elaborado en su mayor parte por Eloy Fernández, basandose en el tutorial en inglés de Holly Schinsky

Pre requisitos:

Para poder seguir este tutorial deberemos tener instalado phonegap en una versión 3.X.X, asi como nodeJS, git, ant, el JDK java y el SDK android y sus rutas añadidas al PATH, en caso de duda consultar tutoriales anteriores.
También es importante haber seguido la parte 1 del tutorial en la que obtuvimos el Google Cloud Messaging Project ID

Empezamos:

Paso 1: Crear el proyecto y configurarlo.

-Para la creación básica de un proyecto con phonegap para Android hacemos:

phonegap create PushNotificationSample com.pushapp PushNotificationApp

-Entramos dentro de la nueva carpeta creada

cd PushNotificationSample

-Constrimos el proyecto para Android

phonegap local build android

-Instalamos el PushPlugin desde su localización en el github:

phonegap local plugin add https://github.com/phonegap-build/PushPlugin

Paso 2: Registrar la aplicación con el servicio Google Cloud Messaging.

– Abrimos el archivo de nuestra aplicación www/js/index.js y en la función receivedEvent pegamos las siguientes dos líneas de script:

[javascript]var pushNotification = window.plugins.pushNotification;
pushNotification.register(app.successHandler, app.errorHandler,{“senderID”:”XXXXXXXXXXXX”,”ecb”:”app.onNotificationGCM”});[/javascript]

donde el senderID será el Google Cloud Messaging Project ID que obtuvimos en la parte 1 del tutorial

-El siguiente código hace referencia a las funciones de callback referenciadas en la anterior llamada de registro:
1- Llamada successHandler “todo correcto”:
[javascript]successHandler: function(result) {
alert(‘Todo Correcto! Resultado = ‘+result)
},[/javascript]
2-Llamada errorHandler de error:
[javascript]errorHandler:function(error) {
alert(error);
},[/javascript]
3-Llamada que se producirá cuando el mensaje sea recivido del GCM, pero también al inicio de la aplicación:
[javascript]
onNotificationGCM: function(e) {
switch( e.event ) {
case ‘registered’:
if ( e.regid.length > 0 ) {
console.log(“Id registro: ” + e.regid);
alert(‘Id registro:  ‘+e.regid);
}
break;
case ‘message’:
alert(‘Mensaje:  ‘+e.message+’ Contenido: ‘+e.msgcnt);
break;
case ‘error’:
alert(‘GCM error = ‘+e.msg);
break;
default:
alert(‘Ocurrió un evento desconocido de GCM’);
break;
}
}[/javascript]

Paso 3: Ejecutar la aplicación:

-Tan simple como escribir dentro de la carpeta de la aplicación:

phonegap local run android

-Si todo ha salido bien, en este momento te saldrán dos alertas:

1- Generada por la función succesHandler que dirá que todo está correcto.

2- Generada por onNotificationGCM respecto al case registered con el código de registro del dispositivo (e.regid)
Nos guardamos ese código, pero como copiar a mano todo el texto es imposible lo que podemos hacer es tener abierto el LogCat, bien desde el IDE eclipse, o desde la app “Monitor” que viene con el SDK android
Si usais eclipse y no os sale la pestaña de LogCat, podéis hacerla aparecer en Window->Show View->Other, y buscarla con el filtro, poniendo solamente log será suficiente para encontrarla.

Una vez que haya aparecido la alerta en la aplicación, podéis buscar en el LogCat poniendo en el buscador de mensajes de logs la frase “Id registro:”, la copíáis. Puede ser que no llegue a aparecer la alerta en el dispositivo que muestre este código de registro, aún así, si buscamos en los logs del  LogCat, porque es posible que la encontremos igualmente. Cuando lo tengamos ya podrémos pasar a la parte 3 del tutorial.

Al finalizar el tutorial, nuestro index.js debería quedar tal que asi

 

5 comentarios en “Notificaciones Push en Android. Parte 2. Instalación y uso de Push Plugin en phonegap.

  1. Hola,
    Tengo desarrollada una aplicacion con phonegapbuild, quiero meter el tema de notificaciones push.
    He seguido los pasos indicados aquí, pero a la hora de ejecutar la aplicación en un dispositivo, no me aparecen los alert que deben aparecer. La versión utilizada es cordova 3.5.1.
    Por más vueltas que he dado y buscado en otros tutoriales no damos con el error.
    Le agracería mucho su ayuda. Gracias.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *