- HTML Introduction
- HTML Attributes
- HTML Basic Tag
- HTML Color
- HTML Comments
- HTML Fonts
- HTML Blocks
- HTML Images
- HTML Layout
- HTML Links
- HTML Lists
- HTML Formatting Tags
- HTML Table
- HTML Meta Tag
- HTML Frames
- HTML Parse Tag
- HTML Forms
- HTML Script
- HTML Style-CSS
- HTML XHTML
HTML5 Web Sockets
Web Sockets is a next-generation bidirectional communication technology for single socket web application and can send data across using scripts.
One can send data from browser to server by calling a send() method, and receive data from server to browser by "onmessage" event handler.
Below is the API which creates a new WebSocket object.
URL specifies the address and protocol is an optional argument which specifies the protocol it should adhere to.
Below are the attribute of WebSocket object. Assuming we created Socket object as mentioned above:
The readonly attribute readyState provides the state of the connection. It can have the following values:
The readonly attribute bufferedAmount gives total number of bytes of UTF-8 text that have been queued using send() method.
Below are the events associated with WebSocket object. Assuming we created Socket object as mentioned above:
|open||Socket.onopen||Event triggered when socket connection is established.|
|message||Socket.onmessage||Event triggered when client receives data from server.|
|error||Socket.onerror||Event triggered on error in communication.|
|close||Socket.onclose||Event triggered when connection is closed.|
Below are the methods associated with WebSocket object. Assuming we created Socket object as mentioned above:
Transmits data using connection.
Used to Terminate any connection.
A WebSocket is a standard bidirectional TCP socket between the client and the server. The socket starts out as a HTTP connection and then upgrades to a TCP socket after a HTTP handshake. After the handshake, either side can send data.
All the latest web browsers support websockets.
if ("WebSocket" in window)
alert("WebSocket is supported by your Browser!");
// Let us open a web socket
var ws = new WebSocket("ws://localhost:9998/echo");
ws.onopen = function()
// Web Socket is connected, send data using send()
ws.send("Message to send");
alert("Message is sent...");
ws.onmessage = function (evt)
var received_msg = evt.data;
alert("Message is received...");
ws.onclose = function()
// websocket is closed.
alert("Connection is closed...");
// The browser doesn't support WebSocket
alert("WebSocket NOT supported by your Browser!");
Before testing above client program, you need a server which supports WebSocket. Download mod_pywebsocket-x.x.x.tar.gz from pywebsocket which aims to provide a Web Socket extension for Apache HTTP Server and install it using following steps.
1.Unzip and untar the downloaded file.
2.Go inside pywebsocket-x.x.x/src/ directory.
3.$python setup.py build
4.$sudo python setup.py install
5.Then read document by:
Start the Server
Go to the pywebsocket-x.x.x/src/mod_pywebsocket folder and run the following command:
This will start the server listening at port 9998 and use the handlers directory specified by the -w option where our echo_wsh.py resides.
Now using Chrome browser run the code you created in the beginning. If your browser supports WebSocket(), then you would get alert indicating that your browser supports WebSocket and after you click on "Run WebSocket" you would get "Goodbye message" sent by the server script.