HTML5之WebSocket

　　什么是WebSocket？ WebSocket一种在单个 TCP连接上进行全双工通讯的协议。即WebSocket是一个协议。

　　比较通俗的理解，我们可以点击这里。

 

第一部分：WebSocket的特点

• 通过TCP一次握手就可以建立连接。  而HTTP协议需要三次握手。
• HTTP中服务器永远是被动的，即每次只有客户端发出请求，服务器才会响应。 但是WebSocket协议中，服务器是可以主动的向客户端传递数据。这样就避免了轮询的问题。
• WebSocket需要浏览器、服务器同时支持才可以使用，而http协议是普遍支持的。 且WebSocket是一种新的协议，只是目前为了兼容性，必须要建立在http的基础上发起请求，如只用WebSocket协议名将不再是http:而是ws:。
• 同样地，WebSocket也是基于TCP协议的。

 

第二部分： 基础知识

　　当我们获取了WebSocket连接之后，我们就可以通过send()方法来向服务器发送数据，并通过onmessage事件来接收服务器返回的数据。下面的api用于创建一个Websocket对象。

　　var Socket = new WebSocket(url, [protocol]);

　　其中第一个参数是需要连接的url，后一个参数是可选的，制定可以接受的子协议。

　   

WebSocket相关属性

　　即我们创建了Socket对象之后，它会有一个readyState属性（这个和xhr的属性同名），取值如下：

0     表示连接尚未建立

1     表示连接已经建立，可以进行通信

2     表示连接正在进行关闭

3     表示连接已经关闭或者连接不能打开

 

WebSocket方法

　　WebSocket中只有两个方法，一个是使用连接发送数据，即Socket.send()，另一个就是关闭连接，即Socket.close()。

　　注意：在xhr中是没有close相关方法的，因为一次请求一次响应的方式使得其无需close。

 

WebSocket 事件

 

　　

第三部分：WebSocket实例

　　在建立一个WebSocket连接的时候，客户端浏览器首先向服务器发送一个http请求，这个请求和普通的http请求不同，因为在首部字段中包含了Upgrade: WebSocket; 这表明这是一个申请升级为WebSocket协议的http请求， 服务器解析这些附加的头信息然后产生了应答信息返回给客户端，客户端和服务端的WebSocket连接就建立起来了，双方就可以使用这个连接进行自由的传递信息，并且这个连接会持续存在到客户端或者服务器端的某一方主动的关闭连接。

　　

客户端的HTML和JavaScript

　　下面是菜鸟教程上的例子：

 View Code

　　但是如果要使用,我们必须安装 pywebsocket， 安装过程如下：

https://looly.gitbooks.io/python-basic/100/101.html 这里有python环境的安装教程。

http://www.runoob.com/html/html5-websocket.html 这里是pywebsocket的安装过程。