JQuery Ajax displays data as it arrives

Question

Let's say I have a page that slowly returns a bunch of data over time. For example, this, for example:

<?php $iTime = time(); while(time()-$iTime < 10 ) { echo "Hello world"; echo str_repeat( ' ', 1024 ) . "<br />"; flush( ); sleep(3); } ?> 

I want to show all the data as it appears. Thus, he will update "live". As with sending a data string, will this allow me to analyze the data and display it?

Is there a way to do this through jquery? I apologize if this was asked earlier

Thank you for your time!:)

Answer 1

Of course, building a basic long comet-style survey is pretty trivial:

PHP:

 <?php $data = null; while ($data == null) { $data = find_data($_REQUEST['last_update']); // This is up to you. // Although you may do a DB query, that sort of breaks the model // from a scalability perspective. The point in this kind of // operation is to rely on external data to know that it needs to // update users, so although you can keep your data in a DB, you'll // want a secondary storage mechanism to keep from polling it. // // Conceptually, you'd put new information into this data storage // system when something changes (like new data from an external // source. The data storage system could check to see if a file // has been updated or if there is new data in something like a // memcached key. You'd then consume the data or otherwise // mark it as used. sleep(5); } echo json_encode($data); 

JavaScript:

  function setListener() { $.ajax({ url: 'updater.php', dataType: 'json', success: function(data, status, xhr) { // do something, such as write out the data somewhere. setListener(); }, error: function() { setTimeout(setListener,10000); } }); } 

Answer 2

take a look at the ajax-http-stream jquery plugin. It extends jquery ajax calls to accept comet-style data passed from the backend, and will call the OnDataRecieved function when new data OnDataRecieved .

Answer 3

Well, you push the limitations of the HTTP protocol itself, so this is less jQuery and more about web programming. If you really need a real-time push, then another protocol is suitable, for example XMPP (which is used by several large players, for example Google Wave).

However, with jQuery, I would use a regular poll on low-cost, low-power resources to do the job (it's easy to create static resources that use HTTP caching properly, relying on REST to guide you), so something similar to;

• setTimeout ('myPoll ("http: // my_feed")', 500);
• my_feed using HTTP caching as a static tool (possibly for each user, if necessary)