在没有webSocket之前，在浏览器上实现服务端和客户端的通信，一般是使用的iframe、短轮询、长连接、comet等，但这些方法都没有webSocket方便稳定。要实现WebSocket需要浏览器和服务端均支持。HTML5里面的webSocket是客户端的实现，应用服务器是服务端的实现。Tomcat在7.0.27版本中加入了对webSocket的支持。

WebSocket可以无刷新的实现服务端信息到客户端的推送，适于用聊天、信息推送、股票信息等需要服务端主动将信息提供给客户端的地方。

一、Tomcat服务端实现

下面是Tomcat里面websocket的服务端实现，按tomcat官方的说法是由于现在的websocket的规范还没有完全制定完成，所以tomcat里面关于websocket的实现的相关API可能随时会改变。http://tomcat.apache.org/tomcat-7.0-doc/web-socket-howto.html

以下代码参考tomcat发布包里面的examples下面的websocket

注意：在编译代码的时候可能会出现找不到相关类的情况，这个时候是由于没有将tomcat的相关包引入到工程的classpath里面，通常在MyEclipse里面会出现此问题，使用eclipse时，会将tomcat的lib包加入到工程的classpath里面。

@WebServlet("/DemoWebSocket")
public class DemoWebSocket extends WebSocketServlet {
private static final long serialVersionUID = 1L;
private final Set<DemoMessageInbound> connections = new CopyOnWriteArraySet<DemoMessageInbound>();
@Override
 protected StreamInbound createWebSocketInbound(String subProtocol,
 HttpServletRequest request) {
 return new DemoMessageInbound();
 }
private final class DemoMessageInbound extends MessageInbound {
@Override
 protected void onOpen(WsOutbound outbound) {
 connections.add(this);
 String message = "websocket已经打开";
 broadcast(message);
 }
@Override
 protected void onClose(int status) {
 connections.remove(this);
 String message = "webSocket关闭";
 broadcast(message);
 }
@Override
 protected void onBinaryMessage(ByteBuffer message) throws IOException {
 //在这里处理二进制数据
 }
@Override
 protected void onTextMessage(CharBuffer message) throws IOException {
 // 这里处理的是文本数据
 String filteredMessage = message.toString();
 broadcast(filteredMessage);
 }
 
 //将数据传回客户端
 private void broadcast(String message) {
 for (DemoMessageInbound connection : connections) {
 try {
 CharBuffer buffer = CharBuffer.wrap(message);
 connection.getWsOutbound().writeTextMessage(buffer);
 } catch (IOException ignore) {
 // Ignore
 }
 }
 }
 }

二、浏览器客户端实现

下面的代码的实现，只是简单的兼容chrome浏览器，对于其他浏览器未做兼容性测试，所以在其他浏览器下面可能不能正常运行。

<input type="text" name="test" id="test"><input type="button" value="发送" onclick="send()"><br>
 <div id="message"></div>
 <script type="text/javascript">
//创建一个websocket的连接
 var ws = new WebSocket("ws://localhost:8080/websocket/DemoWebSocket");
//当连接打开时的事件
 ws.onopen = function(evt) {
 console.log("Openened connection to websocket"); 
 };
//当连接有信息时的事件
 ws.onmessage = function(msg) {
 $('#message').html(msg.data);
 };
 //向服务端发送信息
 function send(){
 ws.send($('#test').val());
 }
 </script>

示例代码下载：点击此处