当前位置: 代码迷 >> Ajax >> 11.localXHR支持本土使用Ajax
  详细解决方案

11.localXHR支持本土使用Ajax

热度:280   发布时间:2012-10-21 09:00:07.0
11.localXHR支持本地使用Ajax
Ajax是不能在本地文件系统中使用的,必须把数据放到服务器上。无论是IIS、Apache、 Tomcat,还是你熟悉的其他服务器,
只要支持HTTP协议,就可以使用EXT中的Ajax。
至于本地为何不能用Ajax,主要是因为Ajax要判断HTTP响应返回的状态,只有status=200时才认为这次请求是成功的。
所以,localXHR做的就是强行修改响应状态,让Ajax可以继续下去。
下面我们来分析一下localXHR的源代码。
 > 加入了一个forceActiveX属性,默认是false,它用来控制是否强制使用activex,activex是在IE下专用的。
 > 修改createXhrObject函数,只是在最开始处加了一条判断语句,如下所示:
  1. if(Ext.isIE7?&&?!!this.forceActiveX){throw("IE7forceActiveX");}????
> 增加了getHttpStatus函数,这是为了处理HTTP的响应状态,如下代码:
  1. getHttpStatus:?function(reqObj){??
  2. ????var?statObj?=?{??
  3. ????????status:0??
  4. ????????,statusText:''??
  5. ????????,isError:false??
  6. ????????,isLocal:false??
  7. ????????,isOK:false??
  8. ????};??
  9. ????try?{??
  10. ????????if(!reqObj)throw('noobj');??
  11. ????????statObj.status?=?reqObj.status?||?0;??
  12. ???
  13. ????????statObj.isLocal?=?!reqObj.status?&&?location.protocol?==?"file:"?||??
  14. ???????????????????????????Ext.isSafari?&&?reqObj.status?==?undefined;??
  15. ???
  16. ????????statObj.statusText?=?reqObj.statusText?||?'';??
  17. ???
  18. ????????statObj.isOK?=?(statObj.isLocal?||??
  19. ????????????????????????(statObj.status?>?199?&&?statObj.status?<?300)?||??
  20. ?????????????????????????statObj.status?==?304);??
  21. ???
  22. ????}?catch(e){??
  23. ????????//status?may?not?avail/valid?yet.??
  24. ????????statObj.isError?=?true;??
  25. ????}??
  26. ???
  27. ????return?statObj;??
  28. },??
它为状态增添了更多语义,status表示状态值,statusText表示状态描述,isError表示是否有错误, isLocal表示是否在本地进行Ajax访问,isOK表示操作是否成功。 判断isLocal是否为本地的有两种方法:reqObj没有status,而且请求协议是file:;浏览器是Safari, 而且reqObj.status没有定义。 statObj中的isOK属性用来判断此次请求是否成功。 判断请求是否成功的条件很多,例如:isLocal的属性为true、响应状态值在199~300之间、响应状态值是304等。 如果处理过程中出现了异常,就会将isError属性设置为true,最后会把配置好的statObj对象返回,等待下一个步骤的处理。 localXHR.js对handleTransactionResponse函数进行了简化。 因为增加的getHttpStatus函数很好地封装了与请求相关的各种状态信息,所以在handleTransactionResponse函数中我们不会 看到让人头晕目眩的响应状态代码。 取而代之的是isError和isOK这些更容易理解的属性,localXHR.js直接使用这些属性来处理响应。 createResponseObject函数被大大强化了。 其实前半部分都是一样的,localXHR.js中对isLocal做了大量的处理,响应中的responseText可以从连接中获得。 如果需要XML,它就使用ActiveXObject("Microsoft.XMLDOM")或new DOMParser()把responseText解析成XML放到response里, 响应状态也是重新计算的,这样就能让Ajax正常调用了。 最后处理的是asyncRequest函数,如果在异步请求时出现异常,就调用handleTransac- tionResponse返回响应, 然后根据各种情况稍微修改header属性。 我们来看看下面这行代码:
  1. Ext.lib.Ajax.forceActiveX?=?(document.location.protocol?==?'file:');??????????????????
如果协议是file:,就强制使用activex。
  相关解决方案