Question

很抱歉，如果这是一个全新的问题，但我似乎无法在网上找到我的问题的任何答案......

我正在建立一个网站，这取决于网页上的某些数据是否需要自动更新....

更具体地说，当在MySQL数据库中进行更改时。例如，假设数据库中一行的值为10，并且更改为11，我需要页面自动从数据库中获取该值，并在站点上更新它。另外，如果可能的话，当实际数据发生变化时，有什么方法可以让数字“弹出”一点吗？

<div class="container hero-unit">
    <h1>Test Data Change</h1>
    <p>231</p>
    <p>7</p>
    <p>14532</p>
</div>

让我们说这些数字是从数据库中提取的，当对数据库进行更改时，如何使用“AJAX”自动更改此数据？

如果可以的话，我会感激每一个贡献......

Answer 1

此过程称为polling。基本上有两种方法可以实现long polling和short polling

在Short polling中，你基本上会制作一个计时器并从php文件中获取信息，该文件每隔几秒左右输出一次db数据，然后你比较数据以查看数据是否已经更新。

然后有long polling这是首选，因为它对服务器施加的压力较小。 FB使用long polling。在这个过程中，你基本上做的是你向一个php文件发出请求，并且php文件没有响应，直到数据库中有更新，所以不是每隔几秒就向php文件发一个ajax请求一分钟左右，减少对服务器的压力。

您可以在https://techoctave.com/c7/posts/60-simple-long-polling-example-with-javascript-and-jquery

找到长轮询示例

此处有更多示例https://gist.github.com/jhbsk/4353139

Answer 2

如果你使用的是php，那么你可能会遵循这个代码 -

在你的HTML中，

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#load_tweets').load('record_count.php').fadeIn("slow");
}, 1000); // refresh every 1000 milliseconds

<body>
<div id="load_tweets"> </div>
</body>

在PHP（record_count.php）文件中 -

<?php
include("db.php");
$search_word=$_GET['q'];
$sql = mysqli_query($db,"Select number form Users");
$record_count=mysqli_num_rows($sql);
//Display count.........
echo $record_count;
?>

参考：http://www.9lessons.info/2009/07/auto-load-refresh-every-10-seconds-with.html

Answer 3

简短的回答是，一旦浏览器出现了页面，那就是连接的结束。服务器无法通知浏览器发生了什么事。

但是，使用JavaScript，您可以对服务器发出即时请求，这个过程称为Ajax。为此，您需要2个部分：

响应请求并发回结果的PHP脚本
发送请求并处理结果的JavaScript。

PHP脚本可以相对简短：

<?php
    $id=@intval($_GET['id']);
    //  get data from database into an array
    print json_encode($result);
?>

JavaScript只需发送请求并处理响应。诀窍是定期执行此操作，例如使用window.setInterval。

var xhr=new XMLHttpRequest();
xhr.onload=doit;
var url='…?id=…';
xhr.open('get',url,true);

window.setInterval(poll,1000);  // every second

function poll() {
    xhr.send(null); 
}

function doit() {
    var result=this.response;
    result=JSON.parse(result);
    //  etc
}

如果没有特定数据，上面的代码是未经测试的，但这大致是它应该如何工作。

在MySQL数据库中发现更改时更新HTML

3 个答案: