Ejercicio
Nombre: Gomez Gomez Jose Emiliano 213107042
Asignatura: Seguridad Web
Profesor: Oscar Olivares López
Base de Datos
Nombre de la base de datos:
Empleados
Una base de datos que parece estar destinada a gestionar información relacionada con los
accesos de usuarios.
Tabla principal:
Accesos
Esta tabla contiene la información de las credenciales de acceso de los usuarios. Su
estructura es la siguiente:
1. Nombre:
o Tipo: VARCHAR(50)
o Descripción: Almacena el nombre del usuario. Es obligatorio (NOT NULL).
o Ejemplo: "Juan Pérez"
2. Usuario:
o Tipo: VARCHAR(50)
o Descripción: Contiene el nombre de usuario único para acceder al sistema.
No puede haber duplicados (UNIQUE) y es obligatorio (NOT NULL).
o Ejemplo: "juan123"
3. Password:
o Tipo: VARCHAR(100)
o Descripción: Guarda la contraseña del usuario. Es obligatorio (NOT NULL).
Por seguridad, se recomienda que este campo esté encriptado.
o Ejemplo: "hashed_password"
Consulta ejecutada:
El comando SELECT * FROM Accesos te devolverá todas las filas existentes en la tabla
Accesos. Si aún no has agregado datos, el resultado será una tabla vacía.
Pagina HTML
Estructura del documento HTML
1. Declaración inicial y configuración básica:
o <!DOCTYPE html>: Indica que el documento sigue la especificación
HTML5.
o <html lang="en">: Define el idioma principal como inglés. Si es para un
público hispanohablante, se puede cambiar a lang="es".
o <head>: Contiene metadatos y recursos necesarios:
▪ <meta charset="UTF-8">: Configura el juego de caracteres en
UTF-8 para soportar la mayoría de caracteres especiales.
▪ <meta name="viewport" content="width=device-width,
initial-scale=1.0">: Permite que el diseño sea responsivo en
dispositivos móviles.
▪ <title>Acceso</title>: Establece el título que aparecerá en la
pestaña del navegador.
▪ <link href="[Link]" rel="stylesheet">: Enlaza una hoja
de estilos CSS externa llamada [Link].
▪ <link rel="preload" href="[Link]" as="styles">:
Precarga la hoja de estilos para mejorar el rendimiento.
2. Cuerpo de la página:
o <body>: Contiene el contenido visible de la página.
3. Formulario de registro:
o Etiqueta <form>:
▪ action="[Link]": Indica que los datos del formulario serán
enviados al archivo [Link].
▪ method="POST": Define el método de envío como POST, que es más
seguro que GET para manejar datos sensibles.
o <fieldset>:
▪ Agrupa los campos del formulario dentro de un bloque con borde.
▪ <legend>: Título del bloque: "Regístrate llenando todos los
campos".
o Campos del formulario:
▪ Nombre:
▪ <label>: Etiqueta para el campo.
▪ <input type="text" id="Nombre" name="Nombre"
placeholder="Coloca tu Nombre" required>: Campo de
texto para capturar el nombre del usuario.
▪ Usuario:
▪ <label>: Etiqueta para el campo.
▪ <input type="text" id="Usuario" name="Usuario"
placeholder="Coloca tu Usuario" required>: Campo
de texto para capturar el nombre de usuario.
▪ Contraseña:
▪ <label>: Etiqueta para el campo.
▪ <input type="password" id="Contraseña"
name="Contraseña" placeholder="Coloca tu
Contraseña" required>: Campo para capturar la
contraseña. Oculta los caracteres introducidos.
o Botón de envío:
▪ <input type="submit" value="Enviar">: Botón para enviar los
datos al archivo [Link].
PHP
Estructura del código
1. Encabezado del documento (<head>):
o <!DOCTYPE html>: Declara el uso de HTML5.
o <html lang="en">: Define el idioma como inglés.
o <meta charset="UTF-8">: Establece el conjunto de caracteres en UTF-8.
o <meta name="viewport" content="width=device-width, initial-
scale=1.0">: Asegura que la página sea responsiva.
o <title>Datos Recibidos</title>: Título que aparece en la pestaña del
navegador.
2. Cuerpo del documento (<body>):
o <h1>Datos Recibidos</h1>: Muestra un encabezado principal.
3. Código PHP para procesar el formulario:
o Validación de solicitud:
▪ if ($_SERVER['REQUEST_METHOD'] == 'POST'): Verifica que los
datos lleguen por el método POST.
o Recepción y sanitización de datos:
▪ $nombre, $usuario, $contraseña: Se extraen del formulario usando
$_POST.
▪ htmlspecialchars(): Evita la ejecución de código malicioso al
convertir caracteres especiales en entidades HTML.
o Cifrado de contraseñas:
▪ password_hash($contraseña, PASSWORD_BCRYPT): Cifra la
contraseña con el algoritmo BCRYPT, proporcionando una capa
adicional de seguridad.
o Conexión a la base de datos:
▪ $dsn: Define los parámetros de conexión (host, base de datos,
codificación).
▪ $db_user y $db_password: Credenciales de acceso a la base de
datos (en este caso, usuario root sin contraseña).
▪ new PDO: Se utiliza para conectar a la base de datos mediante PDO
(PHP Data Objects), una interfaz segura y flexible.
▪ setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION):
Configura PDO para manejar errores como excepciones.
o Inserción de datos:
▪ $sql: Define la consulta SQL para insertar datos en la tabla
Accesos.
▪ $stmt = $pdo->prepare($sql): Prepara la consulta para evitar
inyecciones SQL.
▪ bindParam: Asocia los valores recibidos a los parámetros de la
consulta.
▪ $stmt->execute(): Ejecuta la consulta y guarda los datos.
o Mensajes de confirmación o error:
▪ Si la inserción es exitosa: Muestra un mensaje de confirmación.
▪ Si falla: Muestra un mensaje de error genérico.
▪ Si hay problemas de conexión: Captura la excepción
(PDOException) y muestra el mensaje de error.
o Mensaje alternativo:
▪ Si el formulario no fue enviado con POST, muestra: "No se recibieron
datos."
Capturas de Ejecución
Conclusiones
Buenas prácticas implementadas:
• Separación de responsabilidades:
Dividiste las tareas de captura y procesamiento de datos en dos archivos diferentes:
uno para el formulario HTML y otro para el procesamiento en PHP. Esto mejora la
organización del código y facilita el mantenimiento.
• Uso de PDO:
La implementación de PHP Data Objects (PDO) para interactuar con la base de
datos es una excelente práctica, ya que proporciona una forma segura y eficiente de
ejecutar consultas y previene inyecciones SQL.
• Cifrado de contraseñas:
Al usar password_hash, aseguras que las contraseñas no se almacenen como texto
plano, lo cual es esencial para proteger la información de los usuarios.
• Sanitización de datos:
La función htmlspecialchars minimiza el riesgo de ataques XSS al evitar la
ejecución de caracteres especiales en los campos de entrada.
2. Aspectos mejorables:
• Manejo de errores más específico:
Si bien se captura la excepción PDO, el mensaje mostrado al usuario podría ser más
general ("Hubo un error, inténtalo más tarde") para no revelar detalles internos
sobre la base de datos.
• Validación adicional en el servidor:
Aunque se usa required en el formulario HTML, sería ideal validar en el servidor:
o Longitud de las contraseñas (mínima y máxima).
o Formato del usuario (evitar caracteres no permitidos).
o Restricciones adicionales, como evitar duplicados antes de enviar datos a la
base.
• Gestión de credenciales:
Es recomendable usar un archivo de configuración separado o variables de entorno
para guardar las credenciales de acceso a la base de datos, especialmente en
aplicaciones más grandes o cuando se despliegan en servidores públicos.
3. Funcionalidad lograda:
• El flujo de trabajo está correctamente implementado:
o Captura de datos: El formulario recoge nombre, usuario y contraseña del
usuario.
o Procesamiento: Los datos se sanitizan, la contraseña se cifra, y se guardan
en la base de datos.
o Retroalimentación al usuario: Se informa si el registro fue exitoso o si
hubo errores.
• Escalabilidad:
La estructura es fácil de ampliar. Por ejemplo, podrías agregar más campos al
formulario, o implementar características como inicio de sesión, recuperación de
contraseñas, y administración de usuarios.
Referencias
1. [Link]. (n.d.). PHP Data Objects (PDO). Recuperado el 19 de noviembre de
2024, de [Link]
2. [Link]. (n.d.). password_hash. Recuperado el 19 de noviembre de 2024, de
[Link]
3. W3Schools. (n.d.). PHP MySQL Database. Recuperado el 19 de noviembre de
2024, de [Link]
GUÍA ESTRUCTURADA DE EVALUACIÓN
FO-205P11000-13
División: (1) INGENIERIA EN SISTEMAS COMPUTACIONALES
Docente: (2) M en S.T.R Oscar Olivares López
Asignatura: (3) Tópicos Avanzados de Programación
Indicador de alcance
Competencia 3
Nombre y número de control Gomez Gomez Jose Emiliano 213107042 Grupo: (6) 381M
Evidencia de aprendizaje: EJERCICIO PRÁCTICO
Indicaciones generales: (9)
• Todo programa a realizar deberá ser entregado en tiempo y forma.
• El programa debe ser mostrado (ejecución) al docente para su evaluación (No será tomado si este solo es enviado)
ATRIBUTO DE EGRESO:
Nota: Presentar atención en los criterios de evaluación, entregar en tiempo y forma de no ser así presentar la actividad
en segunda oportunidad.
CUMPLE CUMPLE
VALOR 1° 2°
SI NO SI NO
1.-La actividad entregada tiene portada (datos del alumno, datos de la actividad entregada), 10%
Guía estructurada anexa (con los datos del alumno).
2.-La actividad maneja una introducción anticipada a cada apartado que maneja. 10%
3.-Hace uso de screenshots de la ejecución del código utilizado. 10%
4.-Describe de forma detallada cada línea de código usada en el programa solicitado. 50%
5.-Agrega conclusiones al final de su trabajo (actividad), enfocadas a lo que le fue solicitado. 10%
6.-Maneja 3 referencias bibliográficas de Internet colocándolas al final de dicha actividad 10%
solicitada.
TOTAL 100%
1° 2°
puntuación alcanzada
oportunidad oportunidad
100%
