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

时间: 2024-12-28 12:20:07

JavaEE & HTML5之WebSocket的相关文章

认识HTML5的WebSocket

认识HTML5的WebSocket 在HTML5规范中,我最喜欢的Web技术就是正迅速变得流行的WebSocket API.WebSocket提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法,从客户端使用简单的语法有效地推动消息到服务器.让我们看一看HTML5的WebSocket API:它可用于客户端.服务器端.而且有一个优秀的第三方API,名为Socket.IO. 一.什么是WebSocket API? WebSocket API是下一代客户端-

HTML5 and Websocket

在HTML5规范中,我最喜欢的Web技术就是正迅速变得流行的WebSocket API.WebSocket提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法,从客户端使用简单的语法有效地推动消息到服务器.让我们看一看HTML5的WebSocket API:它可用于客户端.服务器端.而且有一个优秀的第三方API,名为Socket.IO. 一.什么是WebSocket API? WebSocket API是下一代客户端-服务器的异步通信方法.该通信取代了单

使用Html5下WebSocket搭建简易聊天室

一.Html5WebSocket介绍 WebSocket protocol 是HTML5一种新的协议(protocol).它是实现了浏览器与服务器全双工通信(full-duplex). 现在,很多网站为了实现即时通讯(real-time),所用的技术都是轮询(polling).轮询是在特定的的时间间隔(time interval)(如每1秒),由浏览器对服务器发出HTTP request,然后由服务器返回最新的数据给客服端的浏览器.这种传统的HTTP request d的模式带来很明显的缺点 –

学习html5的WebSocket连接

1.什么是WebSocket WebSocket 是一种自然的全双工.双向.单套接字连接.使用WebSocket,你的HTTP 请求变成打开WebSocket 连接(WebSocket 或者WebSocket over TLS(TransportLayer Security,传输层安全性,原称“SSL”))的单一请求,并且重用从客户端到服务器以及服务器到客户端的同一连接.WebSocket 减少了延迟,因为一旦建立起WebSocket 连接,服务器可以在消息可用时发送它们.例如,和轮询不同,We

分析HTML5中WebSocket的原理

目录结构 一.什么是Websocket websocket是html5提出的一个协议规范,参考rfc6455. 不过目前还都是在草案,没有成为标准,毕竟html5还在路上. websocket约定了一个通信的规范,通过一个握手的机制,客户端(浏览器)和服务器(web server)之间能建立一个类似tcp的连接,从而方便c-s之间的通信. 在websocket出现之前,web交互一般是基于http协议的短连接或者长连接. 短连接的过程大概有下面几个步骤: (1)建立tcp连接: (2)浏览器发出

HTML5 中websocket长连接的具体实现方法

HTML5中通过调用与数据通信相关的Web Socket API,实现从服务器中推送信息到客户端. Socket又称为套接字,是基于W3C标准开发在一个TCP接口中进行双向通信的技术.通常情况下,Socket用于描述IP地址和端口,是通信过程中的一个字符句柄.当服务器端又多个应用服务绑定一个Socket时,通过通信中的字符句柄,实现不同端口对应不同应用服务功能.目前,大部分浏览器都支持HTML5中Socket API的运行. WebSocket连接服务器和客户端,这个链接是一个实时的长连接,服务

利用html5、websocket和opencv实现人脸检测

最近学习人脸识别相关的东西,在MFC下使用OpenCV做了一个简单的应用.训练需要较多的数据,windows应用程序终究还是不方便,于是想着做成CS模式:检测识别都放在服务器端,视频获取和显示都放在网页端. 在网上找了一些资料,实现了简单的人脸检测.人脸识别只要在这个框架上加点代码就行.主要参考了下面这篇文章: http://www.open-open.com/home/space-361-do-blog-id-8960.html jetty版本:jetty-9.2.17.v20160517 j

HTML5之WebSocket(转自知乎)

在认识websocket之前,我们必须了解的是websocket有什么用? 他能解决我们遇到的什么问题? 如果没用,那么我们就么有使用它的必要的. websocket就是建立起全双工协议的,提高了效率,节省了时间. 什么是WebSocket? WebSocket一种在单个 TCP连接上进行全双工通讯的协议.即WebSocket是一个协议. websocket是基于TCP协议的. 比较通俗的理解,我们可以点击这里. 推荐文章:  https://zhuanlan.zhihu.com/p/23467

HTML5之WebSocket

什么是WebSocket? WebSocket一种在单个 TCP连接上进行全双工通讯的协议.即WebSocket是一个协议. 比较通俗的理解,我们可以点击这里. 第一部分:WebSocket的特点 通过TCP一次握手就可以建立连接.  而HTTP协议需要三次握手. HTTP中服务器永远是被动的,即每次只有客户端发出请求,服务器才会响应. 但是WebSocket协议中,服务器是可以主动的向客户端传递数据.这样就避免了轮询的问题. WebSocket需要浏览器.服务器同时支持才可以使用,而http协