Protege tu aplicación con Touch ID

Añade un nivel más de seguridad utilizando Touch ID para proteger el contenido tu aplicación

Àlex Masnou
Blog de Interactius UX
3 min readOct 11, 2016

--

postbloc

La seguridad de una aplicación puede llegar a ser un aspecto muy importante según el ámbito y el objetivo con el que se utilice. Los métodos tradicionales basados en contraseñas nos ofrecen una capa de seguridad que puede verse fácilmente comprometida, y que requieren un cierto mantenimiento para evitar accesos indeseados (renovación periódica de contraseñas, uso de contraseñas seguras, gestión de contraseñas olvidadas…).

Por suerte, los avances tecnológicos nos han proporcionado alternativas a las contraseñas mediante el uso de sistemas biométricos. Algunos ejemplos son el reconocimiento de huella dactilar, que se ha extendido rápidamente entre los smartphones, e incluso sistemas de reconocimiento de Iris como el que por ejemplo ha implementado el Galaxy Note 7 de Samsung (¡Cuidado que explota!). Estas tecnologías nos brindan un nivel más de seguridad que puede implementarse fácilmente en las aplicaciones que desarrollemos.

En esta entrada explicaremos como dotar a nuestra aplicación de Cordova de un sistema de autenticación con Touch ID.

¿Qué es Touch ID?

Touch ID es un sistema de reconocimiento por huella dactilar desarrollado por Apple e incorporado por primera vez en el iPhone 5s. Permite desbloquear el dispositivo, realizar compras en las tiendas de la plataforma iOS, así como utilizar el sistema de pagos Apple Pay sin depender de contraseñas. También se puede utilizar Touch ID para proteger ciertas funcionalidades de nuestra aplicación. A raíz de la salida del iPhone 5S, las grandes marcas de teléfonos inteligentes del mercado han incorporado sistemas similares y, hoy en día, es prácticamente imposible encontrar un teléfono ‘tope de gama’ sin esta funcionalidad.

Añadiendo la librería a nuestro proyecto de Cordova

Para poder utilizar Touch ID en nuestra aplicación necesitaremos añadir el siguiente plugin mediante la CLI:

cordova plugin add https://github.com/EddyVerbruggen/cordova-plugin-touch-id

Seguidamente, nos dirigimos al directorio raíz de nuestro proyecto Cordova y añadimos las siguientes líneas al final del fichero config.xml:

<feature name="TouchID">
<param name="ios-package" value="TouchID" />
</feature>

Utilizando Touch ID en nuestra aplicación

El plugin que hemos instalado dispone de diversas funciones JS para el control de Touch ID. Lo primero que debemos verificar es que el dispositivo en el que se ejecuta la aplicación dispone de esta funcionalidad. Para ello utilizaremos la siguiente función, una vez el dispositivo se haya iniciado:

document.addEventListener('deviceready', onDeviceReady, false);function onDeviceReady() {
window.plugins.touchid.isAvailable(touchIdAvailable, touchIdNoAvailable);
}
function touchIdAvailable() {
alert('¡Funciona!');
}

En el caso de que nuestro dispositivo disponga de Touch ID, el siguiente paso es lanzar el popup de autenticación. Para ello, el plugin nos proporciona el siguiente método:

function startTouchId(){
window.plugins.touchid.verifyFingerprintWithCustomPasswordFallback(
'Por favor, escanea tu huella',
fingerPrintSuccess,
fingerPrintError
);
}

El método verifyFingerprintWithCustomPasswordFallback nos permitirá, cuando la autenticación biométrica falle, ofrecer la posibilidad de introducir una contraseña numérica para realizar la autenticación. Si, en cambio, queremos que la contraseña no sea sólo numérica, podemos substituir el método anterior por verifyFingerprint.

Si la autenticación resulta correcta, podremos lanzar cualquier acción en el sistema. Por ejemplo, para esta Demo, la acción será mostrar un contenedor que inicialmente estaba oculto:

function fingerPrintSuccess() {
document.getElementById("touchid-status").style.display = "block";
}

Por supuesto, podemos lanzar el popup de autenticación haciendo clic en un botón o realizando cualquier otra acción. De este modo, únicamente deberemos llamar al método de autenticación al que hemos llamado anteriormente. Esto nos puede resultar útil para proteger ciertas partes de nuestra aplicación.

Conclusiones

La evolución de los sistemas de seguridad nos esta llevando a un mundo con cada vez menos contraseñas. El uso de sistemas biométricos como Touch ID nos permite añadir una capa más de seguridad a nuestra aplicación de una forma muy sencilla. Por supuesto, este tutorial puede ser reproducido de forma similar en Android, pero utilizando un plugin distinto que sea compatible con dicho SO (Sistema Operativo).

Si quieres, también puedes consultar los ficheros utilizados en este tutorial.

--

--