Cómo construir un sistema de inicio de sesión con todas las funciones

En este tutorial, le mostraré cómo hacer un sistema de inicio de sesión simple que consiste en una página de inicio de sesión, una página de registro, una página de contraseña olvidada, una activación de correo electrónico, una página de cierre de sesión y, finalmente, una página de usuarios en línea. Hice este tutorial para dirigirse principalmente a los desarrolladores de PHP nuevos, ya que cuando comencé noté la falta de cantidad de sistemas de inicio de sesión básicos. Por lo tanto, decidí hacerme uno mismo dando consejos de alta calidad sobre cómo hacer su primer sistema de inicio de sesión con un script en línea para usuarios!


1. Hacer una hoja de estilo básica

Vamos a crear una hoja de estilo CSS muy básica solo para agregar un poco de diseño y ordenar el aspecto del sistema de inicio de sesión. Así que empieza con el editor de texto abierto y podemos comenzar a hacer nuestra hoja de ruta.

cuerpo font-family: arial; tamaño de letra: 10 puntos;  tabla font-size: 10pt; margen: 0 auto;  #border border: 2px solid # 999; fondo: #CCC; relleno: 15px; margen: 0 auto; ancho: 300px; 

Guardar este archivo como style.css para que podamos enlazar con él cuando lo necesitemos. Ahí tenemos nuestra simple hoja de estilo! Ahora podemos comenzar a hacer nuestras páginas sin tener que preocuparnos demasiado por hacer que se vean razonablemente bien.



2. Creando la página de inicio de sesión

De acuerdo, tenemos una hoja de estilo definida, ahora es el momento de mostrar las cosas en nuestras páginas. Abra un nuevo archivo en su editor de texto, este será nuestro login.php página!

  
Nombre de usuario:
Contraseña:
Registrarse | Olvidó pasar

Bueno esto es lo que nuestro login.php El archivo se verá como antes de que obtengamos nuestro PHP haciendo que el formulario de inicio de sesión funcione correctamente. En el momento te darás cuenta de que no funciona. Esto se debe a que no hemos dicho a la página qué hacer si se envía el formulario..

Planificación

Ahora hagamos un poco de planificación antes de sumergirnos en el PHP. Necesitamos preguntarnos "¿Qué va a revisar la página cuando se envíe el formulario?". Para la página de inicio de sesión aquí hay una lista de lo que vamos a revisar -

  • Que tanto el usuario como la contraseña han sido rellenados
  • Que el nombre de usuario suministrado existe en nuestra base de datos.
  • Que si el nombre de usuario existe en nuestra base de datos, la contraseña coincide con la del nombre de usuario.
  • Finalmente, que el usuario ha activado su cuenta.

Si el PHP puede responder sí a los cuatro puntos, inicie sesión en el usuario. Ahora, en esos cuatro puntos, notará que se mencionó una base de datos. Vamos a utilizar una base de datos MySQL para almacenar toda la información sobre cada uno de nuestros usuarios. Así que antes de comenzar con PHP necesitamos hacer esta base de datos. En este punto se necesita un poco más de planificación. Necesitamos decidir qué información necesitamos almacenar sobre los usuarios, qué tipos de datos estamos almacenando, necesitamos un valor predeterminado, etc. Aquí está mi plan a continuación. -

  • Necesitamos almacenar un nombre de usuario para el usuario que será un varchar
  • Necesitamos una contraseña para que también sea una varchar.
  • Necesitaremos un correo electrónico para nuestra función de activación de correo electrónico, esto también puede ser varchar
  • Un campo que indica si la cuenta se ha activado o no, será un número entero.
  • Un campo que proporciona información sobre si el usuario está en línea o no, este será un número entero
  • Finalmente, un campo que nos da una hora en que el usuario se registró, este también es un número entero.

Construyendo la base de datos

Ahora de esto podemos ver exactamente cómo construir nuestra tabla en nuestra base de datos. Primero crea una base de datos llamada loginTut. Entonces en esta base de datos queremos ejecutar el SQL que he proporcionado a continuación. -

Nota: Todas las tablas contienen una clave primaria. Este es un identificador único para cada fila en la tabla!

CREAR TABLA SI NO EXISTE 'usuarios' ('id' int (11) NOT NULL auto_increment, 'username' varchar (32) NOT NULL, 'password' varchar (32) NOT NULL, 'online' int (20) NOT NULL predeterminado '0', 'correo electrónico' varchar (100) NOT NULL, 'active' int (1) NOT NULL predeterminado '0', 'rtime' int (20) NOT NULL predeterminado '0', PRIMARY KEY ('id')) MOTOR = CARTAS POR DEFECTO DE MyISAM = utf8;

Ahora que tenemos una tabla para almacenar toda la información que necesitamos sobre nuestros usuarios, agreguemos un usuario para fines de prueba. Para ello ejecuta el SQL que se proporciona a continuación. -

INSERTAR EN 'usuarios' ('id', 'nombre de usuario', 'contraseña', 'en línea', 'correo electrónico', 'activo', 'rtime') VALORES (1, 'pruebas', 'pruebas', 0, 'falso @ noemail.co.uk ', 0, 0);

Así que ahora tenemos un usuario con el nombre de usuario pruebas, la contraseña pruebas y correo electrónico [email protected]. Ahora podemos acceder al PHP y hacer que el formulario de inicio de sesión funcione.!

Añadiendo el PHP

Lo primero es lo primero que tenemos que pensar sobre la seguridad y qué tan seguro será este formulario de inicio de sesión. Para ayudar a prevenir la inyección SQL, que es una forma muy común de pirateo de bases de datos, vamos a realizar una función que protegerá todas las cadenas almacenadas en la base de datos. Esto lo pondremos en un archivo externo llamado funciones.php. Aquí está la fuente -

 

Esta función recortará nuestra cadena (cortará cualquier espacio en blanco al principio o al final de la cadena), eliminará las etiquetas (eliminará todas las etiquetas html y PHP de la cadena), y luego agregará barras diagonales a la cadena que escapa las marcas de voz (') y comillas (").

Volver a login.php

Ahora tenemos un lugar para almacenar y verificar la información del usuario, una función para proteger las cadenas que se pasan a la base de datos, y un diseño atractivo para nuestra página de inicio de sesión. Abajo puedes ver el código comentado para nuestro login.php archivo con el PHP recién agregado-

  Necesitas completar un Nombre de usuario y un Contraseña!"; else // si continúan verificando // seleccione todas las filas de la tabla donde el nombre de usuario coincida con el ingresado por el usuario $ res = mysql_query (" SELECT * FROM 'users' WHERE 'username' = '". $ username. "'"); $ num = mysql_num_rows ($ res); // verifique si no hubo una coincidencia si ($ num == 0) // si no aparece un mensaje de error en eco "
los Nombre de usuario tu suministrado no existe!
"; else // si hubo una coincidencia, continúe marcando // seleccione todas las filas donde el nombre de usuario y la contraseña coincidan con los enviados por el usuario $ res = mysql_query (" SELECT * FROM 'users' WHERE 'username' = '" . $ username. "'AND' password '='". $ password. "'"); $ num = mysql_num_rows ($ res); // verifique si no hubo una coincidencia si ($ num == 0) / / si no se muestra el mensaje de error echo "
los Contraseña que proporcionaste no coincide con el de ese nombre de usuario!
"; else // si había continuar verificando // dividir todos los campos de la fila correcta en una matriz asociativa $ row = mysql_fetch_assoc ($ res); // verifique si el usuario no ha activado su cuenta aún si ( $ row ['active']! = 1) // si no se muestra el mensaje de error echo "
Todavia no tienes Activado su cuenta!
"; | ; // mostrar mensaje eco "
Has iniciado sesión correctamente!
"; // actualizar el campo en línea a 50 segundos en el futuro $ time = date ('U') + 50; mysql_query (" UPDATE 'users' SET 'online' = '". $ time."' WHERE 'id' = '". $ _ SESSION [' uid ']."' "); // redirigirlos al encabezado de la página usersonline ('Location: usersOnline.php');?>
Nombre de usuario:
Contraseña:
Registrarse | Olvidó pasar

La mayor parte de esto se explica por los comentarios, pero una parte que no expliqué es el campo en línea. Cuando inicie sesión con éxito, actualizamos el campo en línea a 50 segundos antes de ahora. La función de fecha ('U') nos da la cantidad de segundos desde el 1 de enero de 1970 a las 00:00:00 GMT (época de Unix). Esto significa que la fecha ('U') nunca se reducirá, el valor siempre aumentará. Si configuramos el campo en línea a 50 segundos antes de ahora, cuando el Usuarios en línea La página está cargada, podemos verificar para encontrar a todos los usuarios en los que el valor en línea es mayor que el momento en que se carga la página. Si este es el caso, muestre cada uno de sus nombres..

Ahora siéntase libre de probar su página de inicio de sesión. Asegúrese de que todas las comprobaciones se realicen correctamente y de que, una vez que haya iniciado sesión correctamente, se le redirija a la página en línea de usuarios no existentes. También puede verificar si ha actualizado correctamente el campo en línea al verificar la tabla de usuarios!



3. Creando la página de registro

¿De qué sirve una página de inicio de sesión sin una página de registro? No mucho en absoluto, así que creo que ese será el próximo paso que debemos tomar. Crear la página de registro será muy similar a crear nuestra página de inicio de sesión. Necesitamos hacer una comprobación básica para ver si el nombre de usuario deseado ya está tomado, pero no hay nada nuevo sucediendo allí. A continuación puedes ver el código de la página de registro comentada. -

  ¡Debes completar todos los filds requeridos! "; Else // si todos se completaron, continúa verificando // Comprueba si el nombre de usuario deseado tiene más de 32 caracteres o menos de 3 caracteres si (strlen ($ username)> 32 || strlen ($ nombre de usuario) < 3) //if it is display error message echo "
Tu Nombre de usuario Debe tener entre 3 y 32 caracteres.!
"; else // si no continúa verificando // seleccione todas las filas de la tabla de usuarios donde el nombre de usuario publicado coincida con el nombre de usuario almacenado $ res = mysql_query (" SELECT * FROM 'users' WHERE 'username' = '". $ nombre de usuario. "'"); $ num = mysql_num_rows ($ res); // verifique si hay una coincidencia si ($ num == 1) // si es así, se tomará el nombre de usuario;
los Nombre de usuario Usted ha elegido ya está tomado!
"; else // de lo contrario, continúe revisando // verifique si la contraseña tiene menos de 5 o más de 32 caracteres de longitud si (strlen ($ contraseña) < 5 || strlen($password) > 32) // si se visualiza un mensaje de error echo "
Tu Contraseña Debe tener entre 5 y 32 caracteres.!
"; else else // else continúe verificando // verifique si la contraseña y la contraseña coinciden si ($ password! = $ passconf) // si no aparece el mensaje de error echo"
los Contraseña Usted suministró no coincide con la contraseña de confirmación!
"; else // de lo contrario, continúe verificando // Establezca el formato con el que deseamos verificar la dirección de correo electrónico en contra de $ checkemail =" /^[a-z0-9◆+([_\\.-◆[a-z0- 9] +) * @ ([a-z0-9] + ([\ .-] [a-z0-9] +) *) + \\. [Az] 2, $ / i "; // verifique si los formatos coinciden si (! preg_match ($ checkemail, $ email)) // si no aparece el mensaje de error echo "
los Email no es válido, debe ser [email protected]!
"; else // si lo hacen, continúe revisando // seleccione todas las filas de nuestra tabla de usuarios donde los correos electrónicos coincidan con $ res1 = mysql_query (" SELECT * FROM 'users' WHERE 'email' = '". $ email." '"); $ num1 = mysql_num_rows ($ res1); // si el número de coincidencias es 1 si ($ num1 == 1) // se toma la dirección de correo electrónico proporcionada, por lo que aparece el mensaje de error" "
los Email la dirección que proporcionaste ya está tomada
"; else // finalmente; de ​​lo contrario, registre la cuenta // hora de registro (unix) $ registerTime = date ('U'); // haga un código para nuestra clave de activación $ code = md5 ($ username). $ registerTime; // inserte la fila en la base de datos $ res2 = mysql_query ("INSERT INTO 'users' ('nombre de usuario', 'contraseña', 'correo electrónico', 'rtime') VALUES ('". $ nombre de usuario. "', ' ". $ password." ',' ". $ email." ',' ". $ registerTime." ') "); // envíe el correo electrónico con un enlace que contiene el enlace de activación al correo electrónico proporcionado ($ email , $ INFO ['chatName']. 'Confirmación de registro', "Gracias por registrarse". $ Username. ", \ N \ nAquí está su enlace de activación. Si el enlace no funciona, cópielo y péguelo en su barra de direcciones del navegador. \ n \ nhttp: //www.yourwebsitehere.co.uk/activate.php? code = ". $ code, 'From: [email protected]'); // muestra el eco del mensaje de éxito "
Se ha registrado correctamente, visite su bandeja de entrada para activar su cuenta.!
";?>
Nombre de usuario:
Contraseña:
Confirmar contraseña:
Email:
Login | Olvidó pasar

Nuevas funciones

Este archivo contiene algunas cosas nuevas con las que quizás no esté familiarizado, por lo tanto, revisaré todo. En primer lugar, la función strlen (), esto devuelve el número de caracteres en una cadena que nos permite verificar cuánto tiempo son las cadenas. Luego, la función preg_match (), esto verifica si el formato de una cadena coincide con el formato que especifique (en este caso es un formato de correo electrónico). Finalmente, la función de correo () envía un correo electrónico desde el servidor a cualquier correo electrónico de su elección que contenga lo que desee. Debes guardar este archivo como register.php

Ahora puede probar su página de registro, puede ver que cuando ingrese su dirección de correo electrónico correcta recibirá un correo electrónico con un enlace de activación contenido en su interior. También puede ver que una fila que contiene los datos rellenados en el formulario se ingresa en la tabla de usuarios. El valor de activo es 0 mostrando que esta cuenta aún no ha sido activada!



4. Active la página de su cuenta

Esta es solo una página pequeña con muy poco código requerido, pero aún así es muy importante y juega un papel muy importante en un sistema de inicio de sesión seguro. La fuente de esta página se muestra a continuación. - activar.php

  Desafortunadamente, hubo un error allí "; else // de lo contrario, continúe la verificación // seleccione todas las filas donde las cuentas no estén activas $ res = mysql_query (" SELECT * FROM 'users' WHERE 'active' = '0 '"); // recorre esta secuencia de comandos para cada fila encontrada no activa while ($ row = mysql_fetch_assoc ($ res)) // verifique si el código de la fila en la base de datos coincide con el código del usuario if ($ code == md5 ($ fila ['nombre de usuario']). $ fila ['rtime']) // si lo hace, entonces activa la cuenta y muestra el mensaje de éxito $ res1 = mysql_query ("ACTUALIZAR 'usuarios' SET 'activo' = '1' WHERE 'id' = '". $ Row [' id ']."' "); Echo"
Has activado exitosamente tu cuenta.!
";?>

Hay dos cosas nuevas en este archivo, usamos el método GET en lugar de POST y también usamos un ciclo while (). El método de obtención simplemente obtiene datos de la barra de direcciones en la parte superior del navegador del usuario (en este caso, el código enviado con el correo electrónico a su dirección de correo electrónico). El bucle while () es perfecto para verificar a través de múltiples filas de datos seleccionados de la base de datos (en este caso para ver si hay una coincidencia con los códigos).

Visión general hasta ahora

Hasta ahora, debería haber aprendido muchas cosas nuevas si es nuevo en PHP y ha creado con éxito la mitad de un sistema de inicio de sesión. Las páginas completadas hasta ahora son -

  • style.css
  • funciones.php
  • login.php
  • register.php
  • activar.php

Algunas funciones útiles utilizadas hasta ahora son -

  • mysql_connect (): conectarse a una base de datos mysql
  • mysql_select_db (): seleccione la base de datos con la que deberíamos trabajar
  • mysql_query (): envía consultas a la base de datos para obtener, insertar o editar datos
  • recortar (): corta el espacio en blanco no deseado del principio y final de una cuerda
  • strip_tags (): elimina las etiquetas html y PHP de una cadena
  • addlashes (): agregue barras diagonales a la cadena s permitiendo que las comillas y las marcas de voz se usen de manera segura
  • strlen () - Obtiene el número de caracteres en una cadena
  • preg_match () - La coincidencia preg es para coincidir con el formato de una cadena
  • mail (): envía el correo desde el servidor a la dirección de correo electrónico especificada
  • md5 () - Esto calcula el hash md5 de una cadena


5. Olvidó su contraseña?

La siguiente es nuestra página de contraseña olvidada. Si el usuario olvida su contraseña, podemos enviarla por correo electrónico ahora que sabemos que proporcionaron una dirección de correo electrónico real debido a la activación. Así que sin más preámbulos aquí está el código comentado para me olvidé.php -

  Necesitas completar tu Email dirección! "; else // else continúe verificando // configure el formato para verificar el correo electrónico con $ checkemail =" /^[a-z0-9◆+([_\\.-◆◆a-z0-9 ] +) * @ ([a-z0-9] + ([\ .-] [a-z0-9] +) *) + \\. [az] 2, $ / i "; // check si el correo electrónico no coincide con el formato requerido si (! preg_match ($ checkemail, $ email)) // si no, entonces muestra un mensaje de error con eco "
Email no es válido, debe ser [email protected]!
"; else // de lo contrario, continúe revisando // seleccione todas las filas de la base de datos donde los correos electrónicos coincidan con $ res = mysql_query (" SELECT * FROM 'users' WHERE 'email' = '". $ email."' "); $ num = mysql_num_rows ($ res); // verifique si el número de filas coincidentes es igual a 0 si ($ num == 0) // si aparece el mensaje de error en la pantalla "
los Email Su oferta no existe en nuestra base de datos.!
"; else // de lo contrario, complete la función de contraseña olvidada // divida la fila en una matriz asociativa $ row = mysql_fetch_assoc ($ res); // envíe un correo electrónico con su contraseña a su dirección de correo electrónico ($ correo electrónico, 'Contraseña olvidada' , "Aquí está su contraseña:". $ Row ['contraseña']. "\ N \ n ¡Por favor, no la vuelva a perder!", 'From: [email protected]'); // muestre el mensaje de éxito echo "
También se ha enviado un correo electrónico a su dirección de correo electrónico que contiene su contraseña.!
";?>
Email:
Registrarse | Iniciar sesión

Esta página no contiene nada nuevo, por lo tanto, pasaré menos tiempo revisándola. Una cosa que sí quiero mencionar es que si no lo ha notado porque hemos incluido nuestro archivo css en cada página, el diseño que utilizamos para cada página es muy similar, manteniendo un diseño elegante en todo el sitio web..

La página siguiente y final que haremos en este tutorial será ligeramente diferente. Esta página tiene la verificación para ver si el usuario ha iniciado sesión o no, y en este caso muestra a todos los usuarios en línea en ese momento actual (o para ser precisos en los últimos 50 segundos).



6. La página de usuarios en línea

Bien, hemos llegado a la sección del sitio web en el que necesitas iniciar sesión para ver. Como mencioné antes, este va a ser un poco diferente a los demás debido al hecho de que necesitamos verificar si el usuario ha iniciado sesión o no. Si no están conectados e intentamos ver la página, tenemos algunas opciones que podemos hacer. La primera es que podemos mostrar un mensaje de error que dice algo como "¡Debe haber iniciado sesión para ver esta página!", O podemos redirigirlos a la página de inicio de sesión. Para este tutorial creo que voy a usar el método de mensaje de error.

Así que aquí está el usersOnline.php fuente de la página -

  ¡Debe iniciar sesión en el usuario con esta función! "; Else // de lo contrario continuar la página // este es un script de actualización que se debe usar en cada página para actualizar el tiempo en línea de los usuarios $ hora = fecha ('U' ) +50; $ update = mysql_query ("ACTUALIZAR 'usuarios' SET 'online' = '". $ Time. "' WHERE 'id' = '". $ _ SESSION [' uid ']. "'");?> 
Usuarios en línea: '".date (' U ')."' "); // bucle para cada fila mientras que ($ row = mysql_fetch_assoc ($ res)) // echo a cada nombre de usuario que se encuentre en línea con un guión para dividirlos en $ fila ['nombre de usuario']. " - ";?>
Cerrar sesión

Como mencioné, pueden ver que esta página es ligeramente diferente. No solo nos aseguramos de que estén conectados, sino que actualizamos la hora en línea manteniendo el campo en línea por delante de la hora actual. Cada vez que se carga una página con ese script, se actualizará para ponerlos en línea. Ahora tenemos una página final más por hacer y luego hemos terminado. Una vez que un usuario ha iniciado sesión, debe poder cerrar sesión!



Logout.php

Esto debe considerarse como la página más fácil de hacer, y estoy seguro de que la mayoría de ustedes se alegran de escuchar. Ahora aquí está el código comentado para el logout.php expediente -

  ¡Debe iniciar sesión para cerrar sesión! "; Else // si continúa verificando // actualizar para configurar el campo en línea de este usuario en la hora actual mysql_query (" ACTUALIZAR 'usuarios' SET 'en línea' = '". fecha ('U'). "'WHERE' id '='". $ _ SESSION ['uid']. "'"); // destruye todas las sesiones cancelando la sesión de inicio de sesión session_destroy (); // muestra el mensaje de éxito echo "
Has terminado tu sesion satisfactoriamente!
";?>

Creo que los comentarios en este archivo lo explican lo suficiente, y creo que su conocimiento de PHP ahora debería ser mucho mayor y usted debería poder entender casi todo esto ahora..