Algunas Chrome WebApps listas para instalar
En Agosto pasado Google planeaba lanzar la Webstore en Octubre, ya estamos en Noviembre y todavía no se ha lanzado :(.
Sin embargo muchas webapps ya están disponibles fuera de la WebStore, pero muchas de ellas tienen que ser instaladas descargándolas a una carpeta para luego poder recién instarlas arrastrándolas hacia el navegador. Ya que sino mostrará el siguiente error.
Para ello se debe hacer clic derecho, luego guardar en una carpeta cualquiera.
De ahí ubicar el archivo en dicha carpeta y arrastrarla sobre el navegador para soltarlo ahí y finalmente poder instalarlo.
Toda una molestia para algunos, para lo cual he empacado algunas WebApps que encontré y las puse en un sitio que nos permita instalarlo fácilmente.
En la siguiente página encontrarán algunas que logré empacar.
http://demo.codigobit.info/webapps/
Si eres desarrollador y deseas compartir fácilmente tu webapp
La forma correcta es servir tu archivo .crx como tipo x-chrome-extension, que se puede hacer de dos maneras.
La primera y más sencilla es agregando el tipo en el archivo .htaccess de tu hosting (en la carpeta donde se encuentran tus webapps .crx), dentro de .htaccess incluyes lo siguiente y eso bastará:
AddType application/x-chrome-extension .crx
Ahora, sólo poner el enlace directo de descarga será suficiente.
La segunda forma es mediante un script del lado del servidor que permita servir el documento con el encabezado modificado.
Un ejemplo con PHP
1 <?php 2 $filename = "miWebApp.crx"; 3 header("Content-type: application/x-chrome-extension"); 4 header('Content-Disposition: attachment; filename="'.$filename.'"'); 5 readfile(dirname(__FILE__).'/webapps/'.$filename); 6 ?>
Esto permitirá servir la webapp usando el Header modificado.
Pero no todo es tan fácil.
Antes de continuar has de verificar que la aplicación web corresponda a tu dominio (si es una webapp online), del cual has de permitir las descargas, de lo contrario el siguiente error se mostrará.
En otras palabras, si haces una webapp que acceda a otros servicios online en casi su totalidad, no podrá ser instalado desde tu dominio, únicamente del dominio (sitio) donde funcionará.
¿Qué hago entonces?
Una solución no tan profesional es la de engañar al navegador, haciéndole creer que es una aplicación offline.
Para ello hemos de crear un documento index.html o el que sea, pero que el archivo manifest.json que utiliza Chrome para identificar la WebApp luzca algo así:
1 { 2 "name": "Grooveshark", 3 "version": "1", 4 "icons": { "24": "24.png", "128": "128.png" }, 5 "app":{ 6 "browse_urls": [ 7 "http://listen.grooveshark.com/" 8 ], 9 "launch": { 10 "local_path": "index.html" 11 } 12 }, 13 "permissions":["unlimited_storage","notifications"], 14 "web_content": { 15 "enabled": true, 16 "origin": "http://listen.grooveshark.com", 17 "path": ["/#/","/#/search/","/#/search/songs/"] 18 }, 19 "content_scripts": [ { 20 "js": [ 21 "noads.js" 22 ], 23 "matches": [ 24 "*://listen.grooveshark.com/*" 25 ], 26 "run_at": "document_end", 27 "all_frames": true 28 }] 29 } 30
Si se fijan, se lanzará un archivo local, en el ejemplo index.html.
Lo interesante viene a continuación:
1 <html> 2 <head><title>GrooveShark</title></head> 3 <body> 4 <script>window.location.href="http://listen.grooveshark.com/"</script> 5 </body> 6 </html>
Como verán, utilizando javascript, redirigimos a la página de grooveshark, y si notamos más arriba, en el script de manifest.json, ahí le permitimos ir a otra página en browse_urls, y esa página es precisamente a la cual redirigimos.
Además de ello es posible adjuntar un userscript que nos permita hacer lo que deseemos con el sitio al cual hemos de acceder con nuestra webapp. En el ejemplo vemos que en content_scripts hemos adjuntao el archivo noads.js y en ella incluyo el script que quita los anuncios que muestra en Grooveshark :P
1 function noadsongroovesharkfn(){ 2 document.getElementById('sidebar').style.display = 'none'; 3 document.getElementById('mainContentWrapper').style.marginRight = '0px'; 4 } 5 noadsongrooveshark = setInterval("noadsongroovesharkfn()",1000);
Esa sería la manera de poder burlar y así finalmente permitir que nuestras webapps se puedan instalar sin necesidad de estar descargándolo a una carpeta.
Para saber más sobre cómo hacer una webapp aquí mi otro tutorial para ello. Claro está que es mejor irse a la fuente, el sitio oficial de los Chrome Apps –> http://chrome.google.com/webstore
Esperemos que pronto esté disponible la WebStore, y si deseas que agregue una webapp que hiciste y no tienes hosting, gustosamente lo añadiré a la galería.
Entradas
