How to make all connected browsers reload initiate

2019-01-26 16:24发布

站内问答 / 后端开发
493 7 5

Suppose there is a webpage with dynamically generated content -- say a div containing the current number of connected browsers. When the count changes on the server I want all connected browsers to reload the count so that everyone sees the increment/decrement.

What's the best way to accomplish this?

Keywords: ajax, broadcast, browser, div, jquery

7条回答
Explosion°爆炸
2楼-- · 2019-01-26 16:54

it is possible to write a java applet which can work as a network server. Once the applet has successfully started, it can report its port and ip number back to the remote server.

Then your server can send messages to the client server any time it feels like. Your java applet can then hand the message off to javascript, or do whatever else.

This method requires java plugin support however, which is far from universal.

查看更多
0人赞 添加讨论(0) 举报
手持菜刀，她持情操
3楼-- · 2019-01-26 17:07

As of Dec 2014, there is a W3C proposed recommendation called Server Sent Events (SSE) that would allow you to do that over HTTP: http://www.w3.org/TR/eventsource

It seems that it is a standardization of a group of techniques known as Comet. (which Darrel linked to in his answer)

A full example from 2013 with Sinatra can be found at: http://html5hacks.com/blog/2013/04/21/push-notifications-to-the-browser-with-server-sent-events/

There is also a 2010 HTML5 Rocks article: http://www.html5rocks.com/en/tutorials/eventsource/basics/ , but the spec is likely t have changed a bit since.

Most current browsers support this API, with the notable exception of IE11: http://caniuse.com/#feat=eventsource

查看更多
0人赞 添加讨论(0) 举报
Bombasti
4楼-- · 2019-01-26 17:12

I think COMET might be what you're looking for. Web Sockets would be ideal but lack of browser adoption wouldn't make it practical right now.

查看更多
0人赞 添加讨论(0) 举报
Root（大扎）
5楼-- · 2019-01-26 17:14

HTTP protocol is stateless by design. The only one way to achieve this is to implement client-side polling via AJAX.

查看更多
0人赞 添加讨论(0) 举报
我命由我不由天
6楼-- · 2019-01-26 17:15

Here's how to do server-push using ajax long-polling. The browser makes an ajax request which initiates server-side self-polling. The ajax request remains open, waiting for a response until the file changes, and as soon as it gets a response, it makes a new long-polling request.

Here's what it looks like with jQuery and php, implementing the example of live-updating a div in the html showing the number of clients currently connected:

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);
}
?>

NOTE: This does not track disconnects, so it's more like live-tracking the total number of pageviews. See Running server-side function as browser closes for info on keeping track of browser disconnects, ie, server-side action on client disconnect.

查看更多
0人赞 添加讨论(0) 举报
我命由我不由天
7楼-- · 2019-01-26 17:20

Pushlets?

查看更多
0人赞 添加讨论(0) 举报
1 2 下一页
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)