Refactor/dc rf2 refactorizar y corregir

[DanielContrerasCh]

Solicitud de cambio (PR)

Corregir defectos encontrados en pruebas

Descripción detallada

Se refactorizó el código, se añadieron sanitizaciones a las entradas y se agregó la funcionalidad para mandar las entradas presionando 'enter'

Tipo de cambio

• Nueva funcionalidad (Un cambio que agrega una funcionalidad)
• Corrección de errores (Un cambio que arregla un problema)
• Hotfix (Una correción urgente que será revisada posteriormente)
• Refactorización (Reorganización o mejora del código sin cambiar su funcionalidad)

Checklist del autor:

• He determinado que los cambios no tienen un impacto negativo en la aplicación
• La historia de usuario cumple con los requisitos de Done
• El código sigue el estándar de codificación y cumple con la checklist de desarrollo
• He actualizado los productos relacionados a la historia de usuario y lo cambiaré a "Terminado" una vez que se haga la fusión
• Alguien más está asignado como evaluador (tester/reviewer)

Checklist del evaluador:

• He determinado que los cambios no tienen un impacto negativo en la aplicación
• He notificado al autor del PR en caso de dudas o ajustes necesarios
• Una vez que acepte el PR, eliminaré la rama

[DanielQueijeiro]

aprobao

[black4ninja]

Análisis del Pull Request - Mejora de Seguridad en Inicio de Sesión
Evaluación General
Este PR implementa importantes mejoras de seguridad en el proceso de inicio de sesión de la aplicación Harvester, incluyendo sanitización de entradas, validación mejorada y mejor manejo de errores. Incluye:

Integración de la biblioteca validator para sanitización de datos
Implementación de una validación de correo electrónico más robusta
Mejora en el manejo de eventos y experiencia de usuario
Refactorización del código para mayor mantenibilidad y seguridad

Aspectos Positivos

Seguridad Mejorada

Implementación de sanitización de entradas con la biblioteca validator
Validación de correo electrónico más estricta con una expresión regular completa
Prevención de inyecciones mediante escape de caracteres especiales en contraseñas

Mejor Manejo de Errores

Mensajes de error específicos para diferentes situaciones
Estructura try/catch mejorada que no interrumpe la experiencia del usuario
Devolución de objetos de respuesta consistentes en lugar de lanzar excepciones

Experiencia de Usuario

Soporte para enviar el formulario con la tecla Enter
Mensajes de error más descriptivos y precisos
Respuesta más rápida al evitar redirecciones innecesarias

Código de Alta Calidad

Documentación JSDoc completa y descriptiva
Funciones modularizadas con responsabilidades claras
Mejora en la nomenclatura (ej. "contrasena" → "contrasenia")

Estandarización

Uso consistente de comillas simples en todo el código
Estructura uniforme para objetos de respuesta ({ ok: boolean, mensaje: string })
Convenciones de nombrado coherentes para variables y funciones

Áreas de Mejora

Validación Avanzada

La función validarCorreo duplica funcionalidad ya disponible en la biblioteca validator
Falta validación de longitud mínima y máxima para contraseñas
No hay validación preventiva mientras el usuario escribe

Gestión del Estado de la UI

No hay indicadores visuales durante el proceso de inicio de sesión
Falta de estado de carga mientras se procesa la solicitud
Uso de alert() para mostrar errores en lugar de un componente integrado en la UI

Manejo de Sesión

Almacenamiento simple de token en localStorage sin consideraciones de seguridad avanzadas
No hay verificación de expiración del token
Ausencia de mecanismo para renovación automática del token

Configuración

Falta de un sistema de configuración centralizado para URLs y otros parámetros
No hay ajustes específicos por entorno (desarrollo, prueba, producción)

Recomendaciones Específicas

Optimizar la Validación

Utilizar las funciones de validator en lugar de expresiones regulares personalizadas
Implementar validación preventiva durante la escritura
Ejemplo:
javascript// Reemplazar la función validarCorreo actual por:
function validarCorreo(correo) {
return validador.isEmail(correo);
}

// Validación preventiva:
entradaCorreo.addEventListener('input', (evento) => {
const correo = evento.target.value;
if (correo && !validador.isEmail(correo)) {
entradaCorreo.classList.add('invalido');
mensajeError.textContent = 'Formato de correo inválido';
} else {
entradaCorreo.classList.remove('invalido');
mensajeError.textContent = '';
}
});

Mejorar la Experiencia de Usuario

Implementar un sistema de notificaciones integrado en la UI
Añadir indicadores de carga durante procesos asíncronos
Ejemplo:
javascriptasync function manejarInicioSesion() {
try {
// Mostrar estado de carga
botonAcceder.disabled = true;
botonAcceder.innerHTML = ' Iniciando...';

const respuesta = await iniciarSesion(correo, contrasenia);

if (respuesta.ok) {
  // Éxito - continuar con login
  mostrarNotificacion('éxito', 'Inicio de sesión exitoso');
  // ...
} else {
  // Error controlado
  mostrarNotificacion('error', respuesta.mensaje);
}

} catch (error) {
// Error de red o inesperado
mostrarNotificacion('error', 'Error de conexión con el servidor');
} finally {
// Restaurar estado del botón
botonAcceder.disabled = false;
botonAcceder.textContent = 'Acceder';
}
}

function mostrarNotificacion(tipo, mensaje) {
const notificacion = document.createElement('div');
notificacion.className = notificacion ${tipo};
notificacion.textContent = mensaje;
document.body.appendChild(notificacion);
setTimeout(() => notificacion.remove(), 5000);
}

Mejorar el Manejo de Sesión

Implementar almacenamiento seguro de token con expiración
Añadir verificación de validez del token al iniciar la aplicación
Ejemplo:
javascriptconst gestionSesion = {
guardarToken(token) {
const expiracion = Date.now() + (24 * 60 * 60 * 1000); // 24 horas
const sesion = { token, expiracion };
localStorage.setItem('sesion', JSON.stringify(sesion));
},

obtenerToken() {
const sesionStr = localStorage.getItem('sesion');
if (!sesionStr) return null;

try {
  const sesion = JSON.parse(sesionStr);
  if (Date.now() > sesion.expiracion) {
    this.cerrarSesion();
    return null;
  }
  return sesion.token;
} catch (error) {
  this.cerrarSesion();
  return null;
}

},

cerrarSesion() {
localStorage.removeItem('sesion');
localStorage.removeItem('permisos');
},

sesionActiva() {
return this.obtenerToken() !== null;
}
};

Implementar Configuración Centralizada

Crear un módulo de configuración que maneje diferentes entornos
Centralizar URLs y otros parámetros
Ejemplo:
javascript// config.js
const entorno = process.env.NODE_ENV || 'development';

const configuraciones = {
development: {
apiUrl: 'http://localhost:3000',
tiempoExpiracionToken: 24 * 60 * 60 * 1000, // 24 horas
validacionContrasenia: {
longitudMinima: 8,
requiereNumeros: true,
requiereMayusculas: true
}
},
production: {
apiUrl: 'https://api.harvester-app.com',
tiempoExpiracionToken: 12 * 60 * 60 * 1000, // 12 horas
validacionContrasenia: {
longitudMinima: 10,
requiereNumeros: true,
requiereMayusculas: true,
requiereCaracteresEspeciales: true
}
}
};

module.exports = configuraciones[entorno];