websocket介绍

1、什么是websocket

WebSocket是HTML5的一种新的协议。它实现了浏览器与服务器全双工通信(full-duplex)。所谓的全双工通信即服务端和客户端能够互相发送消息。

2、为什么要使用websocket

浏览器和服务器通信的历史：

• http1.0:

• http1.1:使用持续连接、流水线方式

  在浏览器中通过http仅能实现单向的通信。当服务器端数据发生变化时，客户端如何即时得到通知呢？

• 模拟“服务端推”技术

  • 轮询：客户端向服务器发送请求，查看是否有可用的新信息，请求以固定的时间间隔发出，不管是否有信息，客户端都会得到响应。

  • 长轮询：客户端向服务器请求信息，并在设定的时间段内打开一个连接。服务器如果没有任何信息，会保持请求打开，直到有客户端可用的信息，或者直到指定的超时时间用完为止。这时，客户端重新向服务器请求信息。

• 真正的“服务端推”:websocket

  

3、websocket连接是如何建立的

三次握手后进行一次http握手，以升级到websocket协议，之后按websocket的方式传送数据。

每个WebSocket连接都始于一个HTTP请求。该请求和其他请求很相似，但是包含一个特殊的首标—Upgrade。Upgrade首标表示客户端将把连接升级到不同的协议。

sec-websocket-accept与sec-websocket-key：
sec-websocket-accept=base64(hsa1(sec-websocket-key+258EAFA5-E914-47DA-95CA-C5AB0DC85B11))

如果返回的sec-websocket-accept不对，在chrome下会出现Sec-WebSocket-Accept dismatch的错误。

Response返回的HTTP Staus是101，代表服务端说“我们双方后面就按照websocket协议来进行数据传输吧”。

4、如何使用websocket

var ws = new WebSocket(“ws://echo.websocket.org”); 
ws.onopen = function(){
    console.log(“open!”);
    ws.send(“Test!”);
}; 
ws.onmessage = function(evt){
    console.log(evt.data);
    ws.close();
}; 
ws.onclose = function(evt){
    console.log(“closed!”);
}; 
ws.onerror = function(evt){
    console.log(“error!”);
};