4. Programación Web con PHP

La idea de este tema es que aprendas a:

  1. Reforzar la importancia de validar los datos que llegan al servidor

  2. Entender cómo mantener el estado de la sesión http

  3. Ver diferentes aspectos de la programación web con php

Requisitos

Necesitas tener conocimientos de programación web básica con php (Páginas Dinámicas con PHP)

Pongo varias referencias al manual oficial de PHP. Está en inglés pero hay traducción a diferentes idiomas (arriba a la derecha en Change language).

Está organizado en 8 talleres de unas 3 sesiones de clase. En total unas 24 sesiones de clase más tu trabajo en casa.

La dedicación depende del conocimiento previo, motivación y capacidad de aprendizaje del estudiante para esa sesión en concreto.

4.1. Página dinámica con PHP

Repasar lo visto en Páginas Dinámicas con PHP:

  1. Variables de servidor (arrays multiglobales)

  2. Datos enviados en formulario

  3. Validación de valores enviados

Actividad T04-A01. Aplicación web básica con PHP

Crea una página dinámica que:

  1. Recoja los datos de un usuario: nombre, apellidos, edad y un archivo con su fotografía

  2. Realice la validación correspondiente (ideal siempre en cliente y servidor)

  3. Que muestre una tabla (o maquetación similar) con los datos del usuario en una celda y la fotografía en otra

  4. Que muestre desde qué IP se ha conectado, el día y la hora y el agente de usuario

4.2. Maquetación con PHP

  1. En un sitio web, se puede usar el servidor para generar una plantilla (o maquetación)

  2. Se usa function.include (o casi mejor function.require):

    1. Incluye el contenido del archivo en el punto en el que se ejecuta

    2. Puedes incluir código HTML estático (o generado)

    3. Se usa también para incluir librerías de funciones o variables comunes

    4. Se usa el concepto de modularidad software (para contenido y para programación)

  3. Tiene varias ventajas:

    1. Reutilización del código

    2. Actualización sencilla

    3. Genera una plantilla de referencia (o marco de desarrollo -> framework)

  4. Pero …

    1. Mezcla presentación, estilo y programación

    2. Obliga a depender del servidor

Actividad T04-A02. Maquetación básica con PHP

Crea un sitio web sencillo con la maquetación centralizada con los siguientes archivos php:

  1. header.php , sólo para el menú superior

  2. menu.php, sólo para el menú a la izquierda

  3. footer.php, sólo para el pie de página

4.3. Cabeceras de Respuesta

  1. El servidor, no sólo genera un recurso, sino que devuelve una respuesta HTTP completa ( Messages#http_responses ):

    1. Línea de estado (status line).

    2. Cabeceras (Headers).

    3. Contenido (body). Generalmente un recurso (un html, un pdf, un texto, una imagen …)

      1. de un tipo MIME (Headers/Content-Type)

      2. y tamaño establecido (Headers/Content-Length)

    https://mdn.github.io/shared-assets/images/diagrams/http/messages/response-headers.svg
  2. En un servidor con PHP puedes crear/modificar cabeceras usando function.header :

    1. Permite personalizar la respuesta http. P.ej. especificar el tipo (MIME) de archivo) o indicar a donde redireccionar la petición

    2. Es lo primero que se debe ejecutar (porque en el mensaje HTTP lo primero son las cabeceras, y luego el cuerpo del mensaje)

  3. No confundir el mensaje HTTP con la información de la petición HTTP (en array $_SERVER reserved.variables.server). Tienen cosas en común pero no son lo mismo.

Actividad T04-A03. Ejercicio con Cabeceras

Crear estos tres programas PHP:

  1. Devolverá la cadena de texto «Hola soy $lenguaje» como texto. $lenguaje puede ser PHP JS C Java o TCL e irá en el parámetro GET del URL

  2. Uno que redireccione a este url (del curso). Es decir, abres el url y te envía aquí.

  3. Uno que lea al menos tres cabeceras de la petición HTTP (por ejemplo la IP, la fecha y hora y si tiene un referente) y lo imprime en pantalla. Eso, y mucho más, hace la función phpinfo

4.4. Cookies (en PHP)

  1. Una cookie es texto que se guarda en el navegador

  2. Y … en cada petición, se envía en las cabeceras del mensaje HTTP

    1. Si se usan en cliente (vía JS), se añaden a la petición

    2. Si se usan en servidor (p.ej vía php), se añaden a las cabeceras de respuestas (y se guardan en el navegador del cliente)

  3. Sirven para tener información previa (y posterior) de una conexión. Es decir añade control de estado al protocolo http HTTP es un protocolo SIN conexión, cada petición es independiente y se olvida todo lo anterior.

  4. Aunque pueden usarse como seudo archivos (almacenamiento), lo ideal es que sólo sirvan para almacenar variables y valores (key-value pairs). Una, o varias.

    set-cookie: session-id=-; path=/; domain=.www.amazon.es; expires=Thu, 28-Mar-2013 20:10:42 GMT
    set-cookie: session-id-time=-; path=/; domain=.www.amazon.es; expires=Thu, 28-Mar-2013 20:10:42 GMT
    set-cookie: session-token=-; path=/; domain=.www.amazon.es; expires=Thu, 28-Mar-2013 20:10:42 GMT
    set-cookie: ubid-acbes=-; path=/; domain=.www.amazon.es; expires=Thu, 28-Mar-2013 20:10:42 GMT
    set-cookie: at-acbes=-; path=/; domain=.www.amazon.es; expires=Thu, 28-Mar-2013 20:10:42 GMT
    
  5. Una cookie puede tener un valor (es una cadena de texto) organizada en valores opcionales, que a su vez son claves/valor. Estos valores opcionales son:

    1. El dominio de uso (domain)

    2. Validez (expires y/o max-age)

    3. El url necesario (path)

    4. El sitio web (samesite)

    5. Uso sobre canal seguro (secure)

  6. Las cookie se usan para resolver muchos problemas, p.ej:

    1. Hacer un seguimiento de las conexiones de un cliente http concreto

    2. Almacenar información que necesitamos ver posteriormente

    3. Personalizar la navegación, en base a su uso pasado

    4. Autenticación (para recordar a ese usuario)

    5. Analítica y estadísticas de uso

    6. y … un largo etcétera.

  7. No plantean ningún problema de seguridad (es texto, no código). El problema puede ser la privacidad (seguimiento de usuarios)

  1. Cookies en PHP

    1. Se lee las que envía el cliente vía array global #. En $_COOKIE[“nombre”] #. Uno de los arrays (asociativos) globales reserved.variables.cookies

    2. Se puede modificar el valor (para devolver al cliente) -> function.setcookie

    3. Para borrarlas se puede poner el valor de expiración en el pasado (o poner cadena vacía)

    4. Las cookies van en la cabecera. Es decir, el script es lo primero que tiene que hacer, si va a modificar las cabeceras del mensaje HTTP

Actividad T04-A04. Ejercicio con Cookies

Crea los siguientes scripts PHP:

  1. Un lector de cookies (leer del array que se envía)

  2. Un contador de visitas desde un navegador concreto (ojo a distinguir autenticación de seguimiento de autenticación)

  3. Queremos conocer el color preferido de un usuario que nos visita:

    1. Si no ha seleccionado uno, le mostramos un formulario para que lo seleccione

    2. Si tiene alguno seleccionado, le mostramos un texto en su color preferido

    3. Y además le permitimos que lo cambie (o que borre la selección)

4.5. Sesiones

  1. El servidor crea una sesión (básicamente una cookie con un identificador)

  1. PHP permite hacer diferentes operaciones:

    1. Iniciar la sesión -> function.session-start o ver el estado function.session-status.php

    2. Obtener o definir el id -> function.session-id.php

    3. Cerrar la sesión (Ojo que salvo que modifiques la duración vía function.session-set-cookie-params, al cerrar el navegador se cierra la sesión)

  2. Podemos añadir variables a la sesión -> reserved.variables.session (Array $_SESSION)

  3. Sesiones en PHP y uso de variables de sesión:

Actividad T04-A05. Ejercicio con Sesiones

Realizar los siguientes scripts PHP, similares a la clase anterior, pero usando sesiones:

  1. Leer el identificador de sesión (y ofrecer una forma de cerrar la sesión).

  2. Realizar un contador de visitas desde un navegador concreto

  3. Queremos conocer el color preferido de un usuario que nos visita:

    1. Si no ha seleccionado uno, le mostramos un formulario para que lo seleccione

    2. Si tiene alguno seleccionado, le mostramos un texto en su color preferido

    3. Y además le permitimos que lo cambie (o que borre la selección)

4.6. Autentificación de Usuarios

  1. Una cosa es la «sesión HTTP», es decir, el registro de actividad de un cliente HTTP

  2. … y otra la autenticación (y seguimiento) de un usuario concreto y conectado durante la sesión

  3. Un sistema de autenticación puede ser algo muy complejo y con muchas implicaciones

  4. Es un ejemplo académico interesante para una aplicación web que:

    1. Recoja en un formulario nombre de usuario y/o password

    2. Compruebe los datos enviados (y recibidos en el servidor)

    3. Que, una vez correcta la autenticación, genere una sesión

    4. Que, una vez que navega por recursos que necesiten permiso, compruebe el login

    5. Que el usuario pueda cerrar su sesión

  5. Las contraseñas plantean ciertos riesgos de seguridad:

    1. Lo ideal es encriptarlas por ejemplo con function.password-hash y luego comprobar la validación (function.password-verify)

    2. En la práctica se puede usar autenticación con terceros o SSO (Single Sign On)

Actividad T04-A06. Autenticación sencilla

Crea una pequeña aplicación, siguiendo los pasos anteriores, que permita que solo los usuarios autenticados puedan ver la página «privada.php».

  1. Puedes almacenar los usuarios y contraseñas en un array asociativo

  2. Y puedes usar encriptación y validación para comprobar la contraseñas (almacenas encriptado y validas)

4.7. Seguridad y Filtrado de datos

  1. La seguridad implica algo más que la fuerza de la contraseña

  2. Mejor prevenir (en cliente y en servidor):

    1. Validación: que los datos sean válidos

    2. Limpieza: eliminar posibles problemas con los datos

  3. Hay funciones de php que ayudan:

    1. Usar expresiones regulares para validar (incluso limpiar con sustituciones) -> function.preg-match

    2. Limpiar contenido para eliminar marcas -> function.htmlentities o function.htmlspecialchars

    3. Uso de funciones de filtrado (para cualquier variable) (function.filter-var):

      1. Sobre un valor

      2. Aplica una serie de filtros

  4. Las contraseñas pueden suponer riesgos de seguridad, si se almacenan en texto plano:

    1. Lo ideal es almacenarlas y encriptarlas por ejemplo con function.password-hash

    2. Y luego comprobar la validación (function.password-verify) entre el campo que te llega (sin encriptar) y el almacenado (encriptado)

    3. En la práctica se puede usar autenticación con terceros o SSO (Single Sign On) y delegar la seguridad de la autenticación en otros

Actividad T04-A07. Validación

Mejor la aplicación de la sesión anterior, añadiendo una librería de validación y saneamiento de los datos. Las claves las almacenarás encriptadas en un array

4.8. El patron de diseño MVC

  1. Modelo vista-controlador : Similar a la ya vista arquitectura de tres capas (híbrido)

    1. Modelo: los datos y la lógica

    2. Vista: la presentación e interfaz con el usuario

    3. Controlador: controla el modelo y la vista, y no es accesible (normalmente) por el usuario

  2. En la práctica, la arquitectura de la aplicación suele ser un híbrido entre:

    1. Capa o arquitectura MVC

    2. Responsabilidad cliente vs responsabilidad servidor (arquitectura distribuida)

  3. Al usar un framework determinado, suele definir un patrón de diseño específico (y el patrón MVC es habitual)

  4. Lo importante es:

    1. ser consistente en el uso del patron de diseño

    2. y separar cada uno de los componentes (que no siempre es trivial)

    3. para que esté clara la responsabilidad (qué código hace qué cosa)

  5. Para su implantación práctica es ideal usar el paradigma de orientación a objetos (pero no imprescindible)

Actividad T04-A08. Usar MVC

Estructurar el ejercicio de la sesión anterior (autenticación sencilla) usando un patrón MVC e identificando cada parte de la arquitectura con un archivo/s