由于项目需要，前端向后台发起请求后，后台需要分成多个步骤进行相关操作，而且不能确定各步骤完成所需要的时间
倘若使用ajax重复访问后台以获取实时数据，显然不合适，无论是对客户端，还是服务端的资源很是浪费
这种情况下，WebSocket能够解决此问题
它不像普通的http请求或者ajax访问，返回相应的结果就关闭了连接
WebSocket在个人浅薄的知识看来是属于长连接，能保持连接，随时收发数据
所以对WebSocket进行了初步了解，并按照相关的教程尝试做了一个简易demo
首先需要了解的是，WebSocket的几个基本操作
- 客户端开启连接
- 客户端给服务器发送数据
- 服务器接收数据
- 服务器给客户端发送数据
- 客户端接收数据
其中，服务端和客户端都能监听三类基本事件：
1、onopen（打开连接） 2、onmessage（发送数据） 3、onclose（关闭连接）
本次的demo中使用了tomcat7.0作为服务端，据悉7.0以上的版本才支持WebSocket
首先使用eclipse创建一个web project
在工程根目录下的WEB-INF/lib目录中导入tomcat7.0的lib文件夹中的 tomcat7-websocket.jar 和 websocket-api.jar
然后在src目录下创建第一个类（重点在于继承ServerApplicationConfig）
package cn.test.websocket;
import java.util.Set;
import javax.websocket.Endpoint;
import javax.websocket.server.ServerApplicationConfig;
import javax.websocket.server.ServerEndpointConfig;
public class ApplicationConfig implements ServerApplicationConfig {
//扫描注解
@Override
public Set<Class<?>> getAnnotatedEndpointClasses(Set<Class<?>> scan) {
System.out.println("scan WebSocket" + scan.size());
//返回（起到过滤的作用，可以在返回前把里面部分类进行过滤）
return scan;
}
//实现接口
@Override
public Set<ServerEndpointConfig> getEndpointConfigs(
Set<Class<? extends Endpoint>> arg0) {
// TODO Auto-generated method stub
return null;
}
}
接着创建第二个类，这个类用来处理WebSocket传送过来的数据（重点在于该类有@ServerEndpoint的注解）
package cn.test.websocket;
import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;
//注解规定了访问的URL
@ServerEndpoint("/echo")
public class EchoSocket {
/**
* 客户端有连接的时候就会调用这个方法
*/
@OnOpen
public void open(Session session){
System.out.println(session.getId()+"#############");
}
/**
* 客户端连接断开就会调用此方法
*/
@OnClose
public void close(Session session){
System.out.println(session.getId() + "连接关闭了");
}
/**
* 接收到客户端的信息
* @param msg
* @param last
*/
@OnMessage
public void message(Session session,String msg,boolean last){
System.out.println("客户端说" + msg);
try {
session.getBasicRemote().sendText("ni hao too");
Thread.sleep(3000);//三秒后再发送一条信息，用于验证是否实现数据实时更新
session.getBasicRemote().sendText("ni hao too twice");
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
public EchoSocket(){
System.out.println("Socket对象创建");
//通过对象的创建可以知道不同socket之间的通信不会共享成员变量
}
}
本案例中，使用的是基于注解的方法，让ApplicationConfig扫描注解
（实际上还有实现接口实现的方法，同理可以让ApplicationConfig扫描实现接口的类）
后台所需的类已经写好了，接下来就写一个简单的jsp页面
在工程下的index.jsp如下（实际上html也可以）
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>WebSocket示例</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="description" content="This is my page">
</head>
<body>
<button onclick="subOpen();">open</button><br/>
<input type="text" name="msg" id="msg"><br/>
<button onclick="send();">发送</button>
<div id="div"></div>
</body>
<script type="text/javascript">
var ws; // 就是一个通信管道
var target = "ws://127.0.0.1:8080/WebSocket/echo";//服务端的url，注意以ws开头
function subOpen(){
//三个判断用于获取ws通信管道（浏览器兼容）
if(‘WebSocket‘ in window){
ws = new WebSocket(target);
}else if(‘MozWebSocket‘ in window){
ws = new MozMozWebSocket(target);
}else{
alert("WebSocket is not supported by this browse");
return;
}
//ws.onopen = function(){} 链接开启会执行方法
//ws.onclose = function(){} 断开连接会执行方法
//以上两个实际用处并不多，主要是下面的
//服务器又信息返回就执行方法
ws.onmessage=function(event){
//服务端一返回内容，就把该内容放到div标签当中
document.getElementById("div").innerHTML = event.data;
//方便在控制台查看返回内容的具体信息
console.info(event);
};
};
function send(){
//点击发送按钮就把输入框里的内容发送给服务器，并把输入框的内容清空
var msg = document.getElementById("msg").value;
ws.send(msg);
document.getElementById("msg").value = "";
};
</script>
</html>
至此，demo已经编写完毕，将工程部署到tomcat7.0，启动tomcat并访问localhost:8080/WebSocket可看到以下简易页面
点击open按钮，发起websocket连接，服务端控制台会输出
Socket对象创建
0#############
在网页输入框输入“你好”后点击“发送”按钮
服务端控制台输出
客户端说你好
网页端先显示"ni hao too"，三秒后，又显示"ni hao too twice"
（三秒钟太短了懒得去截第一个效果的图片的，反正大家都懂的2333）
重复再网页输入信息点击发送后能重复展现同样的效果
显然，WebSocket非常灵活好用
（ps:第一篇随笔です，新人初来乍到，难免会有很多缺漏或者错误的地方，还请前辈们多多指点）