如何通过服务器端事件重新启动所有连接的浏览器

小编典典

如何通过服务器端事件重新启动所有连接的浏览器

ajax

假设存在一个包含动态生成内容的网页-
例如，一个div包含当前已连接浏览器的数量。当服务器上的计数更改时，我希望所有连接的浏览器重新加载计数，以便每个人都可以看到增量/减量。

做到这一点的最佳方法是什么？

关键字：ajax，广播，浏览器，div，jquery

阅读 262

2020-07-26

共1个答案

小编典典

这是使用ajax长轮询进行服务器推送的方法。浏览器发出一个ajax请求，该请求启动服务器端自轮询。Ajax请求保持打开状态，等待响应，直到文件更改为止，并且一旦获得响应，它就会发出一个新的长轮询请求。

这是jQuery和php的外观，实现了在html中实时更新div的示例，该示例显示了当前连接的客户端数量：

index.html：

<html>
<head>
<title>Comet Test</title>
  <script type="text/javascript" src="jquery.js"></script>
  <script type="text/javascript" src="longpolling.js"></script>
</head>
<body>
  Number of connected users: <div id="total">0</div>
</body>
</html>

longpolling.js：

$(document).ready(function() { connectToServer(1); });

function connectToServer( incp ) {
  $.get("LongPolling.php",
        { inc: incp },
        function(resp) {
          $('#total').html(resp);
          connectToServer(0);
        }
       );
}

LongPolling.php：

<?php

# (over)write file with contents, locking the file while doing so.
# just barf and die if there's an error.
function update($file, $contents)
{
  $f = fopen($file, 'w');
  if(!$f) { echo "ERROR1"; exit; } # couldn't open file for writing.
  if(!flock($f, LOCK_EX)) { echo "ERROR2"; exit; } # couldn't get lock.
  fwrite($f, $contents);
  fclose($f);  # this also releases the lock.
  return $contents;
}

# fetch the contents of the given file.
# if the file doesn't exist, create it with contents "0"
function fetch($file)
{
  if(file_exists($file)) {
    if(!is_readable($file)) { echo "ERROR3"; exit; }
    $x = file_get_contents($file);
  } else {
    $x = 0;
    update($file, $x);
  }
  return $x;
}

$fc = 'connx.txt';   # file that stores the number of connections.

if ( $_REQUEST['inc'] == 1 ) {  # someone just connected.
  echo update($fc, fetch($fc)+1);
} else {  # someone is reconnecting (also happens immediately after connect).
  $last = filemtime($fc);
  do {  # wait until some other instance causes $fc to change...
    sleep(1);
    clearstatcache(); # otherwise filemtime() results are cached!
  } while(filemtime($fc) == $last);
  echo fetch($fc);
}
?>

注意：这不会跟踪断开连接，因此它更像是实时跟踪浏览量的总数。

2020-07-26