Fetch API与XMLHttpRequest的比较

11 浏览
0 Comments

Fetch API与XMLHttpRequest的比较

我知道Fetch API使用Promise，而两者都允许你向服务器发送AJAX请求。

我已经阅读过Fetch API具有一些额外的功能，这些功能在XMLHttpRequest中不可用（以及Fetch API的polyfill，因为它基于XHR）。

Fetch API有哪些额外的功能？

admin 更改状态以发布 2023年5月23日
0

2 答案

0 Comments

\n\n

fetch

\n

    \n

  • 缺少内置方法消耗文档

    • \n

  • 目前还没有设置超时的方法yet

    • \n

  • 无法覆盖响应头的content-type

    • \n

  • 如果响应头中提供了content-length但没有公开，流传输过程中无法确定整个正文的长度

    • \n

  • 即使请求已完成，也会调用信号中的中止处理程序

    • \n

  • 没有上传进度（支持像 ReadableStream 这样的请求体暂时还未来临）

    • \n

  • 不支持 --allow-file-access-from-files (chromium)

    • \n

\n

XHR

\n

    \n

  • 无法不发送cookie（除非使用非标准mozAnon标志或AnonXMLHttpRequest构造函数）

    • \n

  • 无法返回 FormData 实例

    • \n

  • 没有fetch的no-cors模式相当于

    • \n

  • 总是遵循重定向

    • \n

0
0 Comments

使用fetch而不是XHR，您可以完成一些操作:

  • 您可以在请求和响应对象中使用Cache API；
  • 您可以执行无模式请求（“no-cors”），从未实现CORS的服务器获取响应。您无法直接从JavaScript访问响应体，但可以与其他API（例如Cache API）一起使用；
  • 流式响应（XHR将整个响应缓冲在内存中，而使用fetch您将能够访问低级流）。这在所有浏览器中都不可用，但很快就会有。

您可以使用XHR进行的某些操作，目前使用fetch无法实现，但迟早都会实现（在此处“未来的改进”段落中阅读：https://hacks.mozilla.org/2015/03/this-api-is-so-fetching/）：

  • 中止请求（在Firefox和Edge中现在可以使用，如@sideshowbarker在他的评论中所解释的那样）；
  • 报告进度。

这篇文章https://jakearchibald.com/2015/thats-so-fetch/包含更详细的描述。

0