×
大家都在搜

微信扫码登录

使用验证码登录

QQ登录

只需一步,快速开始

+发表新主题
分享
开启左侧

聊聊:JavaScript XHR和Fetch使用区别详解

[复制链接]

聊聊:JavaScript XHR和Fetch使用区别详解

岁月如歌 发表于 2024-6-21 11:25:04 浏览:  57 回复:  0 [显示全部楼层] 回帖奖励 |倒序浏览 |阅读模式


ECMAS2022(ES6)标准的发布已经年有余,现代浏览器对ES6语法的支持趋于完善,用P对象处理异步请求被越来越多的开发者应用。为了更好地处理异步请求,作为对现有的XMLHR方法的替代,JS引入了方法,基于P处理异步请求。在F出现之前我们发送异步请求默认都是通过,底层使用了宿主环境的(XHR)XMLHTTPR对象来现异步请求。现代码如下:

=XMLHR();("","",);();=(){
(S===4){
(==200){
(T);
}
}}


当然我们一般会用一些封装过的现解决传统方式的繁琐写法以及低版本浏览器可能出现的兼容问题,比如的:

$({
:'',
:'',
:(){
}})


FAPI提供了一个JS接口,用于访问和操纵HTTP管道的部分,例如请求和响应。它还提供了一个全局()方法,该方法提供了一种简单,理的方式来跨络异步获取资源。的基本用法

(':')
((){
})
((){
();
});


是不是看上去和以及一些流行的框架的库很相似。但是你不要忘了,是浏览器原生支持的,使用可以不用引用的类库即可现。默认返回一个对象。非支持和,使用它可以更加简洁的编写我们的请求逻辑。

注意点:1是有兼容问题的IE系列是完全不支持的,主流浏览器的早起版本也不支持,所以如果在项目中使用需要做兼容方案处理。2不管请求处理成功还是失败,都会触发的状态回掉。这个和传统的框架是有点区别的。只有当络故障导致请求发送失败或者跨域的时候才会触发的逻辑。我们可以通过对象的是否是来判断是否是真正的成功。

('')((){
(){
();
}
E('N');})((B){
URL=URLOURL(B);
I=URL;})((){
('T:',);});


3配置请求是否携带和接受服务端写入是通过设置

所有情况都携带('',{
:''})目前改为默认是-同源的情况下带('',{
:'-'})忽略('',{
:''})


4不想可以原生支持异步请求,因为默认是一个的对象。所以如果想用同步的写法,可以借助来现。

I(){
=(':');
=;
;}


F更多参数

(,{
:JSON(),'C-T'
:'-',*,-,,-,--
:'-',,-,*
:{
'-':'M40MDNE',
'-':''
},
:'POST',*GET,POST,PUT,DELETE,
:'',-,,*-
:'',,*,
:'-',*,-
})


需要注意的是,该语法是比较新的用法,浏览器的支持可能会随着升级产生一些变化。所以切记做好兼容探测处理。避免意外出现。






这之后,h5小游戏不惧未来,敢打敢拼,在市场上赢得了一次又一次的掌声。https://www.uihtm.com/h5-game/HTML源码网(www.uihtm.com)提供div+css3响应式模板包括:网页模板、企业模板、商城模板,以及h5网站,jQuery网页特效,wp主题等8000G源码免费模板下载。