详解Tomcat7中WebSocket初探

HTML5中定义了WebSocket规范，该规范使得能够实现在浏览器端和服务器端通过WebSocket协议进行双向通信。

在Web应用中一个常见的场景是Server端向Client端推送某些消息，要实现这项功能，按照传统的思路可以有以下可选方案:

随着Html5技术的普及，主流浏览器对HTML5标准的支持越来越好，利用浏览器原生支持WebSocket就可以轻松的实现上面的功能。只需要在浏览器端和服务器端建立一条WebSocket连接，就可以进行双向同时传递数据。相比于传统的方式，使用WebSocket的优点显而易见了：

那么在实际中如何建立WebSocket连接？在浏览器端和服务器端如何针对WebSocket编程？

就此问题，下文描述了建立WebSocket连接的过程，浏览器端WebSocket接口，并以Tomcat 7 为例在服务器端编写WebSocket服务。

1. 建立WebSocket连接过程

关于WebSocket规范和协议参考 http://www.websocket.org/aboutwebsocket.html

设计WebSocket协议的一个重要原则就是能和现有的Web方式和谐共处，建立WebSocket连接是以HTTP请求响应为基础的，这个过程为 WebSocket握手 .

图下所示为一个WebSocket建立连接的请求和响应过程：

此处稍作解释一下：

WebSocket连接建立在原来HTTP所使用的TCP/IP通道和端口之上 ，也就是说原来使用的是8080端口，现在还是使用8080端口，而不是使用新的TCP/IP连接。

数据帧传输支持Text和Binary两种方式：在使用Text方式时，以0x00为起始点，以0xFF结束，数据以UTF-8编码置于中间；对于Binary方式则没有结束标识，而是将数据帧长度置于数据前面。

2. 浏览器端 WebSocket编程接口

在浏览器端使用WebSocket之前，需要检测浏览器是否支持WebSocket，代码如下：

var socket=null; window.WebSocket = window.WebSocket || window.MozWebSocket; if (!window.WebSocket) { alert('Error: WebSocket is not supported .'); } else{ socket = new WebSocket('ws://...');} 

Websocket接口定义如下：

interface WebSocket : EventTarget {  readonly attribute DOMString url;  // ready state  const unsigned short CONNECTING = 0;  const unsigned short OPEN = 1;  const unsigned short CLOSING = 2;  const unsigned short CLOSED = 3;  readonly attribute unsigned short readyState;  readonly attribute unsigned long bufferedAmount;  // networking  attribute EventHandler onopen;  attribute EventHandler onerror;  attribute EventHandler onclose;  readonly attribute DOMString extensions;  readonly attribute DOMString protocol;  void close([Clamp] optional unsigned short code, optional DOMString reason);  // messaging  attribute EventHandler onmessage;  attribute DOMString binaryType;  void send(DOMString data);  void send(Blob data);  void send(ArrayBuffer data);  void send(ArrayBufferView data); };