HTML5 WebSocket 技术介绍

  • 时间:
  • 浏览:1

本篇先做介绍,后续将介绍一另另一个WebSocket与TWaver组件结合的实例… 

本文转自:http://www.html5china.com/HTML5features/WebSocket/20120513_3655.html

服务器对WebSocket的支持WebSocket不同于http协议,传统的web服务器通常不支持WebSocket,比如tomcat目前就不支持(tomcat 7.0.26 支持WebSocket了),反倒是有些小众的将会更活跃的web server率先支持WebSocket,如jetty,以及基于node.js的WebSocket-Node扩展,基本上各种编程语言都是相应的服务器都可以 选折 ,下图是我列举的几种,详细状况参阅:http://en.wikipedia.org/wiki/Comparison_of_WebSocket_implementations

WebSocket.Connection 后台连接类,带有于WebSocket对象中,用于向客户端推送消息

Java Code基因重组内容到剪贴板

后台WebSocket类,与客户端WebSocket类对应,能监听open, message, close等状况变化事件,并带有一另另一个Connection属性,用于向客户端发送消息

Java Code基因重组内容到剪贴板

WebSocket是html5规范新引入的功能,用于处里浏览器与后台服务器双向通讯的疑问,使用WebSocket技术,后台都可以 随时向前端推送消息,以保证前后台状况统一,在传统的无状况HTTP协议中,这是“无法做到”的。

传统服务端推(server push)技术WebSocket提出后后,为了处里后台推送消息到前台的需求,提出了有些处里方案,哪几种方案使用已有的技术(如ajax,iframe,flashplayer,java applet …),通过有些变通的处里来实现。简单轮询最简单的是前台轮询,每隔一段时间去请求后台,以获取最新状况,这名 最好的办法最容易实现,但效果也最差,频繁盲目的调用后台,带来无还要的开销,且实时性无法保障,后台出现更新,前端还要在下一次轮询时才知道。长轮询为了处里哪几种弊端,进化出长轮询技术,轮询请求会在后台阻塞,大约保持一另另一个长连接,直到后台出现更新将会超时才返回,曾经就都可以 保证更新的及时性,前端得到请求后,重新建立轮询连接,守候后台的更新通知。

客户端WebSocket的主要最好的办法浏览器支持程度各有区别,前面wiki中关于WebSocket的“Browser support”章节有介绍,遵循w3c关于WebSocket API的相关规范,浏览器提供了WebSocket类型,在Firefox中为MozWebSocket,检测浏览器是是否是支持WebSocket都可以 使用下面的脚本代码:检测浏览器是是否是支持WebSocketJavaScript Code基因重组内容到剪贴板

构造函数 – WebSocket#constructor(url, optional protocols)

第一另另一个参数是请求地址,第另一个参数选填,表示协议名

使用示例:
JavaScript Code基因重组内容到剪贴板

有些方案有些处里方案无外乎保持一另另一个长连接(如Iframe及htmlfile流),实时的从后台获取信息,将会借助第三方插件(flashPlayer, jre),使用的是flash xmlsocket将会java applet socket技术,哪几种最好的办法都是够纯html,不必 不必 这里就不必必 介绍了,更多传统server push 技术可参考IBM的文章:http://www.ibm.com/developerworks/cn/web/wa-lo-comet/WebSocket介绍webSocket是html5新引入的技术,允许后台随时向前端发送文本将会二进制消息,WebSocket是一种全新的协议,不属于http无状况协议,协议名为”ws”,这意味 一另另一个websocket连接地址会是曾经的写法:ws://twaver.com:30003000/webSocketServer。ws都是http,不必 不必 传统的web服务器不一定支持,还要服务器与浏览器并肩支持, WebSocket不都可以正常运行,目前的支持还不普遍,还要不得劲的web服务器和现代的浏览器。浏览器对WebSocket的支持Google Chrome浏览器最先支持WebSocket,后后 是Safari,Firefox,此外最新版本的Opera和IE(Opera11,IE10)也支持WebSocket。

下面是主要浏览器的支持状况,Opera11中默认关闭了WebSocket支持,不必 不必 这里这样列出,更多信息可参考:
http://en.wikipedia.org/wiki/WebSocket 与 http://caniuse.com/#search=websockets

服务器端编程语言各不相同,具体实现自然就说 相同,即使是同一种语言,实现类和接口函数都是很大的差别,比如jetty和netty都是基于java语言,但亲们的实现类几乎这样相同命名的,下面我以jetty(http://www.eclipse.org/jetty)为例,简单介绍WebSocket相关的类和最好的办法:jetty对WebSocket的实现WebSocketServlet基于servlet标准,增加了doWebSocketConnect(…)最好的办法,为客户端请求创建一另另一个后台对应的WebSocket实例Java Code基因重组内容到剪贴板

最好的办法 – send/close

发送消息 – WebSocket#send(data)

关闭连接 – WebSocket#close(optional code, optional reason)

使用示例:

JavaScript Code基因重组内容到剪贴板

事件 – open/message/close/error

WebSocket#onopen, onmessage, onclose, onerror

连接打开时,回调onopen最好的办法,接收到后台消息总要触发到onmessage事件,后台关闭时调用onclose,出现连接异常时可在onerror中捕获

使用示例:
JavaScript Code基因重组内容到剪贴板