Comunidad de diseño web y desarrollo en internet

Cómo hacer un login de usuarios en PHP

Crearemos un formulario de login en PHP en 4 sencillos pasos. Necesitamos crear varios archivos y carpetas primero:

  • Paso 1: crear el archivo php.php y guardarlo en /application/controllers/
  • Paso 2: crear el archivo login.php y guardarlo en /application/views/
  • Paso 3: crear usuarios_model.php y guardarlo en /application/models/
  • Paso 4: crear la tabla mysql con algunos usuarios de prueba


Paso 1: Código para el controlador "php.php":


Código :

<?
class Php extends CI_Controller {
   function login()
   {
      $this->load->helper('form');
      if(!isset($_POST['maillogin'])){   //   Si no recibimos ningún valor proveniente del formulario, significa que el usuario recién ingresa.   
         $this->load->view('login');      //   Por lo tanto le presentamos la pantalla del formulario de ingreso.
      }
      else{                        //   Si el usuario ya pasó por la pantalla inicial y presionó el botón "Ingresar"
         $this->form_validation->set_rules('maillogin','e-mail','required|valid_email');      //   Configuramos las validaciones ayudandonos con la librería form_validation del Framework Codeigniter
         $this->form_validation->set_rules('passwordlogin','password','required');
         if(($this->form_validation->run()==FALSE)){            //   Verificamos si el usuario superó la validación
            $this->load->view('login');                     //   En caso que no, volvemos a presentar la pantalla de login
         }
         else{                                       //   Si ambos campos fueron correctamente rellanados por el usuario,
            $this->load->model('usuarios_model');
            $ExisteUsuarioyPassoword=$this->usuarios_model->ValidarUsuario($_POST['maillogin'],$_POST['passwordlogin']);   //   comprobamos que el usuario exista en la base de datos y la password ingresada sea correcta
            if($ExisteUsuarioyPassoword){   // La variable $ExisteUsuarioyPassoword recibe valor TRUE si el usuario existe y FALSE en caso que no. Este valor lo determina el modelo.
               echo "Validacion Ok<br><br><a href=''>Volver</a>";   //   Si el usuario ingresó datos de acceso válido, imprimos un mensaje de validación exitosa en pantalla
            }
            else{   //   Si no logró validar
               $data['error']="E-mail o password incorrecta, por favor vuelva a intentar";
               $this->load->view('login',$data);   //   Lo regresamos a la pantalla de login y pasamos como parámetro el mensaje de error a presentar en pantalla
            }
         }
      }
   }
}
?>


Paso 2: Código para la vista "login.php":


Código :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Blogdephp.com, ¿cómo hacer un login de usuarios en php? Ver script y demo!</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="http://www.blogdephp.com/script/php-login.css" type="text/css" media="screen">
<!--<link rel="stylesheet" href="../../php-login.css" type="text/css" media="screen">-->
</head>

<body style="margin-top:0px">
<?php echo form_open('php/login'); ?>
<div class="Info">
   <p class="Titulo">Demo: ¿cómo hacer un login de usuarios en php?</p>
   <p>&nbsp;</p>   
</div>
<div id="LoginUsuarios">
   <div class="fila">
      <div class="LoginUsuariosCabecera">E-mail:</div>
      <div class="LoginUsuariosDato"><input type="text" name="maillogin" value="<?= set_value('maillogin'); ?>" size="25" /></div>
      <div class="LoginUsuariosError">
      <?
      if(isset($error)){
         echo "<p>".$error."</p>";
      }
      echo form_error('maillogin');
      ?>
      </div>
   </div>      
   <div class="fila">
      <div class="LoginUsuariosCabecera">Contraseña:</div>
      <div class="LoginUsuariosDato"><input type="password" name="passwordlogin" value="<?= set_value('passwordlogin'); ?>" size="25" /></div>
      <div class="LoginUsuariosError"><?= form_error('passwordlogin');?></div>
   </div>
   <div class="fila">
      <div class="LoginUsuariosCabecera"></div>
      <div class="LoginUsuariosDato"></div>
   </div>      
   <div class="fila">
      <div class="LoginUsuariosCabecera"><input type="submit" value="Ingresar"></div>
      <div class="LoginUsuariosDato"></div>
   </div>      
</div>
<p>&nbsp;</p>   
<p>&nbsp;</p>   
</form>
<div class="Info">
   <p><strong><u>Datos de acceso</u></strong> (correspondiente a un usuario ya ingresado en la base de datos)</p>
   <p><strong>e-mail</strong>: diego@blogdephp.com</p>
   <p><strong>password</strong>: blogdephp</strong></p>
</div>
<p>&nbsp;</p>   
<p>&nbsp;</p>   
<div class="Info">
   <p><strong><u>Requerimientos</u></strong></p>
   <p>Para poder implementar este script de login, se requiere el framework de php "Codeigniter"</p>
   <p>(esta maravillosa herramienta nos ayuda a ahorrar mucho tiempo y esfuerzo en nuestros trabajos de programación php).</p>
   <p>&nbsp;</p>
   <p>La empresa <a href="http://www.solo10.com/productos/WebHostingLinux/?safblogdephp">Solo10.com</a>, cuando contratas un paquete de hosting anual desde u$s 49.95,</p>
   <p>te ofrece la instalación y configuración inicial del Codeigniter gratis :-)</p>
   <p>&nbsp;</p>   
   <p>Este blog y demo se encuentran alojados en los servidores de Solo10.com.</p>
   <p>Te recomiendo el <a href="http://www.solo10.com/productos/WebHostingLinux/?safblogdephp">servicio de hosting</a> que ofrece esta empresa de hablahispana!</p>
</div>
<div class="Info">
   <p><a href="http://www.blogdephp.com/php-login/">Volver a Blog</a></p>
</div>
</body>
</html>


Paso 3: Código para el modelo usuarios_model.php


Código :

<?php
class Usuarios_model extends CI_Model{
   function ValidarUsuario($email,$password){         //   Consulta Mysql para buscar en la tabla Usuario aquellos usuarios que coincidan con el mail y password ingresados en pantalla de login
      $query = $this->db->where('Usuario',$email);   //   La consulta se efectúa mediante Active Record. Una manera alternativa, y en lenguaje más sencillo, de generar las consultas Sql.
      $query = $this->db->where('Password',$password);
      $query = $this->db->get('Usuarios');
      return $query->row();    //   Devolvemos al controlador la fila que coincide con la búsqueda. (FALSE en caso que no existir coincidencias)
   }
}
?>


Paso 4: Consulta Mysql para crear la tabla de usuarios


Código :

CREATE TABLE `Usuarios` (
`Id` INT NOT NULL AUTO_INCREMENT ,
`Usuario` VARCHAR( 50 ) NOT NULL ,
`Password` VARCHAR( 50 ) NOT NULL ,
PRIMARY KEY ( `Id` )
) ENGINE = MYISAM ;
INSERT INTO `Usuarios` (
`Id` ,
`Usuario` ,
`Password`
)
VALUES (
NULL , 'diego@blogdephp.com', 'blogdephp'
);


Explicación del código para forms de login con usuario y contraseña en PHP


Se trata de un script que, mediante pocas líneas de código, te permite configurar un login de usuarios propio en tu página web.

Esta capacidad es sumamente importante y la necesitaremos en cualquier proyecto web que iniciemos. Puesto que seguramente existe cierta información y funciones que nos interesa ofrecer únicamente a usuarios registrados y no al resto del público.

Por ejemplo, si estamos haciendo un sistema web para un periódico, nos interesará que los periodistas puedan ingresar al sistema (mediante un usuario y password) y puedan ingresar noticias.... Por supuesto, esta función debería ser accesible únicamente por periodistas y no por un lector común.

Funcionalidades


  • Permitir acceso a determinada información y utilidades únicamente a determinados usuarios (aquellos que se encuentren registrados en una tabla de base de datos Mysql)
  • Mensaje de error cuando falta rellenar algún campo de la pantalla de acceso
  • Mensaje de error cuando los datos ingresados no coinciden con ningún usuario registrado en la base de datos.
  • Recordar los datos previamente ingresados por el usuario cuando éste no supera el login y tenemos que volver a presentarle la pantalla de acceso.


Explicación técnica


Como pueden observar, los códigos del script se encuentran con comentarios. Cada sentencia importante tiene su explicación de que función cumple. Lo que intentaremos ahora es hacer una explicación general de cómo funciona el script; como si fuera un cuento... :-)

Comencemos con la pantalla de acceso "login.php", donde el usuario podrá ingresar sus datos (usuario y password). Recordemos que todo lo que sea interacción con el usuario (entrada y salida de datos) lo trabajamos con las vistas (capa presentación).

Lo importante aquí es la sentencia

Código :

<?php echo form_open('php/login'); ?>
donde creamos nuestro formulario html y especificamos que sus datos deben ser enviados y procesados por el método "login" del controlador "php". La sentencia form_open es de CodeIgniter.

Otro punto importante de la vista es cuando creamos los campos (serían las cajas de texto donde el usuario podrá ingresar los datos):

Código :

<input type="text" name="maillogin" value="<?= set_value('maillogin'); ?>" size="25" /></div>

Aquí estamos creando un campo de texto llamado "maillogin". La sentencia "set_value" nos sirve para recordar los datos rellenados por el usuario en caso que su acceso no sea válido y tengamos que volver a presentarle la pantalla de acceso. Es un valor agregado para dar mejor usabilidad a los usuarios.

Luego pasemos al controlador "php.php". Esta es la parte más compleja del script, por tal motivo intenté poner comentarios a cada una de las y facilitar así su comprensión. Te recomiendo leer los comentarios directo en el código.

El controlador (php.php) hace lo que hace es tomar los datos provenientes del formulario, hacer las validaciones, consultar al modelo (usuarios_model.php) si el usuario existe en la base de datos y su password es válida. Por último, decide si el usuario corresponde que pueda acceder, o no, y comunica su decisión a la vista (login.php) para que el usuario vea la respuesta en su pantalla.

Me interesa remarcar aquí algunas sentencias y declaraciones puntuales que son muy básicas de php y te servirán en todo sistema web que desarrolles.

Código :

$_POST['maillogin']
(sirve para tomar los valores provenientes del formulario, en este caso se toma el valor del campo "maillogin")

Código :

$this->load->model('usuarios_model'); (sirve para cargar el modelo usuarios_model y poder utilizar sus recursos)           this->usuarios_model->ValidarUsuario($_POST['maillogin'],$_POST['passwordlogin']);
(ejecuta el método "ValidarUsuario" de nuestro modelo "usuarios_model" y le pasa los dos parámetros. )

En el próximo artículo continuaremos mejorando este script de login. Por ejemplo, estudiaremos como hacer para que el usuario pueda acceder a muchas pantallas de información restringida sin tener que poner siempre sus datos de login (únicamente ingresarlos la primer vez).

Espero que lo disfruten, les sea útil para sus proyectos y principalmente los ayude a continuar aprendiendo :-)

Ver la demo!

Por favor, envíen sus consultas y dudas a través de los comentarios y lo revisamos juntos.
Saludos!

Cristalab y Mejorando.la te traen el Curso Profesional de Node.js y Javascript. Online, avanzado, con diploma de certificación y clases en vivo.

Publica tu comentario

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate