{"id":302,"date":"2016-09-21T21:46:47","date_gmt":"2016-09-21T21:46:47","guid":{"rendered":"http:\/\/apuntescreativos.890m.com\/?page_id=302"},"modified":"2023-03-29T22:24:01","modified_gmt":"2023-03-29T22:24:01","slug":"publicacion-phonegap","status":"publish","type":"page","link":"https:\/\/tunjasoporte.890m.com\/index.php\/publicacion-phonegap\/","title":{"rendered":"Publicaci\u00f3n Phonegap"},"content":{"rendered":"<p>A continuaci\u00f3n veremos como nos es posible publicar nuestra app phonegap en la play store de google.<\/p>\n<p>En un comienzo pensaba que resultaba una labor muy dif\u00edcil, pero en realidad, lo \u00fanico que hace falta es haber concluido con \u00e9xito nuestra aplicaci\u00f3n phonegaph.<\/p>\n<p>Para publicar la app se requiere seguir algunos pasos:<\/p>\n<ul>\n<li>Lo primero es firmar la aplicaci\u00f3n. para ello basta tener instalada la maquina virtual de java y generar un certificado autofirmado.<\/li>\n<\/ul>\n<pre>keytool -genkey -v -keystore mifirma.keystore -alias aliasmifrima -keyalg RSA -keysize 2048 -validity 10000<\/pre>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-307 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_002-e1474501514585-1.png\" alt=\"\" width=\"800\" height=\"315\" \/><\/p>\n<p>Para el nombre de la firma podemos colocar el nombre que gustemos, lo importante es mantener el \u00ab.keystore\u00bb. El alias puede ser cualquiera, s\u00f3lo debemos recordarlo y mantenerlo presente. Tendremos que completar la firma con alguna infromaci\u00f3n que nos solicita. Una vez completado el procedimiento se habr\u00e1 generado un archivo \u00ab.keystore\u00bb en el directorio donde actualmente se encuentre la consola de comandos.<\/p>\n<ul>\n<li>\u00a0El siguiente paso es generar el ejecuble \u00ab.apk\u00bb firmado. Para lograrlo, podemos emplear android studio o el sitio web de phonegap build. A continuaci\u00f3n se muestran los pasos adelantados en android estudio.<\/li>\n<\/ul>\n<p>Si la aplicacion ya se encuentra cargada, compilada y funcionando correctamente, utilizamos la opci\u00f3n de men\u00fa \/buid\/Generate Signed APK.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-309 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_001-1.png\" alt=\"\" width=\"447\" height=\"327\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>Ingresamos la informaci\u00f3n que registramos durante el procedimiento de la Firma. Finalmente identificamos el fichero \u00ab.apk\u00bb\u00a0generado.<\/p>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-310 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_0021-1.png\" alt=\"\" width=\"283\" height=\"112\" \/><\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"http:\/\/localhost\/miblog\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_003-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-311\" src=\"http:\/\/localhost\/miblog\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_003-1.png\" alt=\"Selecci\u00f3n_003\" width=\"530\" height=\"307\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<ul>\n<li>Ahora procedemos a la publicaci\u00f3n en el google play. Recordemos que es necesario tener una cuenta de desarrollador\u00a0<a title=\"https:\/\/developer.android.com\/\" href=\"https:\/\/developer.android.com\/\">https:\/\/developer.android.com\/<\/a><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p><iframe loading=\"lazy\" title=\"C\u00f3mo publicar apps en Google Play\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/awHNWA2HBI8?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<p>Fuente: <a title=\"http:\/\/www.phonegapspain.com\/topic\/como-publicar-app-en-google-play-y-apple-store\/\" href=\"http:\/\/www.phonegapspain.com\/topic\/como-publicar-app-en-google-play-y-apple-store\/\">http:\/\/www.phonegapspain.com\/topic\/como-publicar-app-en-google-play-y-apple-store\/<\/a><\/p>\n<p>En caso de actualizaci\u00f3n de la aplicaci\u00f3n es necesario conservar el alias del certificado, ya que hace falta firmar la aplicaci\u00f3n conservando el mismo certificado.<\/p>\n<p>Pasos para actualizar:\u00a0<a href=\"https:\/\/support.google.com\/googleplay\/android-developer\/answer\/7159011\">https:\/\/support.google.com\/googleplay\/android-developer\/answer\/7159011<\/a><\/p>\n<h3>PUBLICACI\u00d3N DE APLICACI\u00d3N IOS<\/h3>\n<p>La publicaci\u00f3n de una app para ios resulta ser algo m\u00e1s complejo, pero espero que este documento sirva de gu\u00eda para realizarlo.<\/p>\n<p>&nbsp;<\/p>\n<p>PASO 1<\/p>\n<p>Mi primer problema fue no tener una computadora mac para poder desarrollar y compilar la aplicaci\u00f3n phonegap. Luego de consultar mucho me puede reducir este requerimiento a un solo paso, y me fue necesario alquilar una mac en macincloud.com.<\/p>\n<p>Una vez se tenga la posibilidad de acceder a la computadora mac, se procede a un \u00fanico procedimiento:<\/p>\n<p>buscar la aplicaci\u00f3n keychain access<\/p>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-346 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_001-2.png\" alt=\"\" width=\"471\" height=\"288\" \/><\/p>\n<p>Seleccionar la opci\u00f3n solicitar un certificado.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-347 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_002-1.png\" alt=\"\" width=\"560\" height=\"221\" \/><\/p>\n<p>Llenar la informaci\u00f3n que se solicita. Se debe tener en cuenta que el valor que se le asigne al campo \u00abCommon Name\u00bb ser\u00e1 el nombre que se mostrar\u00e1 en la appstore como desarrollador.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-348 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_003-2.png\" alt=\"\" width=\"465\" height=\"319\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-349 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_004.png\" alt=\"\" width=\"308\" height=\"121\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-351 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_005-1.png\" alt=\"\" width=\"430\" height=\"307\" \/><\/p>\n<p>El archivo generado guardarlo muy bien, pues sera empleado m\u00e1s adelante. No lo he probado, pero supongo que este archivo podr\u00eda funcionar para firmar futuras aplicaciones por lo que no ser\u00eda necesario volver a acudir a una computadora mac.<\/p>\n<p>&nbsp;<\/p>\n<p>PASO 2<\/p>\n<p>Lo siguiente es obtener una cuenta de desarrollador de apple. No hay remedio!, es necesario pagar los $99 por a\u00f1o si queremos que nuestras app se mantengan en la AppStore.\u00a0Con la cuenta de desarrollador se podran obtener los certificados de seguridad que se requieren para firmar nuestra app.\u00a0<a href=\"https:\/\/developer.apple.com\" target=\"_blank\" rel=\"noopener\">https:\/\/developer.apple.com<\/a>.<\/p>\n<p>El procedimiento en la p\u00e1gina de desarrolladores consta de dos pasos. El primero es el siguiente:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-353 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_001-3.png\" alt=\"\" width=\"270\" height=\"237\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-354 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_002-2.png\" alt=\"\" width=\"312\" height=\"184\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-355 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_003-3.png\" alt=\"\" width=\"787\" height=\"476\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-356 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_004-1.png\" alt=\"\" width=\"559\" height=\"397\" \/><\/p>\n<p>En el siguiente paso es necesario seleccionar el archivo que se gener\u00f3 en el \u00abpaso 1\u00bb desde la computadora mac.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-357 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_005.png\" alt=\"\" width=\"573\" height=\"392\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>Guardamos nuestro segundo archivo. (ojal\u00e1 en el mismo directorio)<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-359 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Captura-de-pantalla-de-2016-11-15-153822.png\" alt=\"\" width=\"643\" height=\"472\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>PASO 3<\/p>\n<p>En la misma p\u00e1gina de desarrolladores crearemos un tercer archivo requerido por phonegap build.<\/p>\n<p>Primero se crear un id de la aplicaci\u00f3n que se desea publicar:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-360 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_001-4.png\" alt=\"\" width=\"750\" height=\"518\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-361 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_002-3.png\" alt=\"\" width=\"593\" height=\"469\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-362 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_003-4.png\" alt=\"\" width=\"554\" height=\"512\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-363 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_004-2.png\" alt=\"\" width=\"579\" height=\"419\" \/><\/p>\n<p>Posteriormente generamos el tercer archivo:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-365 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_001-5.png\" alt=\"\" width=\"771\" height=\"529\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-366 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_006-1.png\" alt=\"\" width=\"569\" height=\"368\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-367 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_007.png\" alt=\"\" width=\"575\" height=\"211\" \/><\/p>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-368 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_008.png\" alt=\"\" width=\"571\" height=\"316\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-369 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_009.png\" alt=\"\" width=\"545\" height=\"346\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-370 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Captura-de-pantalla-de-2016-11-15-161548.png\" alt=\"\" width=\"643\" height=\"472\" \/><\/p>\n<p>Con este \u00faltimo archivo se termina la etapa de la generaci\u00f3n de archivos para la firma de la pagina de desarrollador.<\/p>\n<p>&nbsp;<\/p>\n<p>PASO 4<\/p>\n<p>Es necesario convertir el archivo .pem que obtuvimos a .p12 (siempre la consola ubicada en el directorio donde se encuentran todos los ficheros). Para ello es necesario tener un fichero.key el cual se explico como obtenerlo en el principio de \u00e9ste tutorial.<\/p>\n<pre>openssl x509 -in developer_identity.cer -inform DER -out developer_identity.pem -outform PEM\r\n\r\nopenssl pkcs12 -export -inkey miclave.key -in developer_identity.pem -out iphone_dev.p12<\/pre>\n<p>Una vez se obtenga el fichero .p12 podemos ir a la pagina de phongap build donde compilaremos la app.<\/p>\n<p>Aqu\u00ed s\u00f3lo se tiene que agregar los ficheros obtenidos y compilar.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-371 size-full\" src=\"http:\/\/tunjasoporte.890m.com\/wp-content\/uploads\/2016\/09\/Selecci\u00f3n_001-6.png\" alt=\"\" width=\"561\" height=\"384\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>Fuente: <a href=\"http:\/\/docs.phonegap.com\/phonegap-build\/signing\/ios\/#mac-users\">http:\/\/docs.phonegap.com\/phonegap-build\/signing\/ios\/#mac-users<\/a><\/p>\n<p>Fuente:<a href=\"https:\/\/support.magplus.com\/hc\/en-us\/articles\/203808748-iOS-Creating-a-Distribution-Certificate-and-p12-File\">\u00a0https:\/\/support.magplus.com\/hc\/en-us\/articles\/203808748-iOS-Creating-a-Distribution-Certificate-and-p12-File<\/a><\/p>\n<p>&nbsp;<\/p>\n<p>PASO 5<\/p>\n<p>Queda por hacer lo mas tedioso, publicar la app. Para ello debemos dirigirnos a la pagina https:\/\/itunesconnect.apple.com donde habr\u00e1 que ingresar la informaci\u00f3n solicitada para poder enviar a revision la app.<\/p>\n<p>Fuente:\u00a0https:\/\/www.youtube.com\/watch?v=GQyN9OfC2P4<\/p>\n<p>Pero la app que hemos compilado no es posible cargarla desde la pagina web. Es necesario emplear un mac nuevamente para utilizar la herramienta \u00abapplication\u00a0loader\u00bb. desde ella se podra conectar la plataforma con las credenciales correspondientes y cargar la aplicacion.<\/p>\n<p>Fuente:\u00a0https:\/\/www.youtube.com\/watch?v=tibmAPY-ZRI<\/p>\n<p>Tenga en cuenta que los pantuflazos que solicita la app no se puede generar f\u00e1cilmente. En mi caso fue necesario compilar la aplicaci\u00f3n con el comando de phonegap add platform ios, con ello se genera un proyecto que puede ser editado desde el xcode de macintoch, para as\u00ed poder ejecutar la app en el simulador de mac y obtener los pantallazos adecuados, solo hace falta seleccionar el dispositivo que proporcione las dimensiones de imagen requeridas.<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>OTRAS OPCIONES<\/p>\n<p>el procedimiento para crear la el archivo .p12 y mobile provisional<\/p>\n<p>todo se genr\u00f3 desde la maquina virtual de macos<\/p>\n<p>desde la app keychain access se crea un nuevo cerificado<br \/>\nluego desde la cuenta de desarrollador en apple se generea el certificado .cer y mocile provisional<br \/>\ntal como el tutorial.<\/p>\n<p>despues se nuevamente desde el keychain se carge el .cer generado y se exporta el archivo .p12<\/p>\n<p>luego desde phonegap build se genera el .ipa basandose en el .p12 y mobil.provisional<\/p>\n<p>despues de generarse el ipa, se emplea el application loader del xcode del macos.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A continuaci\u00f3n veremos como nos es posible publicar nuestra app phonegap en la play store de google. En un comienzo pensaba que resultaba una labor muy dif\u00edcil, pero en realidad, lo \u00fanico que hace falta es haber concluido con \u00e9xito nuestra aplicaci\u00f3n phonegaph. Para publicar la app se requiere seguir algunos pasos: Lo primero es [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":{"footnotes":""},"class_list":["post-302","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/pages\/302","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/comments?post=302"}],"version-history":[{"count":9,"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/pages\/302\/revisions"}],"predecessor-version":[{"id":648,"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/pages\/302\/revisions\/648"}],"wp:attachment":[{"href":"https:\/\/tunjasoporte.890m.com\/index.php\/wp-json\/wp\/v2\/media?parent=302"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}