What is WebSocket?

The WebSocket specification—developed as part of the HTML5 initiative—introduced the WebSocket JavaScript interface, which defines a full-duplex single socket connection over which messages can be sent between client and server. The WebSocket standard simplifies much of the complexity around bi-directional web communication and connection management.

WebSocket represents the next evolutionary step in web communication compared to Comet and Ajax. However, each technology has its own unique capabilities. Learn how these technologies vary so you can make the right choice.

This second section walks you through creating a WebSocket application yourself.

You can also inspect WebSocket messages using your browser

Creating your own test

Using a text editor, copy the following code and save it as websocket.html somewhere on your hard drive. Then simply open it in a browser. The page will automatically connect, send a message, display the response, and close the connection.

<!DOCTYPE html>

<title>WebSocket Test</title>

var wsUri = "ws://echo.websocket.org/";
  var output;

function init()
  {
    output = document.getElementById("output");
    testWebSocket();
  }

function onOpen(evt)
  {
    writeToScreen("CONNECTED");
    doSend("WebSocket rocks");
  }

function onClose(evt)
  {
    writeToScreen("DISCONNECTED");
  }

function onMessage(evt)
  {
    writeToScreen('<span style="color: blue;">RESPONSE: ' + evt.data+'</span>');
    websocket.close();
  }

function onError(evt)
  {
    writeToScreen('<span style="color: red;">ERROR:</span> ' + evt.data);
  }

function doSend(message)
  {
    writeToScreen("SENT: " + message); 
    websocket.send(message);
  }

function writeToScreen(message)
  {
    var pre = document.createElement("p");
    pre.style.wordWrap = "break-word";
    pre.innerHTML = message;
    output.appendChild(pre);
  }

window.addEventListener("load", init, false);

</script>

<h2>
WebSocket Test</h2>
<div id="output">
</div>
</html>

PHP, MySql,Javascript , Jquery ,HTML,CSS,Android, iPhone , Drupal

Pages

Friday 14 March 2014

HTML5 WebSocket

What is WebSocket?

Creating your own test

No comments:

Post a Comment