日期:2014-05-16  浏览次数:20713 次

用Dojo实现Ajax请求:XHR、跨域、及其他

在任何浏览器上方便地实现Ajax请求是每一个Ajax框架的初衷。Dojo在这方面无疑提供了非常丰富的支持。除了XMLHttpRequest之外,动态script、iframe、RPC也应有尽有,并且接口统一,使用方便,大多数情况下都只需要一句话就能达到目的,从而免除重复造轮子的麻烦。

AD: <script src="http://www.51cto.com/js/article/keywords_ad_new.js"></script>

?

在任何浏览器上方便地实现Ajax请求是每一个Ajax框架的初衷。Dojo在这方面无疑提供了非常丰富的支持。除了XMLHttpRequest之外,动态script、iframe、RPC也应有尽有,并且接口统一,使用方便,大多数情况下都只需要一句话就能达到目的,从而免除重复造轮子的麻烦。而且,Dojo一贯追求的概念完整性也在这里有所体现,换句话说,在使用Dojo的Ajax工具的过程中不会感到任何的不自然,相反更容易有触类旁通的感觉,因为API的模式是统一的,而且这里涉及到的某些概念(如Deferred对象)也贯穿在整个Dojo之中。

Dojo的XHR函数

Dojo的XMLHttpRequest函数就叫dojo.xhr,除了把自己取名美元符号之外,这好像是最直接的办法了。它定义在Dojo基本库里,所以不需要额外的require就能使用。它可以实现任何同域内的http请求。不过更常用的是dojo.xhrGet和dojo.xhrPost,它们只不过是对dojo.xhr函数的简单封装;当然根据REST风格,还有dojo.xhrPut和dojo.xhrDelete。

这些函数的参数都很统一。除了dojo.xhr的第一个参数是http方法名之外,所有的dojo.xhr*系列函数都接受同一种散列式的参数,其中包含请求的细节,例如url、是否同步、要传给服务器的内容(可以是普通对象、表单、或者纯文本)、超时设定、返回结果的类型(非常丰富且可扩展)、以及请求成功和失败时的回调。所有dojo.xhr*函数(实际上是所有IO函数)返回值也都一样,都是一个Deferred对象,顾名思义,它能让一些事情“延迟”发生,从而让API用起来更灵活。

下面的两个例子可能会带来一点直观感受:

  1. dojo.xhrGet({ ?
  2. ????url:?"something.html", ?
  3. ????load:?function(response,?ioArgs){ ?
  4. ????????//用response干一些事 ?
  5. ????????console.log("xhr?get?success:",?response); ?
  6. ????return?response;?//必须返回response ?
  7. ????}, ?
  8. ????error:?function(response,?ioArgs){ ?
  9. ????????console.log("xhr?get?failed:",?response); ?
  10. ????????return?response;?//必须返回response ?
  11. ????} ?
  12. }); ?
  13. //Deferred对象允许用同步调用的写法写异步调用 ?
  14. var?deferredResult?=?dojo.xhrPost({ ?
  15. ????url:?"something.html", ?
  16. ????form:?formNode,?//Dojo会自动将form转成object ?
  17. ????timeout:?3000,?//Dojo会保证超时设定的有效性 ?
  18. ????handleAs:?"json"?//得到的response将被认为是JSON,并自动转为object ?
  19. }); ?
  20. //当响应结果可用时再调用回调函数 ?
  21. deferred