Usuarios Online PHP y MySQL: 3 ejemplos completos
En PHP podemos implementar un sistema para poder aprecia los usuarios online PHP. Muchos de nosotros han podido notar en ciertos sitios web, un contador de usuarios que se encuentran navegando en la página web. Sin embargo, nosotros también podemos implementar algo similar para nuestros proyectos online.
Ahora, solo tenemos que realizar algunos procedimientos usando el lenguaje PHP y una base de datos en MYSQL.
Usuarios Online PHP y MySQL: 3 formas para visualizar usuarios conectados.
A continuación, detallaremos los 3 ejemplos para visualizar usuarios conectados.
A) FORMA 01: Usando base de datos MySQL
Ahora, para poder incorporar este pequeño script, que nos servirá para mostrar cuantos usuarios hay conectados en la página en determinados intervalos de tiempo. Este sistema se va actualizando de manera dinámica en la base de datos.
¿Cómo funciona el Código?
Primero el Script captura la IP del visitante y la hora actual. Posteriormente, almacena esa información a la base de datos.
¿Qué recursos necesita para funcionar?
Su aplicación es muy sencilla, básicamente depende de 3 elementos que podemos obtener rápidamente. Veamos cuales son.
- Una tabla MySQL que almacenará las conexiones.
- El archivo de configuración.
- Un fichero para poder incluir en cualquier archivo donde deseamos ver los usuarios conectados.
1) Creamos la base de datos y la tabla:
Primeramente crearemos la base de datos llamado «php_conectados
» y posteriormente la tabla llamada «usuarios_online
«, que nos servirá para almacenar la información de los visitantes.
CREATE TABLE `usuarios_online` ( `id` int(11) NOT NULL, `date` int(11) NOT NULL, `ip` varchar(40) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=utf8; ALTER TABLE `usuarios_online` ADD PRIMARY KEY (`id`); ALTER TABLE `usuarios_online` MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;
2) Conexión con la base de datos.
Este sistema trabaja con base de datos y aquí, justamente mostraremos en contenido del fichero llamado «Dbconect.php
» en el cual será el encargado de realizar la conexión de PHP con MySQL para almacenar los datos de los visitantes.
<?php $Server = 'localhost'; $UserBD = 'root'; $PasswordBD = ''; $BaseDatos = 'php_conectados'; $con =new mysqli($Server, $UserBD, $PasswordBD , $BaseDatos); ?>
Para realizar tal conexión nos apoyaremos de la función «mysqli». Por lo tanto, esta función requiere 4 parámetros para un correcto funcionamiento.
a) $Server.- Sera la variable que almacena el nombre del servidor.
b) $userDB.- Nombre del usuario de MySQL.
c) $passwordBD.- Contraseña del usuario de MySQL.
d) $BaseDatos.- Variable que almacena el nombre de la base de datos.
3) Implementar el script llamado «UsuariosConectados.php»
Este fichero en el núcleo de este pequeño sistema y será el encargado de mostrar los usuarios en línea. Vamos a continuación su contenido.
<?php // Incluimos el fichero para la conexion con la abse de datos require_once('Dbconect.php'); // Tiempo de espera 3 minutos $time = 3; // Capturamos el tiempo de la conexión $date = time(); // Captura de la IP de conexion $ip = $_SERVER['REMOTE_ADDR']; // Tiempo de espera $limite = $date-$time*60; // Si supera los 3 minutos borramos de la base de datos la conexion mysqli_query($con,"delete from usuarios_online where date < $limite") ; // Mostramos todos los usuarios conectados $resp = mysqli_query($con,"select * from usuarios_online where ip='$ip'") ; // Si son los mismo actualizamos la tabla usuarios_online if(mysqli_num_rows($resp) != 0) { mysqli_query($con,"update usuarios_online set date='$date' where ip='$ip'") ; } // Caso contrario insertamos las nuevas visitas else { mysqli_query($con,"insert into usuarios_online (date,ip) values ('$date','$ip')") ; } $query = "SELECT * FROM usuarios_online"; $resp = mysqli_query($con,$query) or die(mysqli_error($con)); // almacenamos la consulta en la variable $conectados $conectados = mysqli_num_rows($resp); // Condicional para comporbar usuarios conectados if($conectados > 1 || $conectados == 0) { echo("Hay "); }else{ echo("Hay "); } if($conectados == 0){ echo("no "); }else{ echo ($conectados." "); } if($conectados > 1 || $conectados == 0){ echo("usuarios en línea."); }else{ echo("usuario en línea."); } ?>
4) Llamar el fichero en cualquier página web.
Esta pequeña incrustación podemos colocar en cualquier página donde deseamos ver la información de usuarios conectados a través de la función «requiere_once
«, veamos el ejemplo.
<?php require_once("UsuariosConectados.php"); ?>
B) FORMA 02: Usando Sesión de Usuarios
Esta segunda opción para mostrar usuario conectados. Por lo tanto, usaremos sesión de usuarios atreves de un formulario que contemplara un input tipo usuario y otro tipo contraseña.
Componentes del sistema usando sesión.
En esta sección mostraremos los ficheros y recursos que necesitaremos para nuestro según ejemplo.
1) Base de datos
Esta consulta tenemos que ejecutarla por ejemplo en el gestor PHPMyADMIN en una base de datos llamado «php_online
» y la tabla con nombre «usuarios_en_linea
«.
CREATE TABLE `usuarios` ( `id` int(11) NOT NULL, `usuario` varchar(250) DEFAULT NULL, `password` varchar(250) DEFAULT NULL, `online` enum('0','1') NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=utf8; INSERT INTO `usuarios` (`id`, `usuario`, `password`, `online`) VALUES (1, 'Jorge', '63a9f0ea7bb98050796b649e85481845', '0'), (2, 'Miguel', '63a9f0ea7bb98050796b649e85481845', '1'); ALTER TABLE `usuarios` ADD PRIMARY KEY (`id`); ALTER TABLE `usuarios` MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=3;
2) Fichero Index.php
Este archivo contendrá las librerías externas llamada BootStrap y JavaScript. También, será el encargado de mostrar un formulario mientras no exista la sesión de usuarios. Sin embargo, si existe la sesión el formulario se ocultara y mostrara la cantidad de usuarios conectados y un botón para cerrar sesión.
<?php include "dbconect.php"; include "iniciar.php"; ?> <!doctype html> <html lang="es"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <title>Usuarios conectados con MySQL y BootStrap 4 | BaulPHP</title> <!-- Bootstrap core CSS --> <link href="dist/css/bootstrap.min.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="assets/sticky-footer-navbar.css" rel="stylesheet"> <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> </head> <body> <header> <!-- Fixed navbar --> <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark"> <a class="navbar-brand" href="#">BaulPHP</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarCollapse"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="index.php">Inicio <span class="sr-only">(current)</span></a> </li> </ul> <form class="form-inline mt-2 mt-md-0"> <input class="form-control mr-sm-2" type="text" placeholder="Buscar" aria-label="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Busqueda</button> </form> </div> </nav> </header> <!-- Begin page content --> <div class="container"> <h3 class="mt-5">Usuarios conectados con MySQL y BootStrap 4</h3> <hr> <div class="row"> <div class="col-6 col-md-6"> <!-- Contenido --> <?php if(isset($_SESSION['logged'])){ } else{ ?> <form action="" method="POST"> <div class="form-group"> <label for="exampleInputEmail1">Usuario</label> <input type="text" class="form-control" name="usuario" aria-describedby="usuario" placeholder="Usuario"> </div> <div class="form-group"> <label for="exampleInputPassword1">Password</label> <input type="password" class="form-control" name="password" placeholder="Contraseña"> </div> <button type="submit" name="enviar" class="btn btn-primary">Inciar Sesion</button> </form> <?php } if(isset($_POST['enviar'])){ $usuario = utf8_decode(mysqli_real_escape_string($conexion, $_POST['usuario'])); $password = md5(utf8_decode(mysqli_real_escape_string($conexion, $_POST['password']))); if($usuario == '' or $password == ''){ echo "No puedes dejar los campos en blancos."; } else{ $comprobe = mysqli_query($conexion, "SELECT * FROM usuarios WHERE usuario = '".$usuario."' AND password = '".$password."' LIMIT 1")or die(mysqli_error($conexion)); if(mysqli_num_rows($comprobe) == 1){ $row = mysqli_fetch_assoc($comprobe); $_SESSION['id'] = $row['id']; $_SESSION['usuario'] = $row['usuario']; $_SESSION['logged'] = TRUE; $online = mysqli_query($conexion, "UPDATE usuarios SET online = '1' WHERE id = '".$_SESSION['id']."'")or die(mysqli_error($conexion)); $url = "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; echo "<meta http-equiv='Refresh' content='0;url=".$url."'>"; } else{ echo "Usuario o contraseña errónea."; } } } ?> <!-- Fin Contenido --> </div> </div> <div class="row"> <div class="col-12 col-md-12"> Usuarios conectados: <?php $consulta1 = mysqli_query($conexion, "SELECT * FROM usuarios WHERE online = '1'")or die(mysqli_error($conexion)); $ful = mysqli_num_rows($consulta1); echo $ful; ?> </div> <div class="col-4 col-md-4"> <p>Lista de usuario en Linea</p> <ul class="list-group"> <?php while ($nombres = mysqli_fetch_array($consulta1)){ echo " <li class='list-group-item'>".$nombres['usuario']."</li>"; } ?> </ul> <br> <?php if(isset($_SESSION['logged'])){?> <a href="salir.php"><button type="text" class="btn btn-primary"> Cerrar Sesión </button> </a> <?php }else{ } ?> </div> </div> <!-- Fin row --> </div> <!-- Fin container --> <footer class="footer"> <div class="container"> <span class="text-muted"> <p>Códigos <a href="https://www.baulphp.com/" target="_blank">BaulPHP</a></p> </span> </div> </footer> <!-- Bootstrap core JavaScript ================================================== --> <script src="dist/js/bootstrap.min.js"></script> <!-- Placed at the end of the document so the pages load faster --> </body> </html>
3) Archivo dbconect.php
Este fichero realizará la conexión con el servidor MySQL con PHP para las consultas.
<?php $servidor = "localhost"; $usuario = "root"; $password = ""; $database = "php_enlinea"; $conexion = mysqli_connect($servidor,$usuario,$password)or die(mysqli_error($conexion)); mysqli_select_db($conexion, $database)or die(mysqli_error($conexion)); ?>
4) Fichero cerrar sesión: salir.php
Al iniciar sesión el formulario se ocultara y para cerrar la sesión tendremos que usar este fichero, al presionar el botón salir.
<?php include "dbconect.php"; session_start(); $online2 = mysqli_query($conexion, "UPDATE usuarios SET online = '0' WHERE usuario = '".$_SESSION['usuario']."'")or die(mysqli_error($conexion)); session_destroy(); $url = "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; $url = str_replace('salir.php', "", $url); echo "<meta http-equiv='Refresh' content='0;url=".$url."'>"; ?>
C) FORMA 03: Usando sesión sin formulario
Estructura del siguiente ejemplo
1) Consultas de la base de datos.
Una pequeña consulta que podemos ejecutarlo en el PHPMyADMIN.
CREATE TABLE `usuarios_en_linea` ( `id` int(11) NOT NULL, `id_session` text CHARACTER SET latin1 NOT NULL, `fecha` text CHARACTER SET latin1 NOT NULL ) ENGINE=MyISAM DEFAULT CHARSET=utf8 COMMENT='Usuarios conectados'; ALTER TABLE `usuarios_en_linea` ADD PRIMARY KEY (`id`); ALTER TABLE `usuarios_en_linea` MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;
2) Fichero index.php
Archivo principal donde mostrara los usuarios en línea y también usaremos librerías externas como ser el BootStrap y JavaScript
<!doctype html> <html lang="es"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <title>Usuarios conectados con MySQL y BootStrap 4 | BaulPHP</title> <!-- Bootstrap core CSS --> <link href="dist/css/bootstrap.min.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="assets/sticky-footer-navbar.css" rel="stylesheet"> <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> </head> <body> <header> <!-- Fixed navbar --> <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark"> <a class="navbar-brand" href="#">BaulPHP</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarCollapse"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="index.php">Inicio <span class="sr-only">(current)</span></a> </li> </ul> <form class="form-inline mt-2 mt-md-0"> <input class="form-control mr-sm-2" type="text" placeholder="Buscar" aria-label="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Busqueda</button> </form> </div> </nav> </header> <!-- Begin page content --> <div class="container"> <h3 class="mt-5">Usuarios conectados con MySQL y BootStrap 4</h3> <hr> <div class="row"> <div class="col-12 col-md-12"> <!-- Contenido --> <div id="online">Usuarios conectados con MySQL y BootStrap 4: ?</div> <script> $.post("usuarios.php", {estado: "online"}, function(data) { $('#online').html(data); }); window.onbeforeunload = confirmaSalida; function confirmaSalida() { $.post("usuarios.php", {estado: "offline"}); } </script> <!-- Fin Contenido --> </div> </div> <!-- Fin row --> </div> <!-- Fin container --> <footer class="footer"> <div class="container"> <span class="text-muted"> <p>Códigos <a href="https://www.baulphp.com/" target="_blank">BaulPHP</a></p> </span> </div> </footer> <!-- Bootstrap core JavaScript ================================================== --> <script src="dist/js/bootstrap.min.js"></script> <!-- Placed at the end of the document so the pages load faster --> </body> </html>
3) Archivo config.php
Encargado de realizar la conexión con MySQL y posteriormente realizar las respectivas consultas con el sistema de usuarios online php
<?php $Server = 'localhost'; $UserBD = 'root'; $PasswordBD = ''; $BaseDatos = 'php_online'; $con =new mysqli($Server, $UserBD, $PasswordBD , $BaseDatos); ?>
4) Archivo de procesamiento: Usuarios.php
Sera el encargado de realizar las consultas como Seleccionar, Insertar y Borrar re3gistros de los usuarios en línea.
<?php if (isset($_POST["estado"])){ session_start(); include("config.php"); $estado = $_POST["estado"]; $id_session = session_id(); $tiempo = time(); $desconexion = $tiempo - 300; if($estado == "online"){ $repetido = mysqli_query($con,"SELECT id_session FROM usuarios_en_linea WHERE id_session='$id_session'"); if (mysqli_fetch_array($repetido) == 0){ mysqli_query($con,"INSERT INTO usuarios_en_linea (id_session,fecha) VALUES ('$id_session','$tiempo')"); } $online = mysqli_query($con,"SELECT COUNT(id_session) FROM usuarios_en_linea"); $row = mysqli_fetch_array($online); echo "Usuarios en Linea: " .$row[0]; } elseif ($estado == "offline"){ mysqli_query($con,"DELETE FROM usuarios_en_linea WHERE id_session='$id_session'"); } mysqli_query($con,"DELETE FROM usuarios_en_linea WHERE fecha<$desconexion"); } ?>
CONCLUSION DEL SISTEMA USUARIOS ONLINE PHP
Como lo han apreciado, la incorporación de este pequeño sistema no es muy complicado. Por lo tanto, rápidamente podemos implementarlo en nuestros proyectos web.
En este tutorial hemos mostrado 3 formas de poder implementar esta opción de visualizar usuarios online php.
- Usando PHP y MySQL.- Capturando la Ip del visitante y el tiempo de ingreso.
- Con formulario login.- Usando PHP y MySQL con sesión de usuarios.
- Generando sesión.- Se crea una sesión al visitar la página web.
Espero que esta breve explicación les ayude con sus proyectos web.
hola cris19n lograste solucionar lo que planteas en la pregunta. Actualmente estoy trabajando en esto y tengo el mismo problema
cuando el usuario se loguea se me actualiza la BD poniendo su estado a activo, y si el cierra sesión también se actualiza a desactivado, con esto valido que usuario está conectado y que no puede iniciar sesión más de una vez al mismo tiempo.
pero necesito saber cómo puedo actualizar su estado en la bd, si el usuario ha decidido irse de la página sin cerrar sesión manualmente, entonces necesito destruir esa sesión y también actualizar el estado en mi bd, para que así ese mismo usuario pueda iniciar sesión la veces que quiera, ya sea porque se cerró la sesión sola(por defecto PHP hace esto) o porque se le apago el pc, o se le fue el Internet, etc.
Hola NEstor Gracias buenos ejemplos muy necesarios para mi proyecto, ahora en el segundo ejemplo falta creo que el de iniciar.php, lo he buscado por todos lados no lo consigo, si me puede facilitar para comprender mejor el segundo ejemplo. Gracias
Hola Joan
Acabo de revisar el archivo de descarga y en el segundo ejemplo llamado «usuarios-on-line-login», si se encuentra el fichero iniciar.php
Vuelve a descargar y lo descomprimes, el contenido de iniciar.php es:
Saludos cordiales.
Agradecido 100% NEstor no lo habia visto! gracias por la ayuda
me gusta lo que hace por aquellas programadores que se esta iniciando asi como yo, espera que siga con sus tutoreales…
Seria bueno que cada sistema tenga su video tutoreal para asi ver cada paso que realiza…
Saludos Yohan,
Si justamente ya estaremos implementando videos en los siguientes artículos, que bien que le guste los tutoriales que hacemos. muchas gracias.