2

I'll try and explain this as best I can. But basically on a website when you have some dynamic content such as messages, notifications, etc... You would want this information to be presented to the user as soon as the message arrived. Example a user is sent a new message show show a bubble with the count in the header of your website.

You see this stuff on nearly every single website these days and I'm unsure as to the best way to implement such a feature.

My initial idea was to write some ajax call and then wrap this in a setInterval call so it's requested every 30 or so seconds. The obvious problem here is that a) you have to wait 30 seconds for the request and b) you might be requesting the server hundreds of times in a day with no actual new content to ever display.

My second thought was to use EventListeners as they seem for more ideal as from what I understand they only do a request when the server tells it something. But I'm not 100% sure how to build something like this. Can anyone whip up a quick example or point to something that would serve as the basis for something like this?

So to clarify what I want to do:

When something new happens like sending a message or creating a notification this will send an event that the event listener picks up and updates something on the page either showing a small popup with the info or updating a bubble e.g. Messages (2)

I'll be using CakePHP and jQuery to implement this. So anything specific to this would be awesome... Hopefully someone can help me out.

Essentially I'm asking about EventListener vs setInterval and how it would work with ajax calls...

Cameron
  • 24,868
  • 91
  • 263
  • 449
  • Possible duplicate of http://stackoverflow.com/questions/10672604/live-new-message-notification/10672708#10672708 – thomas Jun 30 '12 at 13:55
  • Not a duplicate as I'm asking specific to EventListener vs setInterval – Cameron Jun 30 '12 at 13:57
  • Better question for programmers.se not so – rlemon Jun 30 '12 at 14:00
  • 1
    You should use [COMET](http://en.wikipedia.org/wiki/Comet_%28programming%29) techniques – Alex Ball Jun 30 '12 at 14:16
  • Alex is correct. You should look into comet/ajax push. Here are a couple SO questions that might interest you: http://stackoverflow.com/questions/603201/using-comet-with-php http://stackoverflow.com/questions/621802/choosing-and-deploying-a-comet-server also this screencast is really good http://www.screenr.com/SNH – swiecki Jun 30 '12 at 17:36

1 Answers1

2

As suggested by Alex Ball, you should research about COMET programming techniques, and also look at the answers for this question Simple comet example using php and jquery. There isn't really a "simple" answer to implement an effective technique to what you are asking for but the most effective one is using an iframe. Using an iframe will allow you to have a persistent connection with the server (PHP side). Here you will be able to check for new messages (query for new messages) and if there is any, return your data. Your ajax call (success function) will the process this data and then do another post back to the server. If there is none then you would have to loop. Again, effective COMET Programming techniques are not simple to implement. Here are some useful examples though: http://www.webreference.com/programming/javascript/rg30/index.html , http://www.zeitoun.net/articles/comet_and_php/start , setInerval wouldn't be effective for chat, maybe notifications.

COMET techniques are not specific to CakePHP.

Community
  • 1
  • 1
antoniovassell
  • 962
  • 12
  • 20