¿Sabes qué sucede cuando haces esto con HTML y PHP?

Hasta ahora en PHP guay hemos venido utilizando la consola de PHP para hacer nuestros ejercicios, y hemos aprendido un montón de cosas: bucles y arrays con Fibonacci, cómo funciona el operador ternario, cómo poner nombres a las cosas, etc.

Pero por fin ha llegado el momento de cambiar de marco de trabajo y ejecutar nuestros ejercicios fuera de la consola, en un navegador web. Hoy empezaremos a hacer ejercicios PHP que se ejecutan en un contexto web para que te vayas familiarizando con ello.

Voy a comenzar esta tanda de ejercicios Web haciendo esta pregunta. ¿Sabes qué sucede cuando montas un formulario HTML sin los atributos method y action?



La respuesta es que sin method y action definidos, entonces el formulario se envía los datos a sí mismo por GET. Tenemos entonces un formulario que se procesa a sí mismo, o, si lo prefieres, un formulario que se autoprocesa.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
        <link rel="stylesheet" href="assets/bootstrap/css/bootstrap-responsive.min.css">        
        <title>Bienvenid@ a PHP guay, curso de programación</title>
    </head>
    <body>
        <div class="container-fluid">
            <h2>PHP guay</h2>
            <form role="form">
              <div class="form-group">
                <label>E-mail:</label>
                <input type="email" class="form-control" name="email" placeholder="Escribe tu email...">
              </div>
              <div class="form-group">
                <label>Contraseña:</label>
                <input type="password" class="form-control" name="password" placeholder="Escribe tu contraseña...">
              </div>
              <button type="submit" class="btn btn-default">Entrar</button>
            </form>
            <?php 
            if($_GET)
            { ?>
                <h4>Datos recibidos</h4>
                <?php 
                print_r($_GET);
            }
            ?>
        </div>
        <!-- Placed at the end of the document so the pages load faster -->
        <script src="assets/bootstrap/js/bootstrap.min.js"></script>
    </body>
</html>

El código anterior simula ser un formulario de login, está disponible en GitHub.

Es muy importante que tengas presente que los datos que se envían por GET, se envían en el URL, y quedan visibles a todo el mundo. Por lo tanto, siempre que quieras montar un formulario de login como este, no te olvides de especificar el método POST con el atributo method.

<form role="form" method="post">

Así los datos no viajan en el URL, aunque el password sí que viaja en claro por la red. ¡Esto también es muy importante!

En la práctica, siempre que hagamos un formulario de login como el anterior, tenemos que asegurarnos que los datos viajan encriptados con SSL. El URL no tendría que ser http://form-post.local, sino https://form-post.local, pero eso ya es otra cuestión algo más avanzada que explicaremos en otra ocasión.

También te puede interesar leer esto…