// config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.example.fingerprintauth" version="1.0.0" xmlns="http://www.w3.org/ns/widgets">
<name>FingerprintAuth</name>
<description>Aplicación de autenticación por huella digital</description>
<author email="dev@example.com" href="http://example.com">
Tu Nombre
</author>
<content src="index.html" />
<plugin name="cordova-plugin-fingerprint-aio" spec="^4.0.0" />
<access origin="*" />
</widget>
// www/index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Autenticación por Huella Digital</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="container">
<h1>Bienvenido</h1>
<button id="authenticateButton">Autenticar con Huella Digital</button>
<p id="status"></p>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
// www/css/style.css
.container {
padding: 20px;
text-align: center;
}
button {
padding: 15px 30px;
font-size: 16px;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 5px;
margin: 20px 0;
cursor: pointer;
}
#status {
margin-top: 20px;
font-weight: bold;
}
// www/js/index.js
document.addEventListener('deviceready', onDeviceReady, false);
function onDeviceReady() {
document.getElementById('authenticateButton').addEventListener('click', authenticate);
// Verificar si el dispositivo soporta la autenticación biométrica
Fingerprint.isAvailable(function(result) {
// result contiene el tipo de biometría disponible
console.log("Tipo de biometría: " + result);
}, function(error) {
console.error("Error al verificar biometría: " + error);
document.getElementById('status').textContent =
"Tu dispositivo no soporta autenticación por huella digital";
});
}
function authenticate() {
Fingerprint.show({
title: 'Autenticación Biométrica', // título opcional
subtitle: 'Por favor, autentícate usando tu huella digital', // subtítulo opcional
description: 'Toca el sensor de huella digital', // descripción opcional
fallbackButtonTitle: 'Usar alternativa', // título del botón alternativo
disableBackup: false // permitir autenticación alternativa
}, successCallback, errorCallback);
}
function successCallback() {
document.getElementById('status').textContent =
"¡Autenticación exitosa!";
// Aquí puedes agregar la lógica para después de una autenticación exitosa
}
function errorCallback(error) {
document.getElementById('status').textContent =
"Error en la autenticación: " + error.message;
}
