-1

¡Hola de nuevo! bueno, tengo este codigo:

<?php
       include("conexion.php");
            $usuario = $_SESSION['creador'];
        
        $query_notif = mysqli_query($conn, "SELECT * FROM notificaciones WHERE usuario = '$usuario' AND leer = '0'");
        
        $count_notif = mysqli_num_rows($query_notif);
        if ($count_notif > 0) { ?>
        <a href="menu-notif.php"><div class="perfil-container-2">
           <img src="img/menu-notif%203.png?1.1" onmouseover="this.src='img/menu-notif%204.png?1.1';" onmouseout="this.src='img/menu-notif%203.png?1.1';" alt="">
       </div></a>
       <?php } else if ($count_notif == 0) { ?>
       <a href="menu-notif.php"><div class="perfil-container-2">
           <img src="img/menu-notif.png?1.2" onmouseover="this.src='img/menu-notif%202.png?1.2';" onmouseout="this.src='img/menu-notif.png?1.2';" alt="">
       </div></a>
       <?php } ?>

Tambien tengo otros codigos con los que necesito hacer lo mismo, pero este es el importante. Basicamente, tengo una tabla de notificaciones, que obviamente deberia actualizarse cada cierto tiempo por si un usuario recibe una notificacion importante. Mi pregunta es como hacer esto sin jquery, ajax u otra libreria externa, ya que no me gusta utilizar librerias externas, se que se puede hacer con Javascript, pero no se mucho de este, asi que recurro a ustedes para buscar ayuda. Resumen: ¿Como hago para que este codigo php se actualice cada cierto tiempo sin librerias externas?. Lo que quiero hacer es lo que ya tiene stack overflow si se dan cuenta, que las notificaciones son en vivo.

¡Gracias por la ayuda que puedan brindarme!

EDIT: El codigo funciona a la perfeccion, no tiene ni un pequeño error, lo unico que necesito es lo que pregunte.

8
  • Ajax no es una librería, es una parte de Javascript que te permite intercambiar datos entre cliente y servidor, teniendo la posibilidad de actualizar el cliente con la nueva información sin necesidad de recargar la página. Hay un modo de usar Ajax sin jQuery (que sí es una librería), si buscas aquí mismo encontrarás varios ejemplos. Javascript tiene también una API más moderna que es fetch (puedes investigar sobre ella). Dependiendo de lo que quieras realmente, se podría también programar un cron, que lance cada X tiempo el archivo PHP que actualiza la base de datos...
    – A. Cedano
    Commented el 15 sept. 2020 a las 19:39
  • pero ajax es una especie de "archivo externo" no? es decir, tengo que poner un link a el, como con jquery y demas. btw no se puede hacer sin ellos? por lo que se si se puede, pero obviamente es mas facil con ajax y jquery, aunque quiero evitar este tipo de "programas" (no se como llamar a estas cosas como jquery, ajax y demas xd) Commented el 15 sept. 2020 a las 19:44
  • Estoy leyendo sobre ajax y si, son muchos pasos que quiero evitar, porque me parece innecesario, ya que por lo que se con js y php se puede hacer literalmente todo lo que me ocurra, por lo que supongo que se puede hacer lo que pido Commented el 15 sept. 2020 a las 19:45
  • No, como ya dije, Ajax es parte de Javascript. Aquí está todo explicado brevemente, y cada enlace de los apartados te explicará lo que quieres saber y te enseñará código para hacerlo. De todos modos, si es una actualización que no depende necesariamente del cliente puedes programar un cron a nivel de sistema operativo (servidor) y llamar desde él al archivo PHP que actualiza los datos. Es un punto que no queda claro en la pregunta, o sea, ¿cuál es la acción o contexto que determina que los datos deben actualizarse?
    – A. Cedano
    Commented el 15 sept. 2020 a las 19:49
  • una nueva notificacion en la base de datos, o sino, cada cierta cantidad de segundos Commented el 15 sept. 2020 a las 19:54

3 respuestas 3

0

Suponiendo que este codigo es un archivo .php independiente sin nada mas, puedes hacer lo siguiente en la pagina que lo llama:

Suponiendo que este archivo se llama notificaciones.php

<?php
   include("conexion.php");
   $usuario = $_SESSION['creador'];
   // observacion: no es necesario usar SELECT * si solo los vas a contar para reducir la carga de memoria
   $query_notif = mysqli_query($conn, "SELECT 1 FROM notificaciones WHERE usuario = '$usuario' AND leer = '0'"); 
   $count_notif = mysqli_num_rows($query_notif);
   if ($count_notif > 0) { ?>
    <a href="menu-notif.php"><div class="perfil-container-2">
       <img src="img/menu-notif%203.png?1.1" onmouseover="this.src='img/menu-notif%204.png?1.1';" onmouseout="this.src='img/menu-notif%203.png?1.1';" alt="">
   </div></a>
   <?php } else if ($count_notif == 0) { ?>
   <a href="menu-notif.php"><div class="perfil-container-2">
       <img src="img/menu-notif.png?1.2" onmouseover="this.src='img/menu-notif%202.png?1.2';" onmouseout="this.src='img/menu-notif.png?1.2';" alt="">
   </div></a>
   <?php } ?>

Y en la pagina donde lo incluyes puedes usar:

 <div id="notificaciones"><!-- aqui se incrustará --></div>
 <script>
     setInterval(function(){
         var request = new XMLHttpRequest();
         request.open("GET", "notificaciones.php", true);
         request.onreadystatechange = function()
         {
             if (request.readyState == 4 && request.status == 200)
             {
                 document.getElementById("notificaciones").innerHTML = request.responseText;
             }
         }
         request.send();
     },5000); // cada 5 segundos
 </script>

Tambien puedes usar fetch() que es una version mas moderna de API para peticiones asincronas:

 <div id="notificaciones"><!-- aqui se incrustará --></div>
 <script>
     setInterval(function(){
         fetch('notificaciones.php')
         .then(function(response) {
           return response.text();
         })
         .then(function(text) {
           document.getElementById("notificaciones").innerHTML = text;
         });
     },5000);
 </script>

Finalmente, puedes ahorrarte un poco de codigo y optar por usar jQuery para reducir el codigo a esto:

<div id="notificaciones"><!-- aqui se incrustará --></div>
 <script>
     setInterval(function(){
         $("#notificaciones").load("notificaciones.php");
     },5000);
 </script>


 
-1

Puedes utilizar el header "Refresh" del protocolo http con el intervalo necesario:

$page = $_SERVER['PHP_SELF'];
$sec = "10";
header("Refresh: $sec; url=$page");

https://stackoverflow.com/a/12383397/327786

-2

Puedes recargar la página cada cierto tiempo con setTimeout, ojo aquí se recarga la página completa

 <script type="text/javascript">
       setTimeout(function(){ location.reload(1);}, 15000);
    </script>

Tambien puedes realizar la actualización de un solo div, de está manera

$("#iddiv").load("url")
8
  • Supongo que usare ajax, aunque no me guste jaja, ya que no quiero que se actualice toda la pagina. Pero me puedes explicar el segundo codigo que pasaste? Commented el 15 sept. 2020 a las 19:56
  • Ajax existe precisamente para que NO se actualice toda la página.Con Ajax puedes usar la respuesta del servidor para actualizar solamente la parte de la página que te interesa. Además, en este código no se usa Ajax para nada.
    – A. Cedano
    Commented el 15 sept. 2020 a las 20:02
  • Si, genial, supongo que me pondre a investigar Commented el 15 sept. 2020 a las 20:06
  • Agradecería que quien me dio un -1 especificara el porque Commented el 15 sept. 2020 a las 20:14
  • Ahora puedes usar settimeout y usar el ajax dentro, te proporciono los herramientas que puedes usar solo es hacer volar tu imaginación setTimeout(function(){ $.ajax({ url: '/path/to/file', type: 'default GET (Other values: POST)', data: {param1: 'value1'}, }) .done(function(res) { //Aqui actualiza la tabla con la respuesta que regrese }) .fail(function() { console.log("error"); }); }, 15000); Commented el 15 sept. 2020 a las 20:16

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.