作者gpmm (银色)
看板Ajax
标题Re: [心得] 这次换json...只是简单的教学
时间Sun Sep 5 00:14:40 2010
看到这个，忽然想起以前做的一个简单的 pool 设计，
会写这段是因为当我们对 xmlHttpRequest 越依赖时，
使用者就越不容易在页面间移动，而 xmlHttpRequest 的使用就需要有些弹性，
这边是尚未最佳化的原始 code：
http://www.jsfiddle.net/MaZp4/ （太长了所以丢到 jsfiddle 去）
大概意思就是做一个 pool 来养 request 连线种子（xmlHttpHolder），
当使用呼叫的时候种子会呈现忙碌 (busy)，连线失败或使用完毕就让他恢复空闲，
以此控制 request 物件的数量，
而关於 pool 的取用则是直接包进 function xmlRequest 里，
这样实际上我们需要呼叫的只有一个 xmlRequest 函式，
它自己会去询问 pool 是否有 free 的种子或必须产生新的 holder 物件来存放。
好处是大量呼叫 request 送出去的时候，
会自己协调一个稍微节省效能的使用状态。
大概就是这样，分享一下 :P
※ 引述《s25g5d4 (死城盗贼)》之铭言：
: http://s25g5d4.sg1010.myweb.hinet.net/json.htm
: 这次顺便连XMLHttpRequest方法封装一起讲好了
: 先说方法封装是偷来的...
: function request(url, callback, data)
: {
: var xmlHttp = createXMLHTTPObject(); //建立XMLHttpRequest物件
: if ( ! xmlHttp) return;
: var method = (data) ? "POST" : "GET";
: xmlHttp.open(method, url, true); //到这里还没传出去喔
: if (data)
: {
: xmlHttp.setRequestHeader('Content-type',
: 'application/x-www-form-urlencoded');
: }
: xmlHttp.onreadystatechange = function ()
: {
: if (xmlHttp.readyState != 4) return;//等於4时才代表请求完成
: if (xmlHttp.status != 200 && xmlHttp.status != 304)
: {//HTTP 200代表请求成功 反之就未成功
: alert('HTTP请求错误 ' + xmlHttp.status);
: return;
: }
: var jsonObj = eval('(' + xmlHttp.responseText + ')');
: //将取得的字串转换为Object json的本质就是Object
: //不过用eval会有安全性问题...可以用json.org提供的js去parse
: //这边会用eval是因为方便 而且我确定我的json不会有安全性问题
: callback(jsonObj);
: }
: if (xmlHttp.readyState == 4) return;
: xmlHttp.send(data); //到这边 请求才会送出去
: }
: function createXMLHTTPObject()
: {
: var XMLHttpFactories = [
: function () {return new XMLHttpRequest()},
: function () {return new ActiveXObject("Msxml2.XMLHTTP")},
: function () {return new ActiveXObject("Msxml3.XMLHTTP")},
: function () {return new ActiveXObject("Microsoft.XMLHTTP")},
: ];
: var xmlhttp = false;
: for (var i = 0; i < XMLHttpFactories.length; i ++ )
: {
: try
: {
: xmlhttp = XMLHttpFactories[i]();
: }
: catch (e)
: {
: continue;
: }
: break;
: }
: return xmlhttp;
: }
: request('1.json', function (response) {
: //刚刚就说过了 json的本质就是Object(其实也可以是array 不过对js而言
: //array也是Object) 所以把json当Object处理
: document.write('uFlag = ' + response.uFlag + '<br>');
: document.write('message = ' + response.message);
: });
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 220.136.227.51
※ 编辑: gpmm 来自: 220.136.227.51 (09/05 00:16)
1F：→ TonyQ:我现在在的地方玩得比较凶，我们会把多个request打包一起送 09/05 02:29
2F：→ gpmm:是说把多个动作包成一只 request，还是把多个 request 09/05 11:52
3F：→ gpmm:一口气送出？ o_oa"" 09/05 11:53
4F：→ adxis:打包?是因为request频繁到可以等一小段时间来打包吗? 09/05 18:34
5F：→ TonyQ:多个动作包一只 request. 09/05 19:14
6F：→ TonyQ:no , 是因为我们有把事件分级 , 分成 DEFER 跟NON_DEFER 09/05 19:15
7F：→ TonyQ:当然也是因为我们的核心模型是 server-centric 的，所以对这 09/05 19:16
8F：→ TonyQ:类event比较好掌握。 09/05 19:16
9F：推 s25g5d4:快推不然人家说我们看不懂 09/05 19:21
10F：→ TonyQ:我最近在写一些example，等ready再发过来一起做案例讨论。 09/05 19:25
11F：推 s25g5d4:T大快出书 09/05 19:27
12F：→ gpmm:喔喔，我还以为是榜多支 request 送出，猛吓一跳 XD 09/06 01:01
13F：→ gpmm:不过这样听起来也满有趣的啊，有什麽样的 ui feedback 可以是 09/06 01:01
14F：→ gpmm: defer 处理的？ o_oa" 09/06 01:03
15F：→ TonyQ:request 可以做的事情很多元啊，不一定是 ui feedback，甚至 09/06 02:51
16F：→ TonyQ:是不需要 callback 的东西。XD 09/06 02:53
17F：→ TonyQ:其实除了DEFER/NON_DEFER以外，还有DUPLICATE_IGNORE ...etc 09/06 02:53
18F：→ TonyQ:这类的等级，很是合作为resize或mousemove这类事件用。XD 09/06 02:53
19F：→ TonyQ:有机会我举sample来聊吧，因为光这功能就很复杂了XD 09/06 02:54
20F：→ gpmm:丢题目出来比较好玩 XD 常常都是有那个需求才会去做那个功能 09/06 19:55