HTML5提供支持
HTML5提供WebSocket。因此支持HTML5的浏览器均能支持。
我们提供一个小例子，浏览器连接server，建立websocket连接，发送Hello消息，server收到消息后，返回一个Hello，同时每个1秒发送一个消息，发送3次后，server关闭连接。
小例子代码
完整代码如下，我们再分片段学习。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Chapter 10: WebSocket</title>
<script language="javascript" type="text/javascript">
var output;
function init() {
output = document.getElementById("output");
}
function testWebSocket(){
var connection = new WebSocket('ws://' + window.location.host + '/chapter10/test/mytest');
connection.onopen = function(/*event*/) {
writeToScreen('CONNECTED');
connection.send("Hello");
}
connection.onclose = function(event) {
if(!event.wasClean)
writeToScreen('<span style="color: red;">Abnormal disconnected:</span> '
+ event.code + ': ' + event.reason);
else
writeToScreen('DISCONNECTED');
}
connection.onerror = function(event) {
writeToScreen('<span style="color: red;">ERROR:</span> '+ event.data);
}
connection.onmessage = function(event) {
writeToScreen('<span style="color: blue;">RESPONSE: '+ event.data+'</span>');
}
}
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>
</head>
<body>
<a href="javascript:void 0;" οnclick="testWebSocket();">Test WebSocket</a><br />
<div id="output"></div>
</body>
</html>例子很短，除了testWebScoket()之外，其余的是提供一个添加内容的显示。
发起WebSocket
/* 如果是本地测试，下面的语句将发起一个URL为ws://localhost:8080/chapter10/test/mytest的webSocket。*/
var connection = new WebSocket('ws://' + window.location.host + '/chapter10/test/mytest');
/* 同时给出Sec-WebSocket-Protocol: chat */
var connection = new WebSocket('ws://www.example.com/chat', 'chat');
/* 设置Sec-WebSocket-Protocol: chat.v1,char.v2 */
var connection = new WebSocket('ws://www.example.com/chat', {'chat.v1','chat.v2'});状态触发
WebSocket提供readyState状态来获取连接状态，分别是CONNECTING (0), OPEN (1),CLOSING (2) 或 CLOSED (3)
if(connection.readyState == WebSocket.OPEN) {
//do something
}但很少采用这种方式，一般使用状态触发，也就是例子中的：
//onopen是readyState从CONNECTING转为OPEN时触发，参数event没有任何实质有效的信息，可以不写
connection.onopen = function(event) { }
/* onclose是状态readyState从CLOSING转包为CLOSED时触发，event包括wasClean, code,和reason。
code可以在 RFC 6455的7.4中查看（http://tools.ietf.org/html/rfc6455#section-7.4）
code=1000是正常，其他均是异常
*/
connection.onclose = function(event) { }
/* onerror的event的data是错误的对象，通常是String， error只包括客户端的错误，protocol errors和连接关闭的错误 */
connection.onerror = function(event) { }
/* onmessage的event也包含data属性，对于data：
如果是消息是text就是String，
如果消息是二进制，如果webSocket的binaryType是blob则是Blob；如果binaryType是arraybuffer则是Arraybuffer
我们可应在创建WebSocket对象后设置binaryType，如：
var connection = new WebSocket('ws://www.example.net/chat');
connection.binaryType = 'arraybuffer';
*/
connection.onmessage = function(event) { }发送和关闭
WebSocket对象提供send()和close()两个方法进行发送和关闭。
对于send()，内容可以是string, Blob, ArrayBuffer或者ArrayBufferView。下面是一个browser定期发送消息的例子
/* send: 单一参数，可以是 string, Blob, ArrayBuffer, or ArrayBufferView
* WebSocket有一个参数bufferedAmount表示之前的send仍有多少数据等待发送给server（TCP的特性），
* 我们可以选择不理会，继续send，或者等待上次全部send完再send。
* 下面的例子是定期每50ms发送更新内容，如果webSocket的状态发生变化，停止定期处理，如果webSocket上次仍有内容在等待发送，就再等50ms。
*/
connection.onopen = function() {
var intervalId = window.setInterval(function() {
if(connection.readyState != WebSocket.OPEN) {
window.clearInterval(intervalId);
return;
}
if(connection.bufferedAmount == 0)
connection.send(updatedModelData);
}, 50);
}close可以带有可选的close code，缺省为1000（正常关闭），和一个可选的string reason（第二个参数，缺省为blank）
相关链接： 我的Professional Java for Web Applications相关文章
