Simple long polling example with JavaScript and jQuery
After searching online, this was the answer I was looking for which doesn't use sockets.io
nor WebSockets
but does use jQuery
by taking advantage of its complete
method to create an artificial loop:
<div id="analytics"></div>
<script>
var analytics = document.getElementById('analytics');
(function poll(){
$.ajax({ url: "server", success: function(data){
analytics.innerHTML = data;
}, dataType: "json", complete: poll, timeout: 30000 });
})();
</script>
Source is Tian Davis from Technoctave: http://techoctave.com/c7/posts/60-simple-long-polling-example-with-javascript-and-jquery
technojas
Updated on June 26, 2022Comments
-
technojas almost 2 years
I'm trying to create a real-time website analytics dashboard which creates an open HTTP connection to the server using jQuery/JavaScript asynchronously to poll the server for updates to the data as and when they occur.
The obvious start for this would be to use an
XMLHttpRequest
object or jQuery's$.ajax
method to send aGET
orPOST
request to the server asynchronously requesting some data.However, beyond sending one request at a time using a
setInterval
method every30 seconds
I am not sure how to make the connection to the server persistent. Basically, I only want to send one http request and ensure the connection to the server stays open for polling!My example code with
setInterval
is as follows:<div id="analytics"></div> <script> var analytics = document.getElementById('analytics'); setInterval(function(){ $.ajax({ url: "http://server.com/", success: function(data){ analytics.innerHTML = data; }, dataType: "json"}); }, 30000); </script>