![](https://i-blog.csdnimg.cn/blog_migrate/1027748918c0a9acde50e796c4853c7b.gif)
本来以为自己已经算是对AJAX技术了如指掌了,因为从3年前就一直用XMLHttpRequest对象做一些无刷新页面的处理工作,但是,直道今天在工作中遇到了一个分段读取内容的问题,我才了解到,自己原来还需要补充。
基本的问题是这样的:
我需要设计一个框架,需要承载500万以上用户访问(公司毕竟是中国用户最多的互联网企业)。我们用了大量的静态化技术,为了应对可能出现的高负载,我们还是用了一些公司内自主研发的高性能静态WEB服务器。由于页面是静态生成的,我们遇到一个问题,就是如何在某一时刻更新了某个静态文件后,在前台进行AJAX的加载。起初对这个问题想得比较简单,认为只要加载然后赋值并显示即可,但是在以前血的教训下(当加载的内容非常大,IE浏览器渲染显示的时候会非常慢,给用户明显的跳动刷新的感觉。),我们决定对于文件进行分段加载,这样做不但解决了一次加载过大文件的问题,同时也为服务器省下了一些处理时间和资源,尽可能快地结束HTTP请求。
解决方案:
我拿到这个问题,在设计的过程中首先考虑的是,分段请求应该就是类似于FlashGet之流,进行分段请求而已,只需要构造自己的HTTPRequest请求的Headers就能够达到目的,因为对HTTP协议还算是比较熟悉,所以我的分析应该是没错,如果是在.net中,我会毫不犹豫地利用WebHttpRequest()进行请求的封装,通过设置Range字段来实现上述的功能,但是,问题是在静态页面的JS里面利用XMLHttpRequest来实现,就有一定的难度了,毕竟从来没有接触过。查阅了大量的资料后发现,在XMLHttpRequest里面确实可以设置SetHeader(),最终决定使用Prototype.js里面现成的封装来实现,具体实现如下——
<script language="javascript">
//alert($("Shadow").innerHTML);
var myarray = new Array();
myarray.push("Range");
myarray.push("bytes=0-");
myarray.push("Pragma");
myarray.push("no-cache");
myarray.push("Cache-Control");
myarray.push("no-cache");
alert(myarray[1].toString());
function myAJAX(){
new Ajax.Request('replace.php', {
method:'get',
requestHeaders:myarray,
onSuccess: function(transport){
var json = transport.responseText;//.evalJSON();
alert(json);//.a);
//var data = '{ "name": "Violet", "occupation": "character" }'.evalJSON();
//alert(data.name);
}
});
}
</script>
为了测试,我使用Array.push()方法建立数组,没有直接初始化数组,一段儿测试代码大家将就看看,我说一下比较重要的几点:
1、Prototype里面RequestHeaders是一个数组,作为参数的内容必须是个数组;
2、Prototype里面这个参数是可选得;
3、Prototype里调用Ajax.Request()的时候加参数的方法和其他参数一样——“requestHeaders:myarray,”参数用逗号分割。
4、Prototype里设置分段的方法如下——
Range头域可以请求实体的一个或者多个子范围。例如,
表示头500个字节:bytes=0-499
表示第二个500字节:bytes=500-999
表示最后500个字节:bytes=-500
表示500字节以后的范围:bytes=500-
第一个和最后一个字节:bytes=0-0,-1
同时指定几个范围:bytes=500-600,601-999
GEThttp://download.microtool.de:80/somedata.exe
Host:download.microtool.de
Accept:*/*
Pragma:no-cache
Cache-Control:no-cache
Referer:http://download.microtool.de/
User-Agent:Mozilla/4.04[en](Win95;I;Nav)
Range:bytes=554554-
以上是一个测试的头,注意Range字段!
前段时间跳槽了,所以很久没来写文章,现在压力很大啊,感觉这么大个项目自己要亲自去设计,还是蛮有压力的,只能努力工作、祝自己好运了!在工作中如果发现什么觉得有价值的技巧,我会在这里跟大家进行分享。