Firmar el apk para subirlo a Google Play

En el siguiente enlace tienes el índice para acceder al resto de entradas de este tutorial:

 

¡¡Atención!! este tutorial se basa en ionic 3 y está desactualizado por lo que es posible que los ejemplos no funcionen en la última versión de ionic, haz click aquí para acceder a un tutorial mas actual de Ionic.

Hola a todos,

Como el título del post indica hoy vamos a ver cómo generar un archivo .apk firmado para poder subirlo a google play.

Este es el último paso que debemos dar una vez tenemos desarrollada y lista nuestra aplicación para poder subirla a la tienda de aplicaciones de Google.

Android exige que todos los APK se firmen digitalmente con un certificado para poder instalarse.

Cuando firmas un APK se adjunta a este el certificado de clave pública que asocia el APK contigo y con tu clave privada correspondiente. Esto es necesario para poder lanzar cualquier actualización de la app asegurándose que provenga del autor original, por eso es importantísimo que guardemos el archivo keystore generado a buen recaudo para poder lanzar futuras actualizaciones ya que todas las aplicaciones deben usar el mismo certificado durante su vida útil.

Un keystore es un campo binario que contiene una o más claves privadas.

Si desarrollas una app nativa puedes generar el keystore firmar el apk desde Android studio, nosotros vamos a ver como firmar una aplicación   generada desde ionic o apache cordova desde consola.

Para poder firmar el apk desde consola debemos seguir una serie de pasos que vamos a ver a continuación:

Lo primero que necesitamos es generar  el keystore:

Si por ejemplo nuestra app se llama miapp para generar un keystore  abrimos  una terminal, nos situamos en la carpeta de nuestro proyecto y escribimos el siguiente comando:

keytool -genkey -v -keystore miapp.keystore -alias miapp -keyalg RSA -keysize 2048 -validity 10000

miapp.keystore es el archivo que se va a generar, el alias es un nombre de identificación para tu clave, en este caso le hemos llamado miapp.

Con keysize le indicamos que el tamaño de la clave sea de 2048 bits, es recomendavle dejarlo en este valor.

Por último con -validity fijamos el período de validez de tu clave en años, creo que  con 10000 años será suficiente ;-P.

Al ejecutar el comando nos pide que introduzcamos una serie de datos:

Introduzca la contraseña del almacén de claves: 

Volver a escribir la contraseña nueva: 

¿Cuáles son su nombre y su apellido?

¿Cuál es el nombre de su unidad de organización?

¿Cuál es el nombre de su organización?

¿Cuál es el nombre de su ciudad o localidad?

¿Cuál es el nombre de su estado o provincia?

¿Cuál es el código de país de dos letras de la unidad?

Te pide dos veces la contraseña, es importante que recuerdes la contraseña que has introducido ya que la necesitarás después.

Al final te muestra los datos que has introducido y te pide confirmación, le decimos que si:

¿Es correcto CN=Eduardo, OU=Revilla, O=revigames, L=Abadiño, ST=Bizkaia, C=ES?

  [no]:  Si

Lo que os sale debe ser algo parecido a la siguiente imagen:

Bien, con esto ya hemos generado un archivo llamado miapp.keystore en la raiz de nuestro proyecto.

Ahora vamos a crear un nuevo archivo en la raiz del proyecto llamado build.json, lo creamos con nuestro editor de código y dentro escribimos el siguiente código:

{
     "android": {
         "debug": {
             "keystore": "miapp.keystore",
             "storePassword": "XXXXX",
             "alias": miapp",
             "password" : "XXXX",
             "keystoreType": ""
         },
         "release": {
             "keystore": "miapp.keystore",
             "storePassword": "XXXX",
             "alias": "miapp",
             "password" : "XXXX",
             "keystoreType": ""
         }
     }
 }

El primero es para la versión de debug y “release” es para la versión final que vas a subir a la play store.

En el campo keystore debes poner la ruta del archivo .keystore que acabamos de generar, si lo has generado en la raíz solo debes de poner el nombre del archivo, en este caso miapp.keystore.

En alias ponemos el alias que hemos puesto al crear el archivo

Después en storePassword debe poner la contraseña del almacén de claves que indicaste al crear el archivo.

En password debemos poner la contraseña.

Guardamos el archivo y ya solo nos queda generar el apk firmado con el siguiente comando:

ionic cordova build android --release

Si no ha detectado errores y se ha compilado bien podrás encontrar el apk firmado que debes subir a play store en la siguiente ruta dentro de tu aplicación:

/platforms/android/build/outputs/apk/android-release.apk

Eso es todo por hoy, espero que os haya sido de utilidad y ver vuestras apps triunfando en la play store pronto ;-).

Aprovecho para deciros que si has creado alguna app con ionic y la tienes en la play store puedes compartirlo en los comentarios, así servirá como inspiración para que otras personas puedan ver lo que se puede crear con ionic y al mismo tiempo seguro que ganáis alguna descarga extra que siempre viene bien 😉

 

Si necesitas desarrollar una aplicación móvil no dudes en solicitarme un presupuesto sin compromiso:

Un saludo, y si aún no lo has hecho no olvides suscribirte a mi blog para no perderte los próximos posts  :-),

También puedes seguirme en Twitter en ‎@revigames y no olvides que me ayudas mucho si compartes este post en las redes sociales.

11 comentarios en “Firmar el apk para subirlo a Google Play

  1. Buenas tardes Eduardo,se que no tiene nada que ver con el post pero esto desesperado.

    mira tengo un detalle quiero jalar datos de una tabla en firebase y al momento de igualar el valor que me arroja pero muestra el siguiente error “cannon set property ‘menu’ of null” este es el codigo que utilizo

    this.ofDB.database.ref(“Productos”).orderByChild(“Local”).equalTo(this.local).on(“child_added”, function(snapshot){

    console.log(snapshot.val());
    this.menu=snapshot.val();

    });

    1. Hola Gamster12, Utiliza una función flecha en lugar de una función común.
      Las funciones flecha las expliqué en este post: https://reviblog.net/2017/03/07/tutorial-de-ionic-2-crear-una-aplicacion-para-guardar-nuestros-sitios-geolocalizados-parte-2-mostrando-el-mapa/
      Y permiten utilizar this en el contexto actual.

      Es decir, en lugar de:
      this.ofDB.database.ref(“Productos”).orderByChild(“Local”).equalTo(this.local).on(“child_added”, function(snapshot){

      console.log(snapshot.val());
      this.menu=snapshot.val();

      });

      utiliza esto:

      this.ofDB.database.ref(“Productos”).orderByChild(“Local”).equalTo(this.local).on(“child_added”, (snapshot)=>{

      console.log(snapshot.val());
      this.menu=snapshot.val();

      });

      Espero que te funcione.

      Un saludo

  2. En parte si funciono, pero solo pe mostro un valor, cambie el tipo de variable,
    declare la variable de esta forma menu:any={};
    pero me arrojo el siguiente error “cannon read property ‘Nombre’ of undefined”

    nota:quiero que muestre tantos valores como tengan el mismo valor que la variable local,
    gracias por contestar

    Saludos

  3. hola Eduardo:

    ya lo resolví, muchas gracias me ayudo bastante coloque un splice para agregar el valor de mi variable menú a otra variable y así logre que mostrara todos los datos,

    te lo agradezco mucho

    saludos

  4. Hola, primero que todo muchas gracias por estos tutoriales tan detallados, he estado siguiéndolos y para la aplicación de guardar sitios he intentado agregar una función de buscar () pero no sé que debe ir en el .ts

    posdata. también compré el libro 🙂

    1. Hola Alejandra,

      Antes de nada muchas gracias por el apoyo y por comprar el Libro :).

      Puedes poner un buscador en el listado añadiendo esto a listado.html en ion-header justo despues de cerrar ion-navbar:

      <ion-searchbar (ionInput)=”buscar($event)”
      placeholder=”Buscar”></ion-searchbar>

      Y después en listado.ts primero defines otra variable de clase que se llame
      sitiosInitial y cuando obtienes los sitios bien desde la base de datos local o desde firebase la igualas a this.sitios es decir this.sitiosInitial = this.sitios;
      y después añade esta función que se ejecutara cada vez que escribas en el buscador:

      buscar(ev) {

      let q : any;
      // reseteamos los sitios para que inicialmente contengan toda la lista

      this.sitios = this.sitiosInitial;

      // guardamos en q lo que hemos escrito en searchbar

      q = ev.target.value || ev || ”;

      // si esta vacío no filtramos
      if (q!=” && q.trim() == ”) {
      return;
      }

      // con la función filter obtenemos en this.sitios solo aquellos que coincidan con la búsqueda
      this.sitios = this.sitios.filter((v) => {
      if (v.description.toLowerCase().indexOf(q.toLowerCase()) > -1) {
      return true;
      }
      return false;
      })
      }

      En este ejemplo filtramos por el campo description, pero puedes cambiar el if para filtrar por otros campos

      Espero que se sea de utilidad.

      Un saludo

  5. Hola Eduardo,

    ¡Excelente post!. Hace meses que sigo este blog y la verdad me ha ayudado mucho en el aprendizaje de Ionic, y a realizar mi primera app. La casualidad de que justo cuando termino de desarrollar la versión de android posteas esta entrada que me ha resuelto todas las dudas 🙂

    Así que te tomo la palabra y dejo el enlace de la aplicación LanzaroteDigital, la cual se trata de una app de noticias de Lanzarote.

    https://play.google.com/store/apps/details?id=com.lanzarotedigital&hl=es

    También aprovecho para abrir un debate, sobre las progressive web apps (PWA) ¿Crees que Ionic es una buena herramienta para ello? Así el código de esta app, podría sustituir por ejemplo a la del actual página de http://www.lanzarotedigital.com ?

    ¡Espero que les guste! Y muchas gracias de nuevo.

    1. Hola writ3r:

      ¡Enhorabuena por la app!, si duda es un excelente ejemplo de lo que se puede conseguir con con ionic. La app es muy completa y funciona muy bien, es una gran App si quieres estar al día de lo que sucede en Lanzarote.
      Si alguien vive en la zona o tiene pensado viajar a Canarias sin duda es una app imprescindible.
      En cuanto a las progressive web apps creo que aún están en una fase temprana pero no cabe duda que es una tendencia creciente y cada vez veremos más.
      Son muy interesantes las ventajas que ofrece, ionic puede ser una opción muy valida para desarrollar progressive web apps, aunque reconozco que todavía no he utilizado ionic para desarrollar ninguna PWA he leído algo de información al respecto.
      En el momento que haga alguna prueba con ionic para desarrollar alguna PWA lo compartiré en el blog.
      Si algún lector tiene ya experiencia desarrollando PWA con ionic sería interesante que dejase un comentario con su opinión.

      Un saludo

  6. hola eduardo.

    se que para generar una apk se necesita el sdk, y para el ios necesito tener una mac y el xcode, pero no se que necesito para poder instalar mi aplicacion en un dispositivo movil con sistema operativo windows phone

    espero puedas ayudarme, saludos y que tengas buen dia

  7. Hola, Eduardo, antes de nada muchas gracias por el post, gracias a el he podido firmar y subir mi app creada con ionic a play store de Google.

    Por otro lado, tal y como aconsejas aquí tenéis el enlace del google paly a mi app.

    AlchemyVapp
    https://play.google.com/store/apps/details?id=pnpk.alchemy.vapp

    Yo he creado una aplicación para hacer los cálculos de las cantidades de líquidos que harían falta para hacer las recetas de vapeo, esto es, para la gente que vapea y se mezcla sus propios líquidos.

    Me idea es ir mejorándola para poder compartir recetas he incluso hacer votaciones de las que cada uno sube, etc…

    Empecé a hacerla sólo para ver hasta donde se podía llegar con córdova, y acabé pasándome a ionic, porque vi que me prestaba mucho trabajo ya hecho…

Deja una respuesta

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

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.