切换导航
首页
技术问答
编程语言
前端开发
移动开发
开发工具
程序设计
行业应用
CMS系统
服务器
频道导航
▸ PHP
▸ Java
▸ Java SE
▸ Python
▸ C#
▸ C&C++
▸ Ruby
▸ VB
▸ asp.Net
▸ Go
▸ Perl
▸ netty
▸ Django
▸ Delphi
▸ Jsp
▸ .NET Core
▸ Spring
▸ Flask
▸ Springboot
▸ SpringMVC
▸ Lua
▸ Laravel
▸ Mybatis
▸ Asp
▸ Groovy
▸ ThinkPHP
▸ Yii
▸ swoole
▸ HTML
▸ HTML5
▸ JavaScript
▸ CSS
▸ jQuery
▸ Bootstrap
▸ Angularjs
▸ TypeScript
▸ Vue
▸ Dojo
▸ Json
▸ Electron
▸ Node.js
▸ extjs
▸ Express
▸ XML
▸ ES6
▸ Ajax
▸ Flash
▸ Unity
▸ React
▸ Flex
▸ Ant Design
▸ Web前端
▸ 微信小程序
▸ 微信公众号
▸ iOS
▸ Android
▸ Swift
▸ Hybrid
▸ Cocos2d-x
▸ Flutter
▸ Xcode
▸ Silverlight
▸ cocoa
▸ Cordova
前端之家
Dojo
深入浅出dojo/request
深入浅出dojo/request
2019-11-27
Dojo
前端之家
前端之家
收集整理的这篇文章主要介绍了
深入浅出dojo/request
,
前端之家
小编觉得挺不错的,现在分享给大家,也给大家做个参考。
@H_
301
_0@
随着Dojo向着2.0大步迈进,我们已开始致力于为开发人员提供能在任何JavaScript环境下保持高效生产力的工具。这意味着我们所创建的API必须在所有环境下都保持一致。从这个角度看,有一个领域的API总是被遗漏,那就是Dojo的IO
函数
。我们已经为开发人员提供了在浏览器中发起请求的
方法
(dojo.xhr*,dojo.io.iframe,dojo.io.script),但有些人不太喜欢这些API所表现出的不一致性(例如dojo.xhrGet以及dojo.io.script.get,等等)。另外,我们还从来没有提供一套服务器端的实现;就算提供了,也肯定是另一套不同模块和API,大家就又需要记忆更多东西了。
@H_
301
_0@
@H_
301
_0@
在Dojo1.8发布之际,我们隆重推出
dojo/requestAPI
。这套API在所有的浏览器、所有请求
方法
、甚至所有JavaScript环境上都是一致的:
@H_
301
_0@
[javascript]
view plain
copy
<spanstyle=
"font-size:14px;"
>require([
"dojo/request"
],
function
(request){
var
promise=request(url,options);
promise.then(
function
(data){
},
function
(error){
}
);
promise.response.then(
function
(response){
},
function
(error){
}
);
request.get(url,options).then(...);
request.post(url,options).then(...);
request.put(url,options).then(...);
request.del(url,options).then(...);
});</span>
dojo/request
函数
(以及该模块下所有的发起请求的
函数
)的签名包含一个URL以及一个选项对象。这个选项对象中可以配置有关这次请求的各种参数。通常情况下使用dojo/request非常简单,只需要传递一个字符串,option参数是可省略的。让我们来看看option对象中的常用配置参数:
@H_
301
_0@
method:
用于本请求的HTTP
方法
(默认是GET,dojo/request/script会忽略这个参数)
query:
形如key=value的字符串,或者形如{key: 'value'}的对象,包含所有的query参数
data:
字符串或对象(会被dojo/io-query.objectToQuery串行化成字符串),表示需要发送的数据(GET和DELET请求会忽略这个参数)
handleAs:
表示如何处理服务器端响应的字符串,默认"text",其他可能的值
包括
'json','javascript',以及'xml'
headers:
形如{'Header-Name': 'value'}的对象,包含请求所需要的各种头部
属性
timeout:
表示等待多少毫秒算超时的整数,一旦超时将取消请求并"拒绝(reject)"所返回的promise。
@H_
301
_0@
API的一致性还
包括
返回值:所有dojo/request
方法
都返回一个“保证(promise)”对象,这个promise对象最终会提供响应数据。如果在发起请求时指定了某个响应
内容
解析器(通过handleAs参数),那么这个promise对象就会提供这个
内容
解析器的解析结果,否则它将直接返回响应的body部分的文本。
@H_
301
_0@
@H_
301
_0@
dojo/request所返回的promise对象具有一个普通promise没有的附加
属性
:response。这个
属性
本身也是一个promise,它将提供一个对象来更详细地描述这次响应:
@H_
301
_0@
url:
发起请求的最终URL(
加上
了query字符串)
options:
请求相关的参数
text:
响应中数据的字符串表示
data:
对响应进行
处理后返回的数据(如果handles参数指定了有效的解析方式)
getHeader(headerName):
用于
获取
请求头部参数的
函数
;如果某个provider没有提供头部信息,这个
函数
将返回null。
Provider
(提供者,这里指能够提供某种请求处理方式的模块 ——译注)
@H_
301
_0@
在幕后,dojo/request是通过provider来发起请求的。对于每一个平台dojo都选好了一个合适的默认provider:浏览器使用
dojo/request/xhr
,Node.js使用
dojo/request/node
。需要指出的是,比较新的浏览器(IE9+,FF3.5+,Chrome7+,Safari4+)将使用心得
XMLHttpRequest2
事件,而不是XMLHttpRequest的onreadystatechange,那只有在更老的浏览器中才会使用。另外,Node.js的provider直接使用了http和https模块,这意味着不用在服务器端部署任何接受XMLHttpRequest请求的中间层。
@H_
301
_0@
@H_
301
_0@
如果需要使用一个非默认的provider(例如JSON-P的provider),有如下三种选择:直接使用非默认provider;把它配置成默认provider;或者配置请求的
注册
信息。
@H_
301
_0@
@H_
301
_0@
由于所有的provider都遵循dojo/request API,非默认的provider是可以直接使用的。dojo/request的架构设计思想类似于dojo/store。这意味着如果你只有一些JSON-P服务,你可以直接使用
dojo/request/script
而不用改变基本的API签名。与其他两种方式比较起来,这种使用非默认provider的方式灵活性较差,但它是的确是一种完全有效的方式。
@H_
301
_0@
@H_
301
_0@
另一种使用非默认provider的方式是将它配置成默认provider。如果我们知道我们的应用只会使用这一个provider,那这样做就非常有帮助。配置默认provider其实非常简单,就是把provider的模块ID设置成dojoConfig的requestProvider
属性
:
@H_
301
_0@
[html]
view plain
copy
<
span
style
=
"font-size:14px;"
>
<
script
>
var
dojoConfig
={
requestProvider:"dojo/request/script"
};
</
script
>
<
script
src
=
"path/to/dojo/dojo.js"
>
</
script
>
</
span
>
requestProvider也可以通过data-dojo-config来设置,就像其他配置参数一样。另外,因为任何遵循dojo/request API的
函数
都能作为默认provider,我们当然也可以开发一个
自定义
的模块,将dojo/request/xhr包装起来,再
加上
额外的头部信息(例如用于身份验证),这样就能作为一个
自定义
的provider来给我们的应用使用了。而且,在测试阶段,我们也可以使用一个特殊的provider来模拟服务器发回的响应,这样就能验证我们的应用是否在发出正确的请求。
@H_
301
_0@
@H_
301
_0@
虽然比起直接使用非默认provider来,将其配置成默认能为我们提供更大的灵活性,但这么做仍然不能只通过一个API(dojo/request)就做到根据预设条件来
自动
使用不同provider的能力。假设我们的应用有一些数据服务,其中一个服务需要一组用于身份验证的头部信息,而另一个需要完全不同的另一组头部信息。或者一个需要JSON-P而另一个需要XMLHttpRequest。这种情况下就是dojo/request/registry闪亮登场的时候了。
@H_
301
_0@
注册
机制
@H_
301
_0@
Dojox中有一个存在了很久但并没有得到广泛使用的模块dojox/io/xhrPlugins。这个模块可以让dojo.xhr*成为所有请求的接口,无论这些请求是通过JSONP发送还是iframe,甚至是其他
用户
自定义
的方式。这个统一接口的思想非常有用,因此被沿用到
dojo/request/registry
中。
@H_
301
_0@
@H_
301
_0@
dojo/request/registry同样遵循dojo/request API(因此它本身就可以作为一个provider),不过
增加
了一个register
函数
:
@H_
301
_0@
[javascript]
view plain
copy
<spanstyle=
"font-size:14px;"
>
//如果一个请求的URL是"some/url",provider就会被用来处理这个请求
registry.register(
"some/url"
,provider);
//如果一个请求的URL以"some/url"开始,provider就会被用来处理这个请求
registry.register(/^some\/url/,provider);
//如果一个请求是一HTTPGET
方法
发送的,provider就会被用来处理这个请求
registry.register(
function
(url,options){
return
options.method===
"GET"
;
},
provider
);
//如果不能匹配到任何已
注册
的条件,默认provider将被使用
</span>
@H_
301
_0@
如果所有条件都不满足,而且也没有备用provider可用,那么当前环境的默认provider将被启用。由于dojo/request/registry符合dojo/request API,它可以作为默认provider:
@H_
301
_0@
[html]
view plain
copy
<
span
style
=
"font-size:14px;"
>
<
script
>
var
dojoConfig
={
requestProvider:"dojo/request/registry"
};
</
script
>
<
script
src
=
"path/to/dojo/dojo.js"
>
</
script
>
<
script
>
require(["dojo/request","dojo/request/script"],
function(request,script){
request.register(/^\/jsonp\//,script);
...
}
);
</
script
>
</
span
>
@H_
301
_0@
如果我们想要使用平台默认的provider(对于浏览器来说是XHR)作为备用,那这样做当然很好,但我们也可以通过上例中的最后一条语句设置自己的备用provider,只是在这句话之后就不能再
注册
其他provider了。设置在requestProvider参数上的dojo/request/registry还可以接受
插件
作为备用provider:
@H_
301
_0@
[html]
view plain
copy
<
span
style
=
"font-size:14px;"
>
<
script
>
var
dojoConfig
={
requestProvider:"dojo/request/registry!my/authProvider"
};
</
script
>
<
script
src
=
"path/to/dojo/dojo.js"
>
</
script
>
<
script
>
require(["dojo/request",script);
...
}
);
</
script
>
</
span
>
@H_
301
_0@
好了,现在任何不满足预设条件的请求都会由my/authProvider来处理。
@H_
301
_0@
@H_
301
_0@
注册
provide
功能
的强大可能还不是那么明显。现在让我们来看几个让
注册功能
大显身手的场景。首先,考虑一个应用,它的服务器端API是在不断变化的。也就是说虽然我们知道每一个具体的终端服务,但我们不知道会需要什么样的头部信息,甚至也不知道响应中会返回什么样的JSON对象。我们可以很容易地为每一项服务
注册
一个临时provider,然后立马开始开发
用户
界面。假设我们猜想/service1将在items
属性
中返回JSON格式的数据项,而/service2将在data
属性
中返回这些数据项:
@H_
301
_0@
[javascript]
view plain
copy
<spanstyle=
"font-size:14px;"
>request.register(/^\/service1\
//,function(url,options){
var
promise=xhr(url,lang.delegate(options,{handleAs:
"json"
})),
dataPromise=promise.then(
function
(data){
return
data.items;
});
return
lang.delegate(dataPromise,{
response:promise.response
});
});
request.register(/^\/service2\
//,options){
var
promise=xhr(url,
dataPromise=promise.then(
function
(data){
return
data.data;
});
return
lang.delegate(dataPromise,{
response:promise.response
});
});</span>
@H_
301
_0@
现在所有在
用户
界面中用到的服务请求都可以通过request(url,options).then(...)的形式来使用,并且它们都会接收到正确的数据。随着开发过程的进行,某个服务端团队可能决定改让/service1在data
属性
中以JSON格式返回数据项,而/service2则以XML的格式返回。如果不使用
注册
机制,这将导致大量的
代码
改动。有了
注册
机制,我们已经将我们的widget和store所需要的接口和服务所能提供的接口解耦了,这意味着服务器端团队的决定只会导致两处
代码
改变:在我们的两个provider中。理论上,我们甚至能将
用户
界面与URL进行进一步解耦,通过使用通用的URL让我们的
注册
机制
自动
将正确的服务终端映射到正确的provider上。这就避免了服务终端的改动导致的前端
代码
的大量
修改
。
@H_
301
_0@
@H_
301
_0@
这种解耦也可以拓展到测试上。通常在单元测试中无法获得远程服务:远程数据可能变化,远程服务器也可能不可用。这也是为什么推荐使用静态数据做测试。但如果我们的widget和
用户
界面把服务终端和对应请求都写死在里面了,我们还怎么去测试呢?而如果我们使用了dojo/request/registry,只需要
注册
一个专门为测试任务返回静态数据的provider就行了,所有的API
调用
都不需要
修改
,现有应用中不需要重写任何
代码
。
@H_
301
_0@
结论
@H_
301
_0@
可见,dojo/request是为开发者编写的:对于简单的场景有简单的API,对于复杂场景也有非常灵活的选项。
@H_
301
_0@
相关资料
@H_
301
_0@
更多关于dojo/request的学习资料请参考:
@H_
301
_0@
Ajax with dojo/request tutorial
dojo/request reference guide
dojo/request API
上一篇:【Dojo学习之三】dojo的组件大放送
下一篇:【Dojo学习之四】Dojo语法
猜你在找的Dojo相关文章
dojo/Deferred类和dojo/promise类的使用
参考博客:https://blog.csdn.net/blog_szhao/article/details/50220181 ...
作者:前端之家 时间:2020-08-01
设置查询以搜索dojo数据网格的所有字段
我有一个包含多个字段的Dojo DataGrid.我目前正在设置查询一次搜索一个字段,如下所示: gr...
作者:前端之家 时间:2020-08-01
dojo – 为JsonRestStore设置HTTP Accept标头
我正在使用JsonRestStore,但想为它添加一个自定义Accept标头.最好的方法是什么? 这与diji...
作者:前端之家 时间:2020-08-01
dojo.query不适用于包含波形符(〜)字符的属性选择器
我需要选择一个给定其URL的链接节点.使用属性选择器的效果非常好,除了少数几个url有tilda的...
作者:前端之家 时间:2020-08-01
带有JSONREST问题的Dojo增强型网格
我正在尝试使用Dojo JSONREST的增强网格,我遇到了一些问题. 我一直在寻找一些例子,但无法弄...
作者:前端之家 时间:2020-08-01
什么时候会发布Dojo 2.0?
我使用过Dojo 1.0,但我有一些与版本相关的问题: >什么时候会发布Dojo 2.0? >也是最...
作者:前端之家 时间:2020-08-01
dojo中的setSelected()DataGrid使前一个选择活动,即使对于带有selectionMode =“single”的网格也是如此
我有一个dojox.grid.DataGrid,我想以编程方式选择一行.我正在使用setSelected()这样做,它第...
作者:前端之家 时间:2020-08-01
dojo – 如何从dijit.form.Select中获取选项文本?
我的页面上有一个dijit.form.Select: <c:set var="qualId" value="${prev...
作者:前端之家 时间:2020-08-01
如何检查dojo.datagrid加载完成?
参见英文答案 > How to determine if a dojo grid has finished loading? ...
作者:前端之家 时间:2020-08-01
dojo – 扩展dijit.Tree中的所有节点
有没有一种很好的方法来扩展/关闭dijit.Tree中的所有可扩展节点? 对于那些寻找答案的人,请...
作者:前端之家 时间:2020-08-01
编程分类
HTML
HTML5
JavaScript
CSS
jQuery
Bootstrap
Angularjs
TypeScript
Vue
Dojo
Json
Electron
Node.js
extjs
Express
XML
ES6
Ajax
Flash
Unity
React
Flex
Ant Design
Web前端
微信小程序
微信公众号
最新文章
• dojo/Deferred类和dojo/pr
• 设置查询以搜索dojo数据网
• dojo – 为JsonRestStore设
• dojo.query不适用于包含波
• 带有JSONREST问题的Dojo增
• dojo – 动态隐藏dgrid中的
• 什么时候会发布Dojo 2.0?
• dojo中的setSelected()Dat
• dojo – 如何从dijit.form
• 如何检查dojo.datagrid加载
热门标签
更多 ►
关闭广告
单独headers
封装代码
提示错误
整数正则
非0开头
跳页
出页码
antd table
提示URL未注册
公众号支付
vue hash模式
iSlider
车牌键盘
循环图片
echarts 双折
左右布局
DllPlugin
对象创建
打字游戏
圈选
两栏
云函数
蒙版
ES2020
橱窗
无缝滚动轮播
色块碰撞
组件销毁
文档操作