1 / 11
文档名称:

HTML5服务器推送消息的各种解决办法.doc

格式:doc   大小:16KB   页数:11页
下载后只包含 1 个 DOC 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

HTML5服务器推送消息的各种解决办法.doc

上传人:学习的一点 2021/12/23 文件大小:16 KB

下载得到文件列表

HTML5服务器推送消息的各种解决办法.doc

相关文档

文档介绍

文档介绍:HTML5服务器推送消息的各种解决办法
摘要
在各种BS架构的应用程序中,往往都希望服务端能够主动地向客户端推送各种消息,以达到类似于邮件、消息、待办事项等通知。
往BS架构本身存在的问题就是,服务器一直采用的是一问一答的机制。这就意味着如果客户端不主动地向服务器发送消息,服务器就无法得知如何给客户端推送消息。
随着HTML、浏览器等各项技术、标准的发展,依次生成了不同的手段与方法能够实现服务端主动推送消息,它们分别是:AJAX,Comet,ServerSent以及WebSocket。
本篇文章将对上述提及到的各种技术手段进行直白化的解释。
AJAX
正常的一个页面在浏览器中是这样工作的:
用户向给予浏览器一个需要访问的地址
浏览器根据这个地址访问服务器,并与服务器之间创建一个TCP连接(HTTP请求)
服务器根据这个地址和一些其它数据,组建一段HTML文本,将写入TCP连接,然后关闭连接
浏览器得到了来自服务器的HTML文本,解析并呈现了浏览器上给用户浏览
此时,用户点击了网站上任何一个<a>或触发任何一个<form>提交时:
浏览器根据form的参数或者a的参数,作为访问的地址
与服务器创建TCP连接
服务器组建HTML文本,然后关闭连接
浏览器将当前显示的页面摧毁,并按照新的HTML文本呈现一个新的页面给用户
我们不难发现的是整个过程中间,一旦建立了一个连接,页面就无法再维护住了。整个过程看上去有点强买强卖,也许我只要一杯新的可乐,但你非要给我一整个套餐组合。
此时我们可以了解一下XmlHttpRequest组件,这个组件提供我们手动创建一个HTTP请求,发送我们想要的数据,服务器也可以只返回我们想要的结果,最大的好处是,当我们收到服务器的响应时,原来的页面没有被摧毁。这就好比,我喊一句"我的咖啡喝完了,我要续杯",然后服务员就拿了一杯咖啡过来,而不是会把我没吃完的套餐全部倒掉。
当我们利用AJAX实现服务器推送时,其实质是客户端不停地向服务器询问"有没有给我的消息呀?",然后服务器回答"有"或"没有"来达到的实现效果。它的实现方法也很简单,利用jQuery框架封装好的AJAX调用也很方便:
function getMessage(fn) {
$.ajax({
url: "", //一个能够提供消息的页面
dataType: "text", //响应类型,可以是JSON,XML等其它类型
type: "get", //HTTP请求类型,还可以是post
success: function (d, s) {
fn(d); //得到了正常的响应时,利用回调函数通知外部
},
complete: function (x, s) {
setTimeout(function () {
getMessage(fn);
}, 5000); //无论响应成功或失败,在若干秒后再询问一次服务器
}
});
}
通过上面的代码,可以每隔5秒询问一次服务器是否有需要处理的消息,通过这种方式可以达到推送的效果,但是会存在一个问题:
间隔时间越快,推送的及时性越好,服务器的消费越大;
间隔时间越慢,推送的及时性越低,服务器的消费越小。
而且严格地来说,这种实际方式,并不是真正意义上的服务器主动推送消息,但由于早期技术手段缺乏,所以AJAX轮循成为了一种很普遍的手段。



Comet
我们知道HTTP请求其实是基于TCP连接实现的,再看看之前说的HTTP请求处理过程:
客户端与服务器建立TCP连接
服务器根据客户端提交的报文处理并生成HTML文本
将HTML封闭成为HTTP协议报文并返回给客户端
关闭链接。
看到这个处理过程,我们不难联想到,如果把第4步——关闭连接给省掉,那不就相当于有一个长连接一直被维持住了么。通过对服务端的一些操作,我们可以直接将数据从这个TCP连接发送客户端了。
通过这种技术,我们可以大大提高服务器推送的实时性,还可以减去服务端不停地建立、施放连接所形成的开销。
目前市面上有不少基于AJAX实现的Comet机制,但主要有两种方式:
建立连接后依然使用"询问"+"应答"的模式。虽然工作方式没变,但是因为减去了每次建立与