WebSocket protocol 是HTML5一种新的协议。它实现了浏览器与服务器全双工通信(full-duplex)。
WebSocket API的使用分为以下几个步骤:
Step1: 创建链接。新建一个WebSocket对象十分的方便。代码如下:
var host = "ws://echo.websocket.org/";
var websocket=new WenSocket(host);
注意:URL必须以“ws”开头,剩余部分可以使用像HTTP地址一样来编写。改地址没有使用HTTP协议写法,因为它的属性为WebSocket URL;URL必须由4个部分组成,分别是通信标记(ws)、主机名称(host)、端口(port)以及WebSocket Server。
Step2: 发送数据。当WebSocket对徐昂与服务器建立连接后,使用如下代码发送数据:
websocket.send(dataInfo);
注意:其中websocket为新创建的WebSocket对象,send()方法中的dataInfo参数为字符类型,即只能使用文本数据或者将JSON对象转换成文本内容的数据格式。
Step3: 接收数据。客户端添加时间机制接收服务器发送来的数据,代码如下:
websocket.onmessage=function(event){
alert(event.data);
}
其中,通过回调函数中event对象的“data”属性来获取服务器端发送的数据内容,该内容可以是一个字符串或者JSON对象。
Step4: 状态标志。通过WebSocket对象的“readyState”属性记录连接过程中的状态值。
“readyState”属性是一个链接的状态标志,用于获取WebSocket对象在连接、打开、变化中和关闭时的状态。该状态标志红有4种属性值。如下所示:
属性值 | 属性常量 | 描述 |
0 | CONNECTING | 连接尚未建立 |
1 | OPEN | 链接已经建立 |
2 | CLOSING | 连接正在关闭 |
3 | CLOSED | 连接已经关闭或不可用 |
Step5: 关闭WebSocket连接。
webscoket.close();
-----------------------------------------------------------------------------------------------------
WebSocket的响应事件:
websocket.onopen=function(event){alert("opened");}
websocket.onmessage=function(event){alert(event.data);}
websocket.onerror=function(event){alert("errored");}
websocket.onclose=function(event){alert("closed");}
------------------------------------------------------------------------------------------------------