WebSockets - HTML5 with Visual Studio 2012 - page 307

ws.onopen=function () {
output("connected... ");
};

ws.onmessage=function (e) {
output(e.data);
};

ws.onclose=function () {
output("Connection closed");
};
};

function send() {
var input=document.getElementById("input");

try {
ws.send(input.value);
} catch (e) {
output(e);
}
}

function output(msg) {
var o=document.getElementById("output");
o.innerHTML=o.innerHTML+"<p>"+msg+"</p>";
};

</script>

The onload event in the body element calls the connect() function. The connect() function creates
a WebSocket object and wires up the onOpen , onMessage , and onClose () event handlers. When the Send
Message button is clicked, the send() function is invoked. This gets the message from the text box and calls the
websocket's send() function. The output() function simply add the specified text to the pre element.

Testing the Initial Project
You now have a basic server application and a simple client. You'll test this now to make sure websocket is
working properly before adding the custom features.

eXerCISe 13-3. teStING the INItIaL appLICatION

1. In the Solution Explorer, right-click the Chapter 13 solution and select the “Set

StartUp projects” link.

2. In the dialog box, select the “Multiple startup projects” radio button. For both the

WsServer and Client projects, change the Action to “Start”. Also, use the arrows
to the right of the project list so the WsServer project is started first, as shown in
Figure 13-6 . Click the ok button to save these options.