HTML5 WebSockets 基础使用学习教程

HTML5 WebSockets简介
WebSockets的使用

HTML5
WebSockets,可替代AJAX,无需AJAX请求即可与服务器端对话。

下面介绍HTML5 WebSockets,和记录Php环境的服务器端运行 WebSocket,创建客户端并通过WebSockets协议发送和接收服务器端信息。


HTML5 WebSockets简介

引用wiki的一句话:WebSocket protocol 是HTML5一种新的协议(protocol)。它是实现了浏览器与服务器全双工通信(full-duplex)(
全双工
:允许两台设备间进行资料的双向传输)

先前,很多网站为了实现即时通讯(real-time),所用的技术都是轮询(polling)。轮询是在特定的的时间间隔(time interval)(如每1秒),由浏览器对伺服器发出HTTP request,然后由服务器返回最新的数据给客服端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏览器需要不断的向服务器发出请求(request),然而HTTP request 的header是非常长的,我们需要的数据可能是里面包含的数据的一个很小的值,这样会占用很多的带宽。

而最新的实现轮询效果是Comet – 用了AJAX。但这种技术虽然可达到全双工通信,但依然需要发出请求(reuqest)。

这时,HTML5 WebSockets的优势就体现出来了。

在 WebSocket API,浏览器和服务器只需要要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。在此 WebSocket 协议中,为我们带来了两大好处:

1. Header

互相沟通的Header是很小的-大概只有 2 Bytes

2. Server Push

服务器可以主动传送数据给客户端


WebSockets的使用


类似使用可以参见:《服务器推技术简介及php实现服务器推技术的聊天室

另外关于通过WebSockets协议发送和接收服务器端信息,参见我的另外文章:

php WebSockets服务端和客户端

源码下载使用测试

通过这边文章对WebSockets基础的学习和WebSockets的服务端和客户端代码的使用,对php和HTML5 的WebSockets的使用有了初步掌握。。