WebSocket(二)——WebSocket API

WebSocket API 是完全事件驱动的，一旦建立起全双工连接，当服务端需要发送数据给客户端时，就会自动发送，而不需要客户端的主动请求。目前，不同浏览器对WebSocket的支持度不同，可以通过javascriptif(window.WebSocket)来进行判断，或者在console里输入window.WebSocket检测，或者在html5test里查看。

使用WebSocket需要有WebSocket的服务端，这里先使用http://www.websocket.org/echo.html里的ws://echo.websocket.org，实现的是一个回复发送消息的功能。

WebSocket构造函数

构造函数有一个必需参数URL和一个可选参数protocols，在protocols中可以使用的协议包括XMPP、SOAP或者自定义协议。

WebSocket事件

open//服务端响应连接请求时触发
message//客户端收到消息时触发
error//响应意外故障时触发
close//连接关闭时触发

WebSocket有如上的四个事件，要开始监听事件，可以为WebSocket对象添加回调函数(on<事件名称>)，也可以使用addEventListener()方法为对象添加事件监听器。

WebSocket方法

send()//发送数据至服务端
close()//主动关闭连接
WebSocket属性
readyState//连接状态
bufferedAmount//检查已进入队列但尚未发送的字节数
protocol//获取客户端与服务端的协议名称

一个完整的测试代码如下：

var ws = new WebSocket("ws://echo.websocket.org");
ws.onopen = function(e) {
    console.log("OPEN");
    var send_string = "Hello WebSocket";
    ws.send(send_string);
    console.log("Send:" + send_string);
};
ws.onmessage = function(e) {
    console.log("MESSAGE");
    console.log("Receive:", e.data);
    ws.close();
};
ws.onerror = function(e) {
   console.log("ERROR", e);
};
ws.onclose = function(e) {
   console.log("CLOSE");
};

console里的结果如下

参考文章

About HTML5 WebSockets
The WebSocket API
《HTML5 WebSocket 权威指南》

2015-03-02