Web Sockets is a next-generation bidirectional communication technology for web applications which operates over a single socket and is exposed via a JavaScript interface in HTML 5 compliant browsers.
Once you get a Web Socket connection with the web server, you can send data from browser to server by calling a send() method, and receive data from server to browser by an onmessageevent handler.
Following is the API which creates a new WebSocket object.
var Socket = new WebSocket(url, [protocal] ); |
Here first argument, url, specifies the URL to which to connect. The second attribute, protocol is optional, and if present, specifies a sub-protocol that the server must support for the connection to be successful.
WebSocket Attributes:
Following are the attribute of WebSocket object. Assuming we created Socket object as mentioned above:
| Attribute | Description |
|---|---|
| Socket.readyState | The readonly attribute readyState represents the state of the connection. It can have the following values:
|
| Socket.bufferedAmount | The readonly attribute bufferedAmount represents the number of bytes of UTF-8 text that have been queued using send() method. |
WebSocket Events:
Following are the events associated with WebSocket object. Assuming we created Socket object as mentioned above:
| Event | Event Handler | Description |
|---|---|---|
| open | Socket.onopen | This event occurs when socket connection is established. |
| message | Socket.onmessage | This event occurs when client receives data from server. |
| error | Socket.onerror | This event occurs when there is any error in communication. |
| close | Socket.onclose | This event occurs when connection is closed. |
WebSocket Methods:
Following are the methods associated with WebSocket object. Assuming we created Socket object as mentioned above:
| Method | Description |
|---|---|
| Socket.send() | The send(data) method transmits data using the connection. |
| Socket.close() | The close() method would be used to terminate any existing connection. |
WebSocket Example:
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.
Client Side HTML & JavaScript Code:
At the time of writing this tutorial, there are only few web browsers supporting WebSocket() interface. You can try following example with latest version of Chrome, Mozilla, Opera and Safari.
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function WebSocketTest()
{
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. |
No comments:
Post a Comment