viernes, 14 de octubre de 2011

23. Autentificarse en la red


Hola a todo el mundo, ¿qué hay? El post de hoy lo voy a dedicar al registro de usuarios para acceder a determinadas áreas restringidas de un sitio Web. Lo voy a hacer de dos formas diferentes, una a la que yo llamo sencilla, puesto que no tiene base de datos. Y la otra, aunque no sea complicada lleva más código e implica la realización de una base de datos para almacenar los datos de los usuarios registrados.
Bien, empezare por la forma sencilla. Para la realización de esta aplicación crearemos cuatro archivos form.html, access.php, private.php y logout.php.
Empecemos viendo el primer archivo form.html en el navegador y a continuación el código html:














<html>
<head>
<title>Autentificarse en la red de una manera sencilla</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.Estilo3 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
.Estilo4 {
     font-size: x-large;
     font-weight: bold;
     font-family: "Times New Roman", Times, serif;
}
-->
</style>
</head>

<body>
<p align="center" class="Estilo4">FORMULARIO DE ACCESO </p>
<form name="form1" method="post" action="access.php">
  <table width="200" border="0" align="center">
    <tr>
      <td><span class="Estilo3">Usuario:</span></td>
      <td><input name="usuario" type="text" id="usuario" size="20" maxlength="20"></td>
    </tr>
    <tr>
      <td><span class="Estilo3">Contrase&ntilde;a</span>:</td>
      <td><input name="password" type="password" id="password" size="16" maxlength="16"></td>
    </tr>
    <tr>
      <td colspan="2"><div align="center">
        <input type="submit" name="Submit" value="Enviar">
      </div></td>
    </tr>
  </table>
</form>
<p>&nbsp;</p>
</body>
</html>
Vale se trata de un formulario sencillo al darle al botón Enviar nos redireccionará a la página access.php que ahora veremos. El campo de texto que corresponde al usuario le hemos indicado el nombre de usuario y en el campo de texto de la contraseña le hemos indicado el nombre password. Muy importante, porque estas son las variables que vamos a utilizar.
Pasamos al archivo access.php:
<html>
<head>
<title>Autentificarse en la red de una manera sencilla</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.Estilo3 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
.Estilo4 {
     font-size: x-large;
     font-weight: bold;
     font-family: "Times New Roman", Times, serif;
}
-->
</style>
</head>

<body>
<?php
import_request_variables("P","f_");
if (!strcmp($f_usuario,"amizba") && !strcmp($f_password,"123wed")) //El nombre de usuario y la contraseña
{
session_start();
$_SESSION['acceso']=1;//El tipo de acceso esta indicado mediante un valor.
}
echo "<a href=private.php>Acceder a la página privada</a>";
?>
</body>
</html>
Hay una pequeña explicación en el código. Pasamos ahora al archivo private.php
<html>
<head>
<title>Autentificarse en la red de una manera sencilla</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.Estilo3 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
.Estilo4 {
     font-size: x-large;
     font-weight: bold;
     font-family: "Times New Roman", Times, serif;
}
-->
</style>
</head>

<body>
<?
session_start();
if ($_SESSION['acceso']!="1")
{
header("Location:form.html");
exit;
}
echo "Bienvenido a la página privada<br>";
echo "<a href=logout.php>Salir del sistema</a>";
?>
</body>
</html>
Y por último el archivo logout.php:
<html>
<head>
<title>Autentificarse en la red de una manera sencilla</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.Estilo3 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
.Estilo4 {
     font-size: x-large;
     font-weight: bold;
     font-family: "Times New Roman", Times, serif;
}
-->
</style>
</head>

<body>
<?
session_destroy();//destruye la sesión
echo "Ha salido del sistema<br>";
echo "<a href=form.html>Volver al inicio</a>";
?>
</body>
</html>
Vemos el funcionamiento de esta aplicación. Indicamos el nombre de usuario y contraseña:














Le damos al botón Enviar y nos lleva a la página access.php:














Accedemos a página privada, nos redirecciona al archivo private.php














Y por último salimos del sistema (logout.php):














Este tipo de aplicaciones es utilizado en páginas web donde tienen acceso a las zonas restringidas personal de la empresa. A lo mejor los comerciales de una empresa saben el plan de trabajo porque el director del departamento se lo indica en un área del sitio web en el que solo pueden acceder los comerciales mediante una contraseña y un nombre de usuario. Se sigue utilizando este tipo de aplicaciones por su sencillez y porque es una aplicación rápida. Sin embargo, aconsejo utilizar bases de datos, aunque el usuario que vaya acceder a la zona restringida sea uno. Simplemente por seguridad, imaginaros que uno de esos comerciales se da de baja en la empresa por seguridad hay que modificar el código para cambiar el nombre de usuario y contraseña… suele ser más engorroso.
Ahora pasamos a otro tipo de aplicación, pero en esta hay que crear una base de datos. Para realizar esta aplicación aparte de la base de datos crearemos estos cinco archivos: page.php, registro.php, login.php, validar_usuario.php y por último logout.php.
Creamos la base de datos a la que llamamos users:
CREATE TABLE 'usuarios' (
 'id' INT(11) NOT NULL AUTO_INCREMENT,
'usuario' VARCHAR(20)
'password' VARCHAR(10)
'email' VARCHAR(45)
PRIMARY KEY  (`id`)
)














Ahora vamos a crear el archivo page.php visto en el navegador:
<?
session_start();
echo 'Bienvenido, ';
if (isset($_SESSION['k_username'])) {
echo '<b>'.$_SESSION['k_username'].'</b>.';
echo '<p><a href="logout.php">Logout</a></p>';
}else{
echo '<p><a href="login.php">Login</a></p>
<p><a href="registro.php">Registrar</a></p>';
}
?>














Cuando accedamos a esta página todavía no estaremos logeados, para logearnos necesitamos primero registrarnos, así es que vamos a ello, hacemos clic en Registrar. Nos vamos al archivo registro.php:
<?
 session_start();
      
//datos para establecer la conexion con la base de mysql.
     mysql_connect('localhost','root','')or die ('Ha fallado la conexi&oacute;n: '.mysql_error());
     mysql_select_db('users')or die ('Error al seleccionar la Base de Datos: '.mysql_error());
      
     function formRegistro(){
     ?>
     <form action="registro.php" method="post">
Usuario (max 20):
       <input type="text" name="username" size="20" maxlength="20" /><br />
     Password (max 10):
<input type="password" name="password" size="10" maxlength="10" />
Confirma: <input type="password" name="password2" size="10" maxlength="10" /><br />
Email (max 40):
     <input type="text" name="email" size="20" maxlength="40" /><br />
<input type="submit" value="Registrar" />
</form>
<?
     }
      
     // verificamos si se han enviado ya las variables necesarias.
     if (isset($_POST["username"])) {
         $username = $_POST["username"];
         $password = $_POST["password"];
         $password2 = $_POST["password2"];
         $email = $_POST["email"];
         // Hay campos en blanco
         if($username==NULL|$password==NULL|$password2==NULL|$email==NULL) {
             echo "un campo est&aacute; vacio.";
             formRegistro();
         }else{
             // ¿Coinciden las contrase&ntilde;as?
             if($password!=$password2) {
                 echo "Las contrase&ntilde;as no coinciden";
                 formRegistro();
             }else{
                 // Comprobamos si el nombre de usuario o la cuenta de correo ya exist&iacute;an
            $checkuser = mysql_query("SELECT usuario FROM usuarios WHERE usuario='$username'");
                 $username_exist = mysql_num_rows($checkuser);
                
                 $checkemail = mysql_query("SELECT email FROM usuarios WHERE email='$email'");
                 $email_exist = mysql_num_rows($checkemail);
        
                 if ($email_exist>0|$username_exist>0) {
                     echo "El nombre de usuario o la cuenta de correo estan ya en uso";
                     formRegistro();
                 }else{
                     $query = 'INSERT INTO usuarios (usuario, password, email)
                     VALUES (\''.$username.'\',\''.$password.'\',\''.$email.'\')';
                    
                     mysql_query($query) or die(mysql_error());
                echo 'El usuario '.$username.' ha sido registrado de manera satisfactoria.<br />';
                     echo 'Ahora puede entrar ingresando su usuario y su password <br />';
                     ?>
                <FORM ACTION="validar_usuario.php" METHOD="post">
                       Usuario : <INPUT TYPE="text" NAME="usuario" SIZE=20 MAXLENGTH=20><br />
                       Password: <INPUT TYPE="password" NAME="password" SIZE=10 MAXLENGTH=20><br />
                       <INPUT TYPE="submit" VALUE="Ingresar">
                </FORM>
                     <?
                    
            }
             }
         }
     }else{
         formRegistro();
     }
     ?>
¡Qué largo! Visto en el navegador:














Aquí le indicamos los datos y le damos al botón Registrar (continuamos en el archivo registro.php):














Le indicamos el nombre de usuario y contraseña y hacemos clic en el botón Ingresar:














Como podemos ver nos redirecciona a la pagina validar_usuario.php. Si hacemos clic en Inicio nos lleva la pagina inicial que es page.php logeados:














Y aquí nos desregistramos o hacemos un logout, haciendo clic sobre Logout:














Y como podemos ver, ya no aparece el nombre de usuario, indica Bienvenido pero… a nadie,  porque no estamos logeados.
¿Qué os parece? Si habéis tenido dudas con esta aplicación me lo hacéis saber en un mail o comentario, haber si entre todos podemos ayudar con las dudas que tengáis, o si pensáis que se puede a hacer de otra manera o se os ocurre otra forma de hacerlo más complicado, pues nada, a enviar comentarios o me enviáis un mail. Lo que prefiráis.
Os espero en el próximo post, saludos!

No hay comentarios:

Publicar un comentario