Is there a way to have a live connection (like for a chat server) with a server using only HTML(5)/JavaScript?
Apparently FF4, Chrome, and Safari all support Web Sockets.
Here's a firefox example, although I'm not sure the spec is completely finalized yet.
Due to the nature of HTTP (only clients can start requests), you would need a "Push" server (aka Comet) on the server-side. You'd still only need JS on the client. See:
HTTP Streaming for an explanation of the technology
APE: Ajax Push Engine for usable implementation
Comet Daily for news on Comet
This can also be implemented with a periodic refresh (polling) if you can't install a Comet engine on the server.
Yup. AJAX and some server code to handle messages updates is all you need to create just such a system. As #NullUserException noted, something like Comet might make this easier.
Related
I'm trying to understand how does websocket work and I can't find any decent tutorial.
How can I work with websocket on a windows server? Does it require any extension and some PHP code? Is it a socket? or some sort of Comet new technology?
If I'm working on, for example, www.websocket.com/game/1.htm, and I want to have a websocket connection on this page, What url should I use?
Thanks
Read this: http://chimera.labs.oreilly.com/books/1230000000545/ch17.html
In the MS ecosystem there are several options for using WebSockets:
ASP.NET (requires that the server be windows 8 or 2012), can run in the same port than your web app: http://msdn.microsoft.com/en-us/library/vstudio/system.net.websockets
XSocket.NET: http://xsockets.net/
SuperWebSocket : http://superwebsocket.codeplex.com/
Alchemy Websocket: http://alchemywebsockets.net/
WebSocketListener : https://github.com/vtortola/WebSocketListener
Actually there are not really requirements for a "PHP based websocket". In fact, the websocket is not really more than a simple "connection" as you always make. When you go to your url, in any way, you setup this "socket". Now the only goal you have to achieve is to make sure this connection does not "die".
This is simply achieved by setting a time limit on your script like so:
set_time_limit(0);
This means the script will never time-out while "connecting" to the URL. After that you simply do your stuff as in
new PHPWebSocket();
Then you can do what ever you want with it, while keeping a connection. This is just a short story, there are other ways but I suggest you read some more about websockets and how PHP can "handle" it.
Well, if you like to use WebSockets in Windows, the best choice is:
SignalR
It makes the development very simple, and it also works with browsers that don't support websockets yet, using normal AJAX long-polling, or Forever Frame, etc.
Take one example, study a litle, and you'll be able to make incredible real-time websites.
It's amazing, websockets are the future!
Of course I am aware of Ajax, but the problem with Ajax is that the browser should poll the server frequently to find whether there is new data. This increases server load.
Is there any better method (even using Ajax) other than polling the server frequently?
Yes, what you're looking for is COMET http://en.wikipedia.org/wiki/Comet_(programming). Other good Google terms to search for are AJAX-push and reverse-ajax.
Yes, it's called Reverse Ajax or Comet. Comet is basically an umbrella term for different ways of opening long-lived HTTP requests in order to push data in real-time to a web browser. I'd recommend StreamHub Push Server, they have some cool demos and it's much easier to get started with than any of the other servers. Check out the Getting Started with Comet and StreamHub Tutorial for a quick intro. You can use the Community Edition which is available to download for free but is limited to 20 concurrent users. The commercial version is well worth it for the support alone plus you get SSL and Desktop .NET & Java client adapters. Help is available via the Google Group, there's a good bunch of tutorials on the net and there's a GWT Comet adapter too.
Nowadays you should use WebSockets.
This is 2011 standard that allows to initiate connections with HTTP and then upgrade them to two-directional client-server message-based communication.
You can easily initiate the connection from javascript:
var ws = new WebSocket("ws://your.domain.com/somePathIfYouNeed?args=any");
ws.onmessage = function (evt)
{
var message = evt.data;
//decode message (with JSON or something) and do the needed
};
The sever-side handling depend on your tenchnology stack.
Look into Comet (a spoof on the fact that Ajax is a cleaning agent and so is Comet) which is basically "reverse Ajax." Be aware that this requires a long-lived server connection for each user to receive notifications so be aware of the performance implications when writing your app.
http://en.wikipedia.org/wiki/Comet_(programming)
Comet is definitely what you want. Depending on your language/framework requirements, there are different server libraries available. For example, WebSync is an IIS-integrated comet server for ASP.NET/C#/IIS developers, and there are a bunch of other standalone servers as well if you need tighter integration with other languages.
I would strongly suggest to invest some time on Comet, but I dont know an actual implementation or library you could use.
For an sort of "callcenter control panel" of a web app that involved updating agent and call-queue status for a live Callcenter we developed an in-house solution that works, but is far away from a library you could use.
What we did was to implement a small service on the server that talks to the phone-system, waits for new events and maintains a photograph of the situation. This service provides a small webserver.
Our web-clients connects over HTTP to this webserver and ask for the last photo (coded in XML), displays it and then goes again, asking for the new photo. The webserver at this point can:
Return the new photo, if there is one
Block the client for some seconds (30 in our setup) waiting for some event to ocurr and change the photograph. If no event was generated at that point, it returns the same photo, only to allow the connection to stay alive and not timeout the client.
This way, when clients polls, it get a response in 0 to 30 seconds max. If a new event was already generated it gets it immediately), otherwise it blocks until new event is generated.
It's basically polling, but it somewhat smart polling to not overheat the webserver. If Comet is not your answer, I'm sure this could be implemented using the same idea but using more extensively AJAX or coding in JSON for better results. This was designed pre-AJAX era, so there are lots of room for improvement.
If someone can provide a actual lightweight implementation of this, great!
An interesting alternative to Comet is to use sockets in Flash.
Yet another, standard, way is SSE (Server-Sent Events, also known as EventSource, after the JavaScript object).
Comet was actually coined by Alex Russell from Dojo Toolkit ( http://www.dojotoolkit.org ). Here is a link to more infomration http://cometdproject.dojotoolkit.org/
There are other methods. Not sure if they are "better" in your situation. You could have a Java applet that connects to the server on page load and waits for stuff to be sent by the server. It would be a quite a bit slower on start-up, but would allow the browser to receive data from the server on an infrequent basis, without polling.
You can use a Flash/Flex application on the client with BlazeDS or LiveCycle on the server side. Data can be pushed to the client using an RTMP connection. Be aware that RTMP uses a non standard port. But you can easily fall back to polling if the port is blocked.
It's possible to achive what you're aiming at through the use of persistent http connections.
Check out the Comet article over at wikipedia, that's a good place to start.
You're not providing much info but if you're looking at building some kind of event-driven site (a'la digg spy) or something along the lines of that you'll probably be looking at implementing a hidden IFRAME that connects to a url where the connection never closes and then you'll push script-tags from the server to the client in order to perform the updates.
Might be worth checking out Meteor Server which is a web server designed for COMET. Nice demo and it also is used by twitterfall.
Once a connection is opened to the server it can be kept open and the server can Push content a long while ago I did with using multipart/x-mixed-replace but this didn't work in IE.
I think you can do clever stuff with polling that makes it work more like push by not sending content unchanged headers but leaving the connection open but I've never done this.
You could try out our Comet Component - though it's extremely experimental...!
please check this library https://github.com/SignalR/SignalR to know how to push data to clients dynamically as it becomes available
You can also look into Java Pushlets if you are using jsp pages.
Might want to look at ReverseHTTP also.
I am looking at facebook news feed/ticker right now and I am wondering what technology/architecture it uses to pull in data asynchronously when any of my connections make an update. One possibility that I can think of is a javascript setInterval on a function that aggressively polls the server for new data.
I wonder how efficient that is.
Another possible technology that I can think of is something like Comet/NodeJS architecture that pings the client when there is an update on the server. I am not too familiar with this technology.
If I wanted to create something similar to this. What should I be looking into? Is the first approach the preferred way to do this? What technologies are available out there that will allow me to do this?
There are several technologies to achieve this:
polling: the app makes a request every x milliseconds to check for updates
long polling: the app makes a request to the server, but the server only responds when it has new data available (usually if no new data is available in X seconds, an empty response is sent or the connection is killed)
forever frame: a hidden iframe is opened in the page and the request is made for a doc that relies on HTTP 1.1 chunked encoding
XHR streaming: allows successive messages to be sent from the server without requiring a new HTTP request after each response
WebSockets: this is the best option, it keeps the connection alive at all time
Flash WebSockets: if WS are not natively supported by the browser, then you can include a Flash script to enhance that functionality
Usually people use Flash WebSockets or long-polling when WebSockets (the most efficient transport) is not available in the browser.
A perfect example on how to combine many transport techniques and abstract them away is Socket.IO.
Additional resources:
http://en.wikipedia.org/wiki/Push_technology
http://en.wikipedia.org/wiki/Comet_(programming))
http://www.leggetter.co.uk/2011/08/25/what-came-before-websockets.html
Server polling with JavaScript
Is there a difference between long-polling and using Comet
http://techoctave.com/c7/posts/60-simple-long-polling-example-with-javascript-and-jquery
Video discussing different techniques: http://vimeo.com/27771528
The book Even Faster Websites has a full chapter (ch. 8) dedicated to 'Scaling with Comet'.
I could be wrong, but I think that Facebook relies on a "long polling" technique that keeps an http connection open to a server for a fixed amount of time. The data sent from the server triggers an event client side that is acted upon at that time. I would imagine that they use this technique to support the older browsers that do not have websocket support built in.
I, personally, have been working on an application with similar requirements and have opted to use a combination of node.js and socket.io. The socket.io module uses a variety of polling solutions and automatically chooses the best one based on what is available on the client.
Maybe you may have a look to Goliath (non-blocking IO server written in Ruby) : http://postrank-labs.github.com/goliath/
Are there websocket libraries (like ajax for jquery) I can use on the browsers with fallback to ajax long polling?
I found that Socket.IO implements a weird, arbitrary layer over the WebSocket protocol. I'd rather just pass raw data back and forth, so for my project, I went with web-socket-js.
web-socket-js works similarly to Socket.IO in that it reverts to using Flash sockets if WebSocket support is unavailable. Thus, it works in all the major browsers that support Flash (I tested this myself).
Just make sure you open port 843 in your firewall or you'll get a Flash security policy error. You'll probably need a script to listen on port 843 as well...I used em-websocket for the socket server, and in its readme I believe is a link to a Perl script that provides this.
Library with WebSockets support and fallback long polling solution would probably depend also on server side technology and not only browser client. Try to look at socket.io for example.
I have been using SignalR for the last several months, and it is awesome. It does what Socket.IO does, but maybe even better. It degrades as follows: Web Sockets, Server Sent Events, Forever Frame, AJAX long polling. Only works with .NET though.
https://github.com/SignalR/SignalR/wiki/Faq
Yes, you'll need server support for that as well. Kaazing WebSocket Gateway supports a very fast emulation/Polyfill. If you have a plugin like Flash it may use that (opportunistic optimization), but if you don't it emulates WebSocket with encrypted streaming, which is a lot more efficient than long polling. It comes with SSE and Cross Document Messaging support and emulation as well, as well as many higher level protocol abstractions (JMS/Stomp, XMPP, etc.)
Union Server has WebSocket support with fallback to comet-style AJAX communication. Union is a platform for creating connected applications, such as online multiplayer games.
http://www.unionplatform.com
I have a very simple question about ajax.
If I'd like to refresh a particular area of my site I supose ajax would be the best way.
But is there anyway instead of having a javascript periodically checking for changes on the server, the server would send the data when a given event would happen?
What I'd like was the client not needing to send requests periodically but instead the server would only send the info to the client which in turn would have some kind of event listener.
Thanks in advance
Yes, this can be done. It is referred to as "push" or "push streaming".
Here is one website that offers the ability to do this: InstantPush. And a brief quote from their home page:
"InstantPush is used to make web pages
and mobile phones go live. They will
instantly be updated in real time when
a change occurs at the server side.
Standard web communication makes
updates pass firewalls and proxies.
Without any modules at the client
side!
InstantPush has been used since 2001,
before "Ajax was invented". It is
probably the First Ajax Push
Framework.
InstantPush is leading the market in
northern Europe."
Here is another company offering this technology: LightStreamer. And a quote from their home page:
"Lightstreamer is a scalable and reliable Server for pushing live data to Rich Internet Applications
Based on the Comet and Real-Time Web
paradigms, it streams real-time data
to any Web browser and client
application. HTML, HTML5, AJAX, Flex,
Silverlight, Java, .NET, iOS, Android,
and BlackBerry applications, can
easily receive live data from
Lightstreamer Server.
Lightstreamer has been used in many
mission-critical production systems,
where scalability, low network impact,
bandwidth management, adaptive
streaming, and other advanced
features, have proven fundamental."
This cannot be done because the http protocol works by sending a request and receiving a response from the server, hence the server cannot a response without receiving a request.
No this cannot be done. A server's job is to serve up results from a request, one that it must have to begin with.
That is not possible using traditional HTTP. You can, however, use long polling or one of its siblings to simulate push behaviour.
I think that websockets is the way to go, but is not supported for all browsers yet.
I used them with ruby and chrome and was pretty easy.
this is indeed a difficult ask where server broadcasts/pushes data to clients without being requested. HTTP is stateless and even if browser is a registered client, it still needs to request either through code or through some tags like meta refresh. New but still not so stable options are Comet or websockets.
Answer is Comet rather than websockets. YES, it is possible.
Another way is using Browser plugin.
This is an except from wiki page at Push Technology
* Apple Push Notification Service
* BOSH
* Comet
* Client–server model
* File transfer
* Pull technology
* Push Access Protocol
* Push e-mail
* Reverse Ajax
* Streaming media
* WebSockets