JavaEE & HTML5之WebSocket

1、工作流程

 
 

(1)Java服务器创建WebSocket实例,并在Tomcat容器中维护和等待。
(2)浏览器中创建客户端WebSocket实例,这时,就会和服务器进行连接,如果连接成功,服务器触发onOpen事件,客户端触发onopen事件。
(3)浏览器中WebSocket实例发送消息, webSocket.send('*****');。
(4)服务器onMessage事件触发,解析消息内容,并进行相应的逻辑操作,返回结果给浏览器 session.getBasicRemote().sendText("Server Received Stop Message!"); 。
(5)浏览器onmessage事件触发,解析消息内容,进行逻辑操作。
(6)循环(3)~(5);
(7)关闭连接。


2、W3C WebSocket接口

enum BinaryType { "blob", "arraybuffer" };
[Constructor(DOMString url, optional (DOMString or DOMString[]) protocols), Exposed=Window,Worker]
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; // 当Browser和WebSocketServer连接成功后,会触发onopen消息
attribute EventHandler onerror; // 如果连接失败,发送、接收数据失败或者处理数据出现错误,browser会触发onerror消息
attribute EventHandler onclose; // 当Browser接收到WebSocketServer端发送的关闭连接请求时,就会触发onclose消息
readonly attribute DOMString extensions;
readonly attribute DOMString protocol;
void close([Clamp] optional unsigned short code, optional DOMString reason);  // 关闭连接
// messaging
attribute EventHandler onmessage; // 当Browser接收到WebSocketServer发送过来的数据时,就会触发onmessage消息,参数evt中包含server传输过来的数据
attribute BinaryType binaryType;
void send(DOMString data);  // 发送字符串数据
void send(Blob data); // 发送二进制大对象
void send(ArrayBuffer data); // ArrayBuffer用来表示一串bytes:http://technet.microsoft.com/zh-cn/ie/br212474
void send(ArrayBufferView data); // JavaScript中的二进制类型如Blob、ArrayBuffer和ArrayBufferView
};
http://dev.w3.org/html5/websockets/


3、Java服务端

选择合适的工具:
Apache Tomcat Version 7.0.57,重点是websocket-api.jar
java version "1.7.0_71"

示例,参考:http://blog.csdn.net/javascriptcoder/article/details/42913561



你可能感兴趣的:(JavaEE & HTML5之WebSocket)