Ver el código fuente de una aplicación híbrida es muy fácil, basta con abrir el .apk de la aplicación con winrar y tenemos todo el código original. Así que minificar y ofuscar el código antes de subirlo a una tienda de aplicaciones es una buena idea, se puede seguir accediendo al código igualmente, pero ya tienen que tomarse mas molestias para poder leerlo.
Esto se puede aplicar a cualquier proyecto que funcione sobre Cordova, ya sea PhoneGap o Ionic Framework
Vamos a crear un hook que se ejecute antes de compilar la aplicación, que será el encargado de hacer todo este proceso automáticamente cada vez que lancemos o compilemos la aplicación. Dentro del directorio principal de nuestro proyecto tenemos que tener una carpeta llamada “hooks“, vamos a crear el siguiente fichero: “hooks/before_prepare/02_jshint.js”
Nota: En Linux y Mac es necesario dar permisos de ejecución a este archivo.
Dentro de 02_jshint.js vamos a meter el siguiente código:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 |
#!/usr/bin/env node var fs = require('fs'); var path = require('path'); var jshint = require('jshint').JSHINT; var async = require('async'); var foldersToProcess = [ 'js' ]; foldersToProcess.forEach(function(folder) { processFiles("www/" + folder); }); function processFiles(dir, callback) { var errorCount = 0; fs.readdir(dir, function(err, list) { if (err) { console.log('processFiles err: ' + err); return; } async.eachSeries(list, function(file, innercallback) { file = dir + '/' + file; fs.stat(file, function(err, stat) { if(!stat.isDirectory()) { if(path.extname(file) === ".js") { lintFile(file, function(hasError) { if(hasError) { errorCount++; } innercallback(); }); } else { innercallback(); } } else { innercallback(); } }); }, function(error) { if(errorCount > 0) { process.exit(1); } }); }); } function lintFile(file, callback) { console.log("Linting " + file); fs.readFile(file, function(err, data) { if(err) { console.log('Error: ' + err); return; } if(jshint(data.toString())) { console.log('File ' + file + ' has no errors.'); console.log('-----------------------------------------'); callback(false); } else { console.log('Errors in file ' + file); var out = jshint.data(), errors = out.errors; for(var j = 0; j < errors.length; j++) { console.log(errors[j].line + ':' + errors[j].character + ' -> ' + errors[j].reason + ' -> ' + errors[j].evidence); } console.log('-----------------------------------------'); callback(true); } }); } |
Este script solo se va a ejecutar sobre www/js, puedes cambiarlo para agregar mas carpetas si lo necesitas. Cualquier error que se encuentre sobre los ficheros .js se va a mostrar por pantalla y el script detendrá cualquier acción posterior, por lo que la aplicación no se ejecutará con errores.
El fichero 02_jshint.js necesita dos librerias NodeJS para funcionar, desde la raíz del proyecto ejecutamos:
|
1 2 |
npm install jshint npm install async |
Ofuscar el código para hacerlo mas ilegible
Vamos a usar otro modulo NodeJS:
|
1 |
npm install cordova-uglify |
Cuando termine la instalación verás que se a creado el fichero hooks/after_prepare/uglify.js, de nuevo en Linux y Mac es necesario dar permisos de ejecución a este fichero.
Se puede probar que el script funciona correctamente con cordova prepare o cordova build [platform]
Fuente: http://ionicframework.com/blog/minifying-your-source-code/
Pingback: Publicar aplicación híbrida Cordova - JosmanTek - Blog de Desarrollo()