`
objectbean
  • 浏览: 15073 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

11.localXHR支持本地使用Ajax

    博客分类:
  • Ext
阅读更多
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。
分享到:
评论

相关推荐

    Ext深入浅出 数据传输

    10.11 localXHR支持本地使用Ajax ...............254 10.12 本章小结...............................................255 第11 章 实用工具................................................... 256 11.1 EXT提供...

    EXT2.0在本地浏览API的插件

    `localXHR.js`的核心是模拟了AJAX的请求过程,允许开发者像使用远程HTTP服务一样调用本地文件。这种技术通常依赖于特定的浏览器支持,例如使用HTML5的FileReader API或者Flash等技术。它使得EXT应用可以在用户授权的...

    Jquery(Ajax)_多线程_数据库

    对于前端开发,尤其是涉及到实时数据交换,常常使用到的是浏览器端的本地存储技术,如IndexedDB和Web Storage(分为Session Storage和Local Storage)。 IndexedDB是一个基于键值对的数据库,适合存储大量结构化...

    Ext 开发指南 学习资料

    10.2. localXHR让你在不用服务器就玩ajax 10.3. 在form中使用fckeditor 10.4. 健康快乐动起来,fx里的动画效果 10.5. 悄悄的更新网页内容 A. 常见问题乱弹 A.1. ext到底是收费还是免费 A.2. 怎么查看ext2里的api文档...

    ext文档离线访问方法

    4. **模拟网络请求**:使用如localXHR.js这样的工具,模拟在线环境下的AJAX请求,从本地缓存获取数据。 5. **源码阅读**:可能需要阅读EXTJS框架的源码,理解其内部如何处理离线逻辑。 6. **调试工具**:熟练使用...

    EXT2.0中文教程

    10.2. localXHR让你在不用服务器就玩ajax 10.3. 在form中使用fckeditor A. 常见问题乱弹 A.1. ext到底是收费还是免费 A.2. 怎么查看ext2里的api文档 A.3. 如何在页面中引用ext A.3.1. 顺便说说常见的Ext is not ...

    web javaScript 获取终端ip 获取本地ip 获取本机ip地址,403报错解决方案

    在 JavaScript 中获取本地 IP 地址通常需要借助于第三方 API 或者后端服务的支持,因为浏览器出于安全考虑不允许直接访问设备信息。一种常见的方式是通过向提供此类服务的 API 发送请求来间接获取: 1. **示例 API ...

    ExtJS教程.pdf

    为了解决这一问题,有开发者编写了一个名为`localXHR`的插件,允许Ajax请求从本地文件系统获取数据。 #### 1.5 为什么自己按照例子写的代码,显示出来总找不到图片? 在ExtJS中,经常使用一个空图片作为占位符,并...

    Dojo 学习要点

    使用djConfig="dojo.local:'zh'"可以将Dojo设置为中文语言环境。 控件和布局 dijit是Dojo中的UI组件库,提供了许多控件和布局管理器,例如按钮、文本框、表格等。使用dijit可以快速构建Web应用程序的用户界面。 ...

    Matty-Beats-Messager

    开发者可能会使用 AJAX(Asynchronous JavaScript and XML)或者现代浏览器支持的 Fetch API 来与服务器进行数据通信,实现消息的发送和接收。 4. **JSON 格式**:通常,前后端之间的数据交换使用 JSON(JavaScript...

    jQuery 1.5.1 发布,全面支持IE9 修复大量bug

    这些参数有助于在使用Ajax时对请求进行更细致的控制。 - isLocal参数:这个新增的参数允许jQuery检测当前环境是否为本地环境。默认情况下,jQuery不能识别像文件系统这样的本地环境,现在通过isLocal可以解决这一...

Global site tag (gtag.js) - Google Analytics