fetch基础以及实践以及结合useRequest实践

发布网友发布时间：2022-10-11 14:04

共1个回答

热心网友时间：2023-10-13 04:00

1 .fetch支持通过数据流（Stream 对象）处理数据，可以分块读取，有利于提高网站性能表现，减少内存占用，对于请求大文件或者网速慢的场景相当有用。XMLHTTPRequest 对象不支持数据流，所有的数据必须放在缓存里，不支持分块读取，必须等待全部拿到后，再一次性吐出来。
2 .

1 .fetch使用promise,而不是回调函数
2 .fetch采用模块化设计,API分散在多个对象上.
3 .fetch通过数据流处理对象,可以分块读取,有利于提高网站性能表现,减少内存占用,对于请求大文件或者网速慢得场景相当有用
4 .XMLHttp对象不支持数据流,所有的数据必须存放在缓存里,不支持分块读取,必须等待全部拿到之后,在一次性吐出来

1 .fetch接收到的response是一个流对象,是服务器的回应
2 .fetch('url').then(response=>response.json())
3 .

4 .response包含的数据通过Stream接口异步读取,一些同步属性可以马上读取到
5 .可以读取到的同步属性

6 .headers属性:指向一个Header对象,对应HTTP回应的所有标头

7 .读取内容的方法:根据服务器返回的不同类型的数据,提供了不同的读取方法

1 .正常情况下,response对象只能被读取一次,读取一次就没了,因为他是流对象
2 .如果想要多次读取,需要创建Response对象的副本,实现多次读取
3 .现在可以多次读取了
const response1 = await fetch('flowers.jpg');
const response2 = response1.clone()

1 .返回一个ReadableStream对象,可以分块读取内容,让用户操作

1 .fetch发出请求之后,只有网络错误,无法连接才会报错,其他任何情况都认为是请求成功
2 .服务器返回的状态码是4XX,5XX,fetch也不会报错,promise不会变为rejected状态
3 .只有通过Response.status属性,得到http回应的真实状态码,才能判断是否请求成功,还有一种就是判断response.ok是否为true

1 .第一个参数是url,第二个参数作为配置对象,定制发出的http请求
2 .POST请求

3 .不能通过headers设置的属性,Content-Length,Cookie,Host,是浏览器自动生成的
3 .提交表单

4 .上传文件,先不考虑.但是可以直接上传二进制文

1 .cache:指定如何处理缓存

2 .mode:指定请求的模式

3 .credentials:指定是否发送Cookie

4 .signal:指定一个AbortSignal实例,用于取消fetch请求

5 .keep-alive:页面卸载时,告诉浏览器在后台保持连接,继续发哦是那个数据

6 .redirect:指定http跳转的处理方法

7 .integrity:指定一个哈希值,用于检查HTTP回应传回的数据是否等于这个预先设定的哈希值

8 .referrerr:用于设定fetch请求的referer标头

9 .referrerPolicy:设定referer标头的规则