Keeping a jQuery .getJSON() connection open and waiting while in body of a page?

Asked 30/4, 2009 at 22:29 Answered 14/1, 2013 at 3:23

Solved javascript jquery comet server-push

I'm writing a basic push messaging system. A small change has caused it to stop workingly properly. Let me explain. In my original version, I was able to put the code in the of a document something like this:

<head>
  ...text/javascript">
  $(document).ready(function(){
    $(document).ajaxStop(check4Updates);
    check4Updates();
  });

  function check4Updates(){
    $.getJSON('%PATH%', callback);
  };
...
</head>

This worked nicely and would keep the connection open even if the server return null (which it would after say a 2 minute timeout). It would just keep calling the getJSON function over and over indefinitely. Happy Panda.

Now, I must put the code segment in between tags. Access to the $(document).ready() function pretty much won't work.

<body>
...
check4Updates();
$("body").ajaxStop(check4Updates);
...
</body>

This works... for a while. Shortly thereafter, it will stop calling check4Updates and get into an infinite loop and use 100% processor time.

I'm trying to get it so that check4Updates is repeatedly called until the page is closed. If anyone has any insights as to why my simple change is no longer functioning as expected, PLEASE let me know. Thank you for taking the time to read and help me out.

Best Regards, Van Nguyen

Encumber answered 30/4, 2009 at 22:29 Comment(0)

Yeah, you're not going to want to use that loop, you're pretty much DOSing yourself not to mention locking the client.

Simple enough, create a polling plugin:

Source: http://web.archive.org/web/20081227121015/http://buntin.org:80/2008/sep/23/jquery-polling-plugin/

Usage:

$("#chat").poll({
    url: "/chat/ajax/1/messages/",
    interval: 3000,
    type: "GET",
    success: function(data){
        $("#chat").append(data);
    }
});

The code to back it up:

(function($) {
    $.fn.poll = function(options){
        var $this = $(this);
        // extend our default options with those provided
        var opts = $.extend({}, $.fn.poll.defaults, options);
        setInterval(update, opts.interval);

        // method used to update element html
        function update(){
            $.ajax({
                type: opts.type,
                url: opts.url,
                success: opts.success
            });
        };
    };

    // default options
    $.fn.poll.defaults = {
        type: "POST",
        url: ".",
        success: '',
        interval: 2000
    };
})(jQuery);

Dissimulate answered 30/4, 2009 at 23:11 Comment(1)

yeah, or almost sounds like he wants comet. plugins.jquery.com/project/Comet – Abampere 30/4, 2009 at 23:14

Use a timeout, these types of loops are a really bad idea, so if you must employ polling for whatever reason, make sure you don't keep hammering your backend.

Waneta answered 30/4, 2009 at 22:39 Comment(0)

You either need to change to a polling method as described by altCognito, or you can use comet, which is designed to push data from the server to the client. Depending on your needs, you could use something like Jetty (for Java) or Twisted (Python) or WebSync (ASP.NET/IIS)

Tuesday answered 10/1, 2010 at 16:42 Comment(0)

I think that this is about server push?

How about using the Socket.IO?

Ref: Introducing Socket IO 0.9, Google Group (http://socket.io/)

Ref: http://techoctave.com/c7/posts/60-simple-long-polling-example-with-javascript-and-jquery

Ref: Fun with websockets, Node.js and jQuery (http://nayna.org/blog/?p=159)

Elector answered 14/1, 2013 at 3:23 Comment(0)

Recommended topics

Hot tags