php - 每 30 秒获取一次表数据

Question

如何每 30 秒从数据库行中获取所有数据并只显示一个数据，30 秒后显示下一行？

目前这是我的查询:

    <?php
    
    require_once 'dbconfig.php';

    $query = $db_con->query('SELECT * FROM rds ORDER BY news_id DESC');
    $fetch = $query->fetch();
    echo $fetch['message']; 
    ?>

我需要显示来自数据库的一条消息，30 秒后显示来自数据库的下一条消息

Answer 1

您将执行的操作有两个不同的组成部分。一种是浏览器中数据的图形表示。这也是每隔 30 秒从服务器请求新数据的原因。第二部分是它的请求。如果您希望每次都不同，这部分必须知道对它的要求是什么。

我们现在将它们放在单独的文件中。 Web 部分将称为“web.php”，而获取部分将称为“fetch.php”。以下是“fetch.php”的关键特性:

<?php

require_once 'dbconfig.php';

$row = $_GET['row']+0;

$query = $db_con->query("SELECT * FROM rds ORDER BY news_id DESC LIMIT $row,1");
$fetch = $query->fetch();
echo $fetch['message']; 
?>

这与您的第一个脚本相同，除了它现在可以被告知要返回数据库的哪一行。在 URL 中传递的数据可以使用 $_GET 获取，就像我在这里所做的那样。在这种情况下，如果我要请求 URL“fetch.php?row=7”，$_GET['row'] 的值将为 7。

“web.php”包含如下内容:

<div id='content'></div>

<script>
    i = 1;
    setInterval(getdata,30000);
    getdata(){
        microAjax("fetch.php?row="+i,printdata);
        i++;
        }
    printdata(a) {
        document.getElementById("content").innerHTML = document.getElementById("content").innerHTML + "<p>"+a+"</p>";
        }
</script>

<script>function microAjax(B,A){this.bindFunction=function(E,D){return function(){return E.apply(D,[D])}};this.stateChange=function(D){if(this.request.readyState==4){this.callbackFunction(this.request.responseText)}};this.getRequest=function(){if(window.ActiveXObject){return new ActiveXObject("Microsoft.XMLHTTP")}else{if(window.XMLHttpRequest){return new XMLHttpRequest({mozSystem: true})}}return false};this.postBody=(arguments[2]||"");this.callbackFunction=A;this.url=B;this.request=this.getRequest();if(this.request){var C=this.request;C.onreadystatechange=this.bindFunction(this.stateChange,this);if(this.postBody!==""){C.open("POST",B,true);C.setRequestHeader("X-Requested-With","XMLHttpRequest");C.setRequestHeader("Content-type","application/x-www-form-urlencoded");C.setRequestHeader("Connection","close")}else{C.open("GET",B,true)}C.send(this.postBody)}};</script>

这里我们使用 setInterval() 告诉 JavaScript 每 30 秒调用一次函数 getdata()。它使用 MicroAjax ，一个非常轻量级的 Ajax 解析，我将其附加到第二组脚本标记中，以请求数据。一旦 MicroAjax 接收到数据，它就会调用 printdata() 并将其添加到 HTML 的末尾。

如果您添加 JQuery，它当然会使事情变得更好。这些只是基础知识，即使添加 CSS 后它们看起来会略有不同，但它们仍然适用。最后，这就是现在许多优秀网站所做的，而不是重新加载或将您转到另一个页面；他们只是使用 AJAX 获取新内容。

根据您打算执行的其他操作，您可能想要切换 AJAX 库。我只是使用 MicroAjax，因为它小巧轻便，我可以将它直接复制到脚本中(谷歌似乎已经删除了他们以前的页面，所以我找不到 CDN)。

希望这对您有所帮助。