fetch的介绍和使用

最新推荐文章于 2024-05-05 15:15:00 发布
最新推荐文章于 2024-05-05 15:15:00 发布
阅读量1.4k 收藏 3
点赞数 2
分类专栏： fetah 文章标签： fetch
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44772522/article/details/91883107
版权
Fetch是ES6中基于Promise设计的一种数据获取方法，作为AJAX的替代品，其语法简洁、支持async/await，并提供了更丰富的API。相较于XMLHttpRequest，Fetch更底层且更加语义化，适用于同构开发。GET和POST请求的使用让Fetch在实际应用中表现出更高的灵活性。
摘要由CSDN通过智能技术生成

Fetch

什么是fetch

fetch号称是AJAX的替代品，是在ES6出现的，使用了ES6中的promise对象。Fetch是基于promise设计的。Fetch的代码结构比起ajax简单多了，参数有点像jQuery ajax。但是，一定记住fetch不是ajax的进一步封装，而是原生js，没有使用XMLHttpRequest对象。

优势

  1. 语法简洁，更加语义化
  2. 基于标准 Promise 实现，支持 async/await
  3. 同构方便，使用 isomorphic-fetch
    4.更加底层，提供的API丰富（request, response）
    5.脱离了XHR，

使用

GET请求

// 通过fetch获取百度的错误提示页面
fetch('https://www.baidu.com/search/error.html', {
最低0.47元/天 解锁文章
UMU-UMU
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
认识 Fetch API
前端大全
02-22 2517
（给前端大全加星标，提升前端技能）英文：Flavio 译文：众成翻译/涯丨角https://zcfy.cc/article/understanding-the-fetch...
Ajax，fetch，axios发展历史
qq_45102392的博客
04-15 1450
远古时期，XMLHttpRequest对象的出现，JavaScript调用它就可以让浏览器异步地发http请求，然后这项异步技术就被称为Ajax。 之后jQuery封装了它，让异步结果更清晰的表现在一个对象的回调函数属性上。编写方式更简单，但出现了新的问题~回调地狱。 Promise为了解决异步编程的回调地狱问题诞生了。 随后有人把xhr对象用Promise封装了起来~它就是axios库(浏览器端)，axios在node.js环境是http模块的封装 后来又出现了一个可以异步地发http请求的api，就是f
Fetch的概述和基本使用
最新发布
liufang_imei的博客
05-05 1272
浏览器提供了原生的AJAX实现类XMLHttpRequest，基于该类实例，我们可以实现在网页上发送AJAX请求到服务端。但是XMLHttpRequest的设计并不完美，主要体现在以下几个方面：HTTP请求，响应都被耦合在XMLHttpRequest实例上，结构不够简单明了采用事件回调的方式获取HTTP响应，可能会产生回调地狱如果HTTP响应数据过大，则会占用大量内存最后一点就是，XMLHttpRequest实现AJAX的步骤太零碎了。
Node.js 18 发布，引入全局 Fetch API 和核心测试运行器模块
过客2019
04-21 1303
来源: OSCHINA 编辑:罗奇奇 Node.js 18已发布，该版本的亮点包括将 V8 JavaScript 引擎更新到 10.1、默认启用全局 Fetch API 以及核心测试运行器模块。Node.js 18 是未来 6 个月的“当前”版本，然后在 2022 年 10 月升级为 LTS ，升级为 LTS 后将支持到 2025 年 4 月。 新的浏览器兼容 API 全局 Fetch API（实验性） Node.js 18 默认提供一个实验性的全局 Fetch API，该实现来自 HTTP/...
JavaScript基础浅聊：新方法fetch()
u011863822的博客
06-18 2565
简单聊了一下fetch方法，同时浅聊了以其为什么能代替XMLHttpRequest作为一个ajax思想实现的替代品。
fetch的初步了解
蓝猫爱睡觉
07-02 384
fetch 的初步了解 fetch是ES6提出的一套用于进行前后端交互的工具。 fetch()是 XMLHttpRequest 的升级版，用于在 JavaScript 脚本里面发出 HTTP 请求。 浏览器原生提供这个对象。 浏览器支持 fetch是相对较新的技术，当然就会存在浏览器兼容性的问题，当前各个浏览器低版本的情况下都是不被支持的，因此为了在所有主流浏览器中使用fetch 需要考虑 fetch 的 polyfill 了 require('es6-promise').polyfill();
fetch 使用及如何接收JS传值
10-19
主和要介绍了fetch 使用及如何接收JS传值,文中给大家提到了fetch基本使用方式和接收js传值的使用方式,需要的朋友可以参考下
fetch101:介绍性提取示例
05-10
练习使用fetch单元测试。 安装及使用 克隆存储库： git clone https://github.com/portsoc/fetch101.git 进入本地克隆的仓库： cd fetch101 安装库（包括我们在下一阶段中使用的http服务器）： npm install 使用...
react-native fetch的具体使用方法
08-28
Fetch 的标准概览可以查看 WHATWG 的官方文档，该文档提供了 Fetch 的详细介绍和使用指南。 Fetch 的浏览器支持 Fetch 的浏览器支持情况可以查看 Can I Use 的官方网站，该网站提供了 Fetch 的浏览器支持情况。 ...
详解vue中使用express+fetch获取本地json文件
10-19
本文将详细介绍如何使用Express和Fetch API来实现这一目标。首先，我们要理解fetch是一个现代浏览器提供的用于发送HTTP请求的方法，而Express是一个轻量级的Node.js Web应用框架，常用于构建后端服务器。 ### 1. ...
mysql_fetch_row()与mysql_fetch_array()的使用介绍
12-15
例如，如果查询的字段名为`username`和`passwd`，你可以使用`$row['username']`和`$row['passwd']`来获取数据。此外，如果你使用`foreach`循环并结合`as $key => $value`，还可以直接获取字段名。这样在处理复杂的...
fetch简介: 新一代Ajax API
weixin_34199335的博客
05-24 356
AJAX半遮半掩的底层API是饱受诟病的一件事情. XMLHttpRequest 并不是专为Ajax而设计的. 虽然各种框架对 XHR 的封装已经足够好用, 但我们可以做得更好。更好用的API是 fetch 。下面简单介绍 window.fetch 方法, 在最新版的 Firefox 和 Chrome 中已经提供支持。 XML...
使用fetch遇到过的坑
热门推荐
甜到酬勤
11-24 6万+
前段时间在项目中用到了这个fetch 来代替Ajax 进行网络请求。也踩了不少的坑，在这边列举出来以及他的解决方法。 1.如何保持每次请求的会话一致？   在用fetch进行网络请求的时候，发现每次请求到服务端的时候，他的sessionId 都是不一样的，后面排查原来是在请求的时候fetch默认是不会带上本地jsessionId，以至于服务端无法接收到，所以会重新创建一个新的sessi
原生 fetch 请求 fetch和ajax的区别
时间在飞飞的博客
05-19 1234
//比如请求一个json文件 async function(){ //请求 let res = fetch(“data1.json”); //解析内容 let data = await res.json() //获取到json 文件 console.log(data) } //比如请求一个图片 async function(){ //请求 let res = fetch(“dat...
fetch请求详解
万少博-FE
06-04 5500
最新更新时间：2019年06月04日16:18:30 《猛戳-查看我的博客地图-总有你意想不到的惊喜》 本文内容：fetch相关 概述 Fetch API 提供了一个获取资源的接口（包括跨域请求）,Fetch 是对 HTTP 接口的抽象，包括 Request，Response，Headers，Body。得益于 JavaScript 实现的这些抽象好的 HTTP 模块，其他接口能够很方便的使用...
fetch和ajax的认识和区别
张梦莹的博客
08-10 7100
这段时间在做的一个项目中使用到了fetch来获取数据，那么就会产生为什么要使用fetch而不用ajax，他们两个之间又存在什么样的区别的疑问。 所以自己就简单的整理一下下。 fetch fetch是基于promise实现的，也可以结合async/await。 fetch请求默认是不带cookie的，需要设置fetch（URL，{credentials:’include’})。 Crede...
初识fetch
qq_41706280的博客
10-22 212
借鉴处 1.fetch的出现是为了解决什么问题？ 解决古老的XHR不能实现的问题，语法更加简单明了。 fetch()方法提供了一种简单合理的方式来跨网络异步获取资源。 2.fetch是什么？ fetch是新的ajax解决方案。 fetch接受两个参数，第一个是获取资源的URL（必选），第二个是options对象（可选） options对象下几个常用的属性： method: 请求使用的方法，如 G...
Fetch诞生记
weixin_34419326的博客
03-12 79
Fetch作用？ https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch Fetch API  提供了一个 JavaScript接口，用于访问和操纵HTTP管道的部分，例如请求和响应。它还提供了一个全局 fetch()方法，该方法提供了一种简单，合乎逻辑的方式来跨网络异步获取资源。   这种功能以前是...
Fetch机器人使用教程：从基础到ROS开发
本文档详细介绍了Fetch Robotics公司的Fetch机器人，这是一款先进的智能移动抓取机器人，适用于科学研究、智能家居和服务业等多个领域。Fetch机器人采用开源的ROS（Robot Operating System）操作系统，提供丰富的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值