AJAX xmlhttprequest vs fetch(AJAX xmlhttprequest vs fetch)

xmlhttprequest vs fetch

参考了这篇博客。总结如下:

  • xhr 优点:这个是比较老的也是比较成熟的 AJAX 的实现方案,浏览器支持好,更加底层的一种调用方式,对于文件上传可以通过事件反应出进度。缺点:通过事件及回调函数的方式取得结果。使用比较复杂。
  • fetch 优点:这个是比较新的实现方案。返回的值是 Promise,调用比较方便。
    缺点:

    老版本 IE 不支持。
    API 可能会变动。
    对于 404/500 这种错误,Promise 依然是 Resolve,只有网络请求失败才会 Promise.reject。
    不支持 timeout。
    默认不会带上 cookie,需要添加配置 在第二个参数中添加{credential:’some-region’}
    Abort request 需要 AbortController 的配合,xhr 默认提供方法。

  • 老版本 IE 不支持。
  • API 可能会变动。
  • 对于 404/500 这种错误,Promise 依然是 Resolve,只有网络请求失败才会 Promise.reject。
  • 不支持 timeout。
  • 默认不会带上 cookie,需要添加配置 在第二个参数中添加{credential:’some-region’}
  • Abort request 需要 AbortController 的配合,xhr 默认提供方法。

总结一下:
Fetch 是趋势,但是目前还有些功能不足以替代 xhr。如果条件允许还是推荐用 fetch.

————————

xmlhttprequest vs fetch

Refer to this blog. The summary is as follows:

  • XHR advantages: This is an old and mature Ajax implementation scheme. The browser supports it well. It is a lower level calling method. For file upload, the progress can be reflected through events. Disadvantages: obtain results through events and callback functions. The use is complicated.
  • Fetch advantage: This is a relatively new implementation scheme. The returned value is promise, which is convenient to call.
    Disadvantages:
    Old version ie does not support.
    API may change.
    For 404 / 500 errors, promise is still resolve, and promise will only occur if the network request fails reject。
    Timeout is not supported.
    Cookies will not be brought by default. You need to add configuration. Add {credential: ‘some region’} in the second parameter
    Abort request requires the cooperation of abortcontroller. XHR provides the method by default.
  • Old version ie does not support.
  • API may change.
  • 对于 404/500 这种错误,Promise 依然是 Resolve,只有网络请求失败才会 Promise.reject。
  • 不支持 timeout。
  • Cookies will not be brought by default. You need to add configuration. Add {credential: ‘some region’} in the second parameter
  • Abort request 需要 AbortController 的配合,xhr 默认提供方法。

To sum up:
Fetch is a trend, but there are still some functions that are not enough to replace XHR. If conditions permit, it is recommended to use fetch