WebSocket

实时web应用
轮询、基于HTTP流


传统Web实时通信方案


传统轮询
<METH HTTP-RQUIV="Refresh" CONTENT=12>
浏览器每隔12秒要重新加载一次该页面


Ajax轮询
利用Javascript的setTimeout函数，Ajax间隔一定的时间用XMLHttpRequest对象向服务器请求数据，看数据是否有改变，从而对页面的局部进行更新。


长轮询
有服务器端的信息是否有更新决定，如果没有更新数据，连接会保持一段时间周期直到有数据更新或时间过期。


Flash XMLSocket技术
XMLSocket类可以让装有Flash Player的计算机与由IP地址或域名标识的计算机进行通信，客户端不需要发送请求，服务器就可以在开放的连接上随时发送消息。


HTTP流方式
整个过程中只是使用一次HTTP连接请求。通过保持这个连接一直在打开的状态，进而周期性的向浏览器发送数据。
readstatechange事件属性


WebSocket协议是一个基于TCP的请求


全双工的双向通信：
服务器端与客户端将会呈现对等的效果，双方均能接收和发送消息，并且除非客户端或者服务器端的某一方主动关闭连接，否则这个连接会一直保持连接的状态


Websocket对象的socket绑定事件：
onopen--连接建立成功
onmessage--收到服务器信息
Onerror--连接出错
onclose--连接关闭


soket.onopen = function() {
//TODO:opened()
};


服务器端是没有onopen（）方法的，为了把TCP套接字事件封装到WebSocket事件，需要在接收数据的过程中进行处理，WebSocket的数据帧协议是在底层data事件上封装的。
WebSocket.prototype.setSocket = function(socket){
this.socket = socket;
this.socket.on('data', this.receiver);
};


数据发送时也要做封装
WebSocket.prototype.send = function（data){
This._send(data);
}


当客户端调用send()方法向服务器端发送数据时，服务器端此时触发的是onmessage（）事件；而当服务器端调用send（）方法向客户端发送数据时，客户端此时是哦那message（）事件被触发，也就是客户端和服务器的双向通信


WebSocket实现
实例化一个WebSocket对象，并且传入连接请求的地址url
var socket = new WebSocke("ws://www.example.com/server.php")
要给构造函数传入一个绝对地址的url参数


readyState
WebSocket.OPENING，表示正在连接
WebSocket.OPEN，表示已经建立连接
WebSocket.CLOSING，表示正在关闭连接
WebSocket.CLOSE，表示已经关闭了连接


任何时候调用close（）方法都可以关闭WebSocket连接socket.close();


WebSocket客户端实例
var socket = new WebSocke.("ws://www.example.com/server.php");
socket.onopen = function(){
setInterval(function(){
if(socket.bufferedAmount == 0){
socket.send(getUpdateDate());
}
},50);
};
socket.onmessage = function(event){
//TODO:event.data
};


请求地址，连接打开触发onopen事件，每隔50毫秒向服务器端发送一次数据，此时也可以通过onmessage（）方法接收服务器端传来的数据。


应用程序一般的两种架构模式：C/S（client/server), B/S(brower/server)


开发过程：
分析
设计
实现
测试调整
发布