一起来用Websocket（一）开篇 Websocket！Socket在HTML5复活

======================================================
注：本文源代码点此下载
======================================================

一起来用websocket(一)开篇 websocket!socket在html5复活

前言

html5中有一个比较好用的特性,就是websocket。现在已集成在chrome的较新版本中。由于前段时间在项目中有用到websocket,感到websocket真是html5中比较强大的功能。现在抽点时间,总节一下在.net中使用websocket

要注意的地方。同时,由于园子里关于websocket的文章不多,希望能起到抛砖引玉的作用,希望能和大家一起讨论更好的实现方式,形成更好的应用。

如果可以的话,希望能形成我们.net社区自己的websocket

框架(类似jwebsocket)。最近,业余时间我也时行了jwebsocket转.net版本的开发和测试工作,希望能借这个专题,把这个框架和大家一起完善起来,也希望有兴趣的朋友加入一同开发,相信我们能得很多。

下面言规正转,开始谈websocket吧。

示例

下面有一个类似在线留言的例子:http://html5demos.com/web-socket。

大家一眼能看出来吧,这个没啥特别的呀,不是和ajax差不多吧。我用jquery或者xmlhttprequest或其它js框架都可以很快写出来呀。其实,websocket也可以被拿来当用ajax框架来用,不过,这样太大材小用了。这个示例中有几个细节:

mso-list:l1 level1 lfo2;tab-stops:list 63.0pt">第一、初始,连接未建立。

上图所示”not connected”.表示,连接还未建立。

mso-list:l1 level1 lfo2;tab-stops:list 63.0pt">第二、连接建立。

等一段时间后,原来灰色部分会变成绿色的“socket

open”,表示连接已经建立了。

大家也可能注意到,我在文本框中输入了内容后,按回车后,在最下面的部份就出来了我发的内容。

mso-list:l1 level1 lfo2;tab-stops:list 63.0pt">第三、socket open 常连接。

我们发现,我们一段时间不退出,状态还是绿色的“socket

open”。说明,连接还是一直存在的。其次,这里使用的是socket,也就是说,刚才的留言板是在线的,实时的留言板,相当于一个聊天室,大家都可以看到你在线的状态。是不是很令人激动。没错,我们的socket又复活了,在后台,使用的就是socket的程序,其语言可以是java、c#、php等其它可以监听或编写socket应用的语言。

好,上面的例子过后,我们来正式对比一下websocket和http的区别吧:

规定平台websocket服务器和谷歌浏览器,或websocket服务器与ws客户端程序之间数据传送的格式协议,软件设计应按照此协议进行。

http的三个问题:

(1)为一个web客户端潜在的建产多个tcp连接。

(2)有一个大的http头,以满足http协议。

(3)客户端的脚本必须为输入连接和输出连接建立一个映射,以确定回复。

(4)基于请求-响应模式,http服务端不能主动推送(push)数据到客户端。

websocket的三个好处:

(1)一个web客户端只有一个tcp连接。

(2)websocket服务端可以推送数据到web客户端.

(3)轻量级的头,减少数据传送量

(4)服务端可以主动推送数据到客户端

(5)已成功应用于游戏、股票交易等用多用户实时系统中。

(6)支持多客户端,web客戶

(7)客户端开发接口简单

websocket客户端开发接口

如下图所示:

提供下面三个接口

onopen:

当接口打开时

onmessage:

当收到信息时

onclose:

当接口关闭时

上面的几个方法已在chrome浏览器中得到支持,开发接口也相对简单。

tab-stops:list 39.0pt">

本篇总结:

1.websocket就是借着 html5在浏览器中加了一个socket通信程序的客户端。你在安装浏览器的时候,默认装了一个客户端,可以向服务端请求,并建产链接。然后再像原先的socket应用程序一样来回互相发送消息。

2.websocket不是一个新技术,只是html5中用javascript提供了一些接口,让你调用。服务端还是任何一门支持socket通信的语言就行。

3.websocket的应用。可以应用在很的领域,游戏,股票。简单说主要是一些多用户的实时应用。也可实现类似和webqq一样的网页聊工具。

4.websocket把http协议轻量化了,在web交互中,我们再也不用让http包了一层又一层,而了去满足我们不需要的功能了。我们只要简单传我们想要的数据,协议我们可以在websocket这种轻量级协议下,制定我们自己的子协议,可以减少不少的交互和网络流量哦。

后面几篇会慢慢介绍,也欢迎大家一起讨论 ^-^。

引用:

[1] jwebsocket(java服务端和客户端websocket框架)

http://jwebsocket.org/

[2] websocket协议(本协议应用较为多,也比较全了)http://tools.ietf.org/html/draft-hixie-thewebsocketprotocol-76

[3] html5 websockets 基础使用教程

http://kb.cnblogs.com/page/72745/

大纲预告

tab-stops:list 21.0pt">一起来用websocket(一):[开篇]websocket!socket在html5复活

tab-stops:list 21.0pt">一起来用websocket(二):websocket协议详细分析

tab-stops:list 21.0pt">一起来用websocket(三):开源websocket框架--jwebsocket简介

主要功能,在线示例

tab-stops:list 21.0pt">一起来用websocket(四):开源websocket框架jwebsocket的架构设计

tab-stops:list 21.0pt">一起来用websocket(五):jwebsocket中的权限和配置

tab-stops:list 21.0pt">一起来用websocket(六):jwebsocket框架中的数据包处理

tab-stops:list 21.0pt">一起来用websocket(七):jwebsocket 框架中的过滤器

tab-stops:list 21.0pt">一起来用websocket(八):jwebsocket框架中的常用工具类说明

tab-stops:list 21.0pt">一起来用websocket(九):jwebsocket的.net版本nwebsocket

tab-stops:list 21.0pt">一起来用websocket(十):nwebsocket中的二次开发

服务端插件

客户端插件

tab-stops:list 21.0pt">一起来用websocket(十一):nwebsocket框架开发实例

一起来用websocket(十二):在nwebsocket中应用高性能通信引擎

======================================================
在最后，我邀请大家参加新浪APP，就是新浪免费送大家的一个空间，支持PHP+MySql，免费二级域名，免费域名绑定 这个是我邀请的地址，您通过这个链接注册即为我的好友，并获赠云豆500个，价值5元哦！短网址是http://t.cn/SXOiLh我创建的小站每天访客已经达到2000+了，每天挂广告赚50+元哦，呵呵，饭钱不愁了，\(^o^)/