Diferencia entre revisiones de «Usuario:ManuelRomero/ProgramacionWeb/ProgramacionWeb/A S C/ejercicios»

De WikiEducator
Saltar a: navegación, buscar
(Ejercicio 1 : Control de accesos)
Línea 48: Línea 48:
 
*Cada página simplemente contredrá un texto en h1  
 
*Cada página simplemente contredrá un texto en h1  
 
}}
 
}}
===Cookies===
+
==Cookies==
 
===[[Usuario:ManuelRomero/ProgramacionWeb/Cookies/ejercicios/ejercicio1|Ejercicio 1 : Control de accesos ]]===
 
===[[Usuario:ManuelRomero/ProgramacionWeb/Cookies/ejercicios/ejercicio1|Ejercicio 1 : Control de accesos ]]===
 
<br />
 
<br />
Línea 60: Línea 60:
 
*Se mantiene el bloqueo durante 5 minutos.
 
*Se mantiene el bloqueo durante 5 minutos.
 
}}
 
}}
 +
<br />
 +
===[[Usuario:ManuelRomero/ProgramacionWeb/Cookies/ejercicios/ejercicio2|Ejercicio 2 : Control de accesos ]]===
 +
<br />
 +
{{MRM_Actividad|Title=Horas de acceso por usuario|
 +
*Realiza una aplicación con un formulario con un único input que sea nombre
 +
*Cada vez que introduzca un nombre la aplicación almacenará con una cookie la hora a la que ese usuario accedión
 +
*Además visualizará todos los accesos de ese usuario  indicando las horas a las que lo hizo y un listado con el resto de usuarios que se conectando indicando el total de accesos de cada usuario (no la hora).
 +
}}
 +
<br />
 +
===[[Usuario:ManuelRomero/ProgramacionWeb/Cookies/ejercicios/ejercicio3|Ejercicio 3 : Secciones de un periódico ]]===
 +
<br />
 +
{{MRM_Actividad|Title = Secciones de un periódico|
 +
*Crea una pagina que simule ser la de un periódico. La misma debe permitir configurar que tipo de titular deseamos que aparezca al visitarla, pudiendo ser:
 +
#Noticia política.
 +
#Noticia económica.
 +
#Noticia deportiva.
 +
*Mediante tres objetos de tipo radio, permitir seleccionar que titular debe mostrar el periódico.
 +
*Almacenar en una cookie el tipo de titutar que desea ver el cliente.
 +
*La primera vez que visita el sitio deben aparecer los tres titulares.
 +
}}
 +
===[[Usuario:ManuelRomero/ProgramacionWeb/Cookies/ejercicios/ejercicio4|Ejercicio 4 : Establecer preferencias ]]===
 +
<br />
 +
{{MRM_Actividad|Title= Establecer preferencias|
 +
Mostramos un menú con una serie de preferencias para el usuario según el menú que vemos en la imagen siguiente
 +
[[Archivo:preferencias.png]]
 +
*El idioma puede haber hasta 3
 +
*En perfil  público (si/no)
 +
*Zona horaria (GMT-2 GMT-1 GMT GMT+1 GMT+2)
 +
*Una vez establecidos, las podremos visualizar o bien borrar
 +
}}
 +
 +
  
 
===Sesiones===
 
===Sesiones===
Línea 212: Línea 244:
 
}}
 
}}
  
===Coockies de secciones===
 
<br />
 
{{MRM_Actividad|
 
*Crea una pagina que simule ser la de un periódico. La misma debe permitir configurar que tipo de titular deseamos que aparezca al visitarla, pudiendo ser:
 
#Noticia política.
 
#Noticia económica.
 
#Noticia deportiva.
 
*Mediante tres objetos de tipo radio, permitir seleccionar que titular debe mostrar el periódico.
 
*Almacenar en una cookie el tipo de titutar que desea ver el cliente.
 
*La primera vez que visita el sitio deben aparecer los tres titulares.
 
<!--
 
{{Plegable|hide|Posible código |
 
<source lang=php>
 
<!DOCTYPE html>
 
<!--
 
To change this license header, choose License Headers in Project Properties.
 
To change this template file, choose Tools | Templates
 
and open the template in the editor.
 
-->
 
<html>
 
    <head>
 
        <meta charset="UTF-8">
 
        <title></title>
 
        <link rel=stylesheet href="estilo.css"  type = text/css />
 
    </head>
 
    <body>
 
        <?php
 
        //Primero leo la cookie por si existe
 
        $opcion = $_COOKIE['seccion'];
 
 
        //Si he dado borrar cookie, la borro y anulo el valor de la variable
 
        //que contiene la cookie para la ejecución acutal
 
        if (isset($_POST['borrar'])) {
 
            setcookie('seccion', $opcion, time() - 1);
 
            $opcion = null;
 
        }
 
 
        //Si he dado enviar es para guardar la cookie
 
        //La leo del input radio y me guardo ese  valor
 
        //en una variable para el script actual
 
        if (isset($_POST['enviar'])) {
 
            $opcion = $_POST['seccion'];
 
            setcookie('seccion', $opcion, time() + 3600);
 
        }
 
 
        //Si no hay cookie muestro los radio, si no no los muestro
 
        //(Decisión personal...)
 
        if ($opcion == null) {
 
            ?>
 
            <h3>Si quieres especifica tu sección favorita y solo verás esa</h3>
 
            <form action ="." method="POST">
 
                <input type="radio" name="seccion" value="noticias">Noticias<br />
 
                <input type="radio" name="seccion" value="deporte">Deporte<br />
 
                <input type="radio" name="seccion" value="economia">Economía<br />
 
                <input type="submit" value="Recordar" name="enviar">
 
                <hr /><br /><br />
 
            </form>
 
            <?php
 
            //Si sí que hay cookie y no muestro las opciones de radio
 
            //Muestro un botón para borrar cookie
 
        } else {
 
            ?>
 
            <h1> En tu última selección de sección seleccionaste <strong><?php echo $opcion ?> </strong> </h1>
 
            <form action='.' method='POST'><input type='submit' value='Borrar Cookie' name='borrar'>
 
                <hr /><br /><br />
 
            </form>
 
            <?php
 
        }
 
 
        //En cada caso mostraré esta sección del supuesto periódico
 
        //Si es la sección de la cookie (en cuyo caso solo mostraré esta)
 
        //O si no hay cookie las voy a mostar todas, y por lo tanto también esta ...
 
        if (($opcion == 'noticias') || ($opcion == null)):
 
            ?>
 
            <div id = "secciones">
 
                <h2>Noticias</h2>
 
                <p>
 
                    La realidad virtual, además de verse y oírse, ahora puede tocarse.
 
                    Un grupo de estudiantes del London’s Royal College of Art han creado
 
                    un traje que permite sentirla a través del tacto.
 
                    Utiliza solenoides, dispositivos que producen
 
                    campos magnéticos a partir de corrientes eléctricas.
 
                    En este caso crean los campos a partir de diferentes sonidos,
 
                    cuyas vibraciones se sienten en la piel.
 
                    Las distintas frecuencias y ondas sonoras provocan sensaciones variadas.
 
                </p>
 
            </div>
 
            <?php
 
        endif;
 
        if (($opcion == 'economia') || ($opcion == null)):
 
            ?>
 
            <div id = "secciones">
 
                <h2>Economía</h2>
 
                <p>
 
                    La actividad económica española, medida por el producto interior bruto
 
                    (PIB), se multiplicó por 50 entre 1850 y 2015,
 
                    lo que supone una tasa acumulativa anual del 2, 4%.
 
                    Pero, ¿en qué medida afectó a las condiciones de vida de la población?
 
                    Dado que la población se triplicó, el PIB real por habitante
 
                    aumentó alrededor de 16 veces,
 
                    creciendo anualmente, en promedio, al 1, 7%, pero mostrando un ritmo
 
                    desigual.
 
                    Así, entre 1850 y 1950, el PIB per cápita creció al 0, 7%,
 
                    duplicando su nivel inicial.
 
                </p>
 
            </div>
 
            <?php
 
        endif;
 
        if (($opcion == 'deporte') || ($opcion == null)):
 
            ?>
 
            <div id = "secciones">
 
                <h2>Deporte</h2>
 
                <p>
 
                    El español Rafael Nadal derrotó al canadiense Milos Raonic,
 
                    tercer favorito, por 6-4, 7-6 (7) y 6-4 en dos horas y 44 minutos,
 
                    para marcar su victoria 50 en el Abierto de Australia y alcanzar por
 
                    quinta vez las semifinales.
 
                    El campeón de 2009 y finalista en 2012 y 2014,
 
                    se enfrentará por un puesto para la final contra el búlgaro
 
                    Grigor Dimitrov, que derrotó antes al belga David Goffin,
 
                    por 6-3, 6-2 y 6-4, en dos horas y 13 minutos.
 
                    Será la 24 semifinal de Rafael Nadal en el Grand Slam,
 
                </p>
 
            </div>
 
        <?php endif; ?>
 
    </body>
 
</html>
 
</source>
 
}}
 
{{Plegable|hide|Css para el ejercicio|
 
<source lang=css>
 
#secciones{
 
    border: 0.25em solid;
 
    align : center;
 
    left: 10%;
 
    background-color: #eee;
 
    font-size: 1.1em;
 
}
 
</source>}}
 
}}
 
-->
 
  
 
{{MRM_Actividad|Title=Realiza el ejercicio de la siguiente referencia|
 
{{MRM_Actividad|Title=Realiza el ejercicio de la siguiente referencia|
 
  http://www.mclibre.org/consultar/php/ejercicios/cookies/cookies.html
 
  http://www.mclibre.org/consultar/php/ejercicios/cookies/cookies.html
 
}}
 
}}

Revisión de 06:01 25 ene 2021




Autentificación

Ejercicio 1 : Fichero .htaccess



Icon activity.jpg
Ficheros de usuarios
  • crea un fichero llamado misUsuarios y añade 3 usuarios maria/maria nieves/nieves sara/sara. Se indica usuario/password
  • Posteriormente visualiza el contenido del fichero
  • Observa cómo la pass aparece cifrada
Modo de actuación

1.- Primero nos ubicamos en el directorio donde queramos añadir o crear el fichero

cd /home/MiUsuario
MiUsuario es vuestro propio directorio

2.-Ahora creamos un directorio para guardar esta información y nos movemos en él

mkdir usuarios
cd usuarios

3.-Una vez correctamente ubicados generamos el fichero de las password con la herramienta htpasswd

La primera vez con opción -c para crear el fichero
 htpasswd -c misUsuarios maria
 htpasswd  misUsuarios nieves
 htpasswd misUsuarios nieves

5.- Crea una página index.html que contenga un texto 4.- Crea un fichero .haccess en el directorio y especifica la directivas necesarias para que al acceder a la página index.html te solicite credenciales




Ejercicio 2 : Acceder a su contenido



Icon activity.jpg
Accediendo con php a la autentificación
  • Modifica la página restringida para ver el usuario y password así como el método usado de autentifiación
  • El código que habría que añadir:





Ejercicio 3 : Accesos Restringidos



Icon activity.jpg
Ejercicio 3: Accesos restringidos
  • Utilizando la autentificción de usuario y pass en el servidor y ficheros .htaccess,
  • Crea un fichero de contraseñas llamado misUsuarios con por ejemplo 5 usuarios (alicia, sara, jorge, paula, manolo)
  • Crea un fichero de grupos con por 1 grupo (grupo_familia) al que pertenecerán sara, alicia y paula)
  • Crea un sencillo sitio web que me redirija a 4 páginas:
  1. Información General : Tendrá acceso todo el mundo
  2. Información restringida: Sólo tenrán acceso los usuarios creados en el fichero misUsuarios
  3. Información Sara : Tendrá acceso solo el usuario sara
  4. Información de grupo : Tendrá acceso los usuarios 3 usuarios de los 5 creados (sara alicia y paula).
  • Cada página simplemente contredrá un texto en h1



Cookies

Ejercicio 1 : Control de accesos



Icon activity.jpg
Controlando accesos
  • Solo queremos permitir tres intentos de acceso
  • El usuario puede intentar acceder hasta tres veces seguidas a un sitio web de forma incorrecta
  • Para acceder ha de insertar igual password que usuario (mismo valor)
  • Para controlar los acceso anotaremos en cookies los intentos que lleva (Claramente es un ejercicio forzado, no podría ser en un caso real)
  • Si lleva 3 accesos incorrectos, mostraremos un mensaje de que el acceso ha sido bloqueado y dejaremos un botón para reiniciar los intentos.
  • Una vez que acceda de forma correcta, volverá a tener hasta 3 intentos para la próxima vez que acceda
  • Se mantiene el bloqueo durante 5 minutos.




Ejercicio 2 : Control de accesos



Icon activity.jpg
Horas de acceso por usuario
  • Realiza una aplicación con un formulario con un único input que sea nombre
  • Cada vez que introduzca un nombre la aplicación almacenará con una cookie la hora a la que ese usuario accedión
  • Además visualizará todos los accesos de ese usuario indicando las horas a las que lo hizo y un listado con el resto de usuarios que se conectando indicando el total de accesos de cada usuario (no la hora).




Ejercicio 3 : Secciones de un periódico



Icon activity.jpg
Secciones de un periódico
  • Crea una pagina que simule ser la de un periódico. La misma debe permitir configurar que tipo de titular deseamos que aparezca al visitarla, pudiendo ser:
  1. Noticia política.
  2. Noticia económica.
  3. Noticia deportiva.
  • Mediante tres objetos de tipo radio, permitir seleccionar que titular debe mostrar el periódico.
  • Almacenar en una cookie el tipo de titutar que desea ver el cliente.
  • La primera vez que visita el sitio deben aparecer los tres titulares.



Ejercicio 4 : Establecer preferencias



Icon activity.jpg
Establecer preferencias

Mostramos un menú con una serie de preferencias para el usuario según el menú que vemos en la imagen siguiente Preferencias.png

  • El idioma puede haber hasta 3
  • En perfil público (si/no)
  • Zona horaria (GMT-2 GMT-1 GMT GMT+1 GMT+2)
  • Una vez establecidos, las podremos visualizar o bien borrar





Sesiones

Localiza variables de sesión



Icon activity.jpg
Variables de sesión
  • Localiza y actualiza estas directivas en tu fichero de configuración
  • coméntalas con tus palabras en dicho fichero



Ejercicio 1 : Cuenta visitas



Icon activity.jpg

Ejercicio 1 Cuenta visitas

Haz un programa que te cuente cuantas visitas recibe la página
  • Puedes poner un botón submit para recargar la página.
  • Indica mediane mensaje si accedes haciendo un click, o bien escribiendo la url
  • Contabiliza todos los accesos (por click o escribiendo la url en el navegado).





Ejercicio 2 : Visitas con fecha



Icon activity.jpg
Ejercicio 2: Fechas de cada visita
  • Modifica el programa anterior para almacenar el momento en el cual se produjo cada visita
  • Anota hora, minuto y segundo
  • Visualiza todas las conexiones y el momento en el que se produjeron







Icon activity.jpg
Control de acceso con autentificación
  • Crea una página similar a la anterior usada en cookies,
  • Almacena en la sesión de usuario los instantes de todas sus últimas visitas.
  • Si es su primera visita, muestra un mensaje de bienvenida.
  • En caso contrario, muestra la fecha y hora de todas sus visitas anteriores. Añade un botón a la página que permita borrar el registro de visitas.
  • Utiliza también una variable de sesión para comprobar si el usuario se ha autentificado correctamente. De esta forma no hará falta comprobar las credenciales con la base de datos constantemente.
Propuesta de solución
<?php
// Si el usuario aún no se ha autentificado, pedimos las credenciales
if (!isset($_SERVER['PHP_AUTH_USER'])) {
    header('WWW-Authenticate: Basic realm="Contenido restringido"');
    header("HTTP/1.0 401 Unauthorized");
    exit;
}
// Vamos a guardar el usuario en una variable de sesión
// si no existe, aún no se ha autentificado
session_start();
if (!isset($_SESSION['usuario'])) {
// Aquí podríamos conectar a una vbase de satos para ver recuperar datos de la base de datos
//y verificar si hay o no concordancia.
$autentificado=false;
if ($_SERVER['PHP_AUTH_USER']=="manolo" AND $_SERVER['PHP_AUTH_PW']=="manolo")
    $autentificado=true;
 
// Si no existe, se vuelven a pedir las credenciales
        if ($autentificado == false) {
            header('WWW-Authenticate: Basic realm="Contenido restringido"');
            header("HTTP/1.0 401 Unauthorized");
            exit;
        } else
            $_SESSION['usuario'] = $_SERVER['PHP_AUTH_USER'];
    }
}
// Si ya está autentificado
else {
// Comprobamos si se ha enviado el formulario de limpiar el registro
    if (isset($_POST['limpiar']))
        unset($_SESSION['visita']);
    else
        $_SESSION['visita'][] = time();
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
    http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <title>Ejemplo Tema 4: Cookies en autentificación HTTP</title><link href="dwes.css" rel="stylesheet" type="text/css">
    </head>
    <body>
        <?php
        if ($error == null) {
            echo "Nombre de usuario: " . $_SERVER['PHP_AUTH_USER'] . "<br />";
            echo "Hash de la contraseña: " . md5($_SERVER['PHP_AUTH_PW']) . "<br />";
            if (count($_SESSION['visita']) == 0)
                echo "Bienvenido. Esta es su primera visita.";
            else {
                date_default_timezone_set('Europe/Madrid');
                foreach ($_SESSION['visita'] as $v)
                    echo date("d/m/y \a \l\a\s H:i", $v) . "<br />";
                ?>
                <form id='vaciar' action='<?php echo $_SERVER['PHP_SELF']; ?>' method='post'>
                    <input type='submit' name='limpiar' value='Limpiar registro'/>
                </form>
                <?php
            }
        } else
            echo "Se ha producido el error $error.<br />";
        ?>
    </body>
</html>






Cookies

Almacenar el momento de las visitas a una página



Icon activity.jpg
Cookies con momento de visita
  • En una página llamada registro.php , almacena en una cookie el último instante en la que se visitó la página.
  • Si es su primera visita, muestra un mensaje de bienvenida.
  • En caso contrario, muestra la fecha y hora de su anterior visita.
  • Deberás utilizar la función setcookie para guardar el instante de su anterior visita y mostrar su contenido utilizando el array $_COOKIE.
Posible solución
  • Tomado el ejemplo anterior (de autentificación), habría que añadir el siguiente código
if($resultado->num_rows == 0) {
 //......
 
 
else {
     if (isset($_COOKIE['ultimo_login'])) {
         $ultimo_login = $_COOKIE['ultimo_login'];
     }
     setcookie("ultimo_login", time(), time()+3600);
}
 
//..... y una vez dentro de la página
 
if (isset($ultimo_login))
    echo "Ultimo login: " . date("d/m/y \a \l\a\s H:i", $ultimo_login);
else
    echo "Bienvenido. Esta es su primera visita."






Icon activity.jpg
Realiza el ejercicio de la siguiente referencia
http://www.mclibre.org/consultar/php/ejercicios/cookies/cookies.html