5个适用于Fetch API的最佳JavaScript Polyfills _FetchAPI

本文概述

5. Fetch Polyfill
4. Fetch ie8
3. Unfetch
2. Isomorphic Fetch
1. Github Fetch(whatwg)

【5个适用于Fetch API的最佳JavaScript Polyfills】众所周知, Fetch API比XMLHttpRequest更干净, 理论上更易于使用, 并且显然并非所有浏览器都提供该API。根据Google的说法：

主要区别在于Fetch API使用Promises, 从而实现了更简单, 更简洁的API, 避免了回调地狱, 并且必须记住XMLHttpRequest的复杂API。 [在fetch()简介中了解更多信息]

此API自Chrome 42起可用。该API的问题之一是, 它还使用了所有浏览器(承诺)都不支持的API, 因此除了Fetch polyfill之外, 你还需要使用polyfill以获得承诺(有关更多信息, 请参阅我们的5种最佳Promises Polyfills帖子)。如果你已经找到Promises API的polyfill, 那么你肯定会想知道哪种Fetch Polyfill是最好的。在本文中, 我们想与你分享5种API的Polyfills, 它们将在较旧的浏览器上为你提供对该API的支持。
5. Fetch PolyfillRubyLouvre的fetch polyfill支持所有主流浏览器, 甚至IE6, IE7和IE8：

fetch('/users.json').then(function(response) { return response.json() }).then(function(json) { console.log('parsed json', json) }).catch(function(ex) { console.log('parsing failed', ex) });

Polyfill还需要文档中包含的Promises API的另一个polyfill。
4. Fetch ie8此Polyfill是一个window.fetch支持IE8的JavaScript polyfill。此fork支持带有es5-shim, es5-sham和es6-promise的IE8。 Fetch API仍然很新, 并且在某些浏览器中不完全支持, 因此你可能需要检查浏览器版本以及是否存在window.fetch。在这种情况下, 可以设置window .__ disableNativeFetch = true以始终使用AJAX polyfill。提取功能支持任何HTTP方法：

fetch('/users.html').then(function(response) { return response.text() }).then(function(body) { document.body.innerHTML = body })

3. UnfetchUnfetch是一款具有500b可读取功能的” barely-polyfill” , 具有以下功能, 由developerit开发：

微小：不到500字节的ES3压缩文件
最小：仅带有标题和text / json响应的fetch()
熟悉：完整API的子集
支持：支持IE8 +(当然, 假设Promise已填充)
独立：一个功能, 没有依赖关系
现代：用ES2015写成, 可移植到500b的老式JS中

尽管Unfetch的目标之一是提供一个熟悉的界面, 但其API可能与其他fetch polyfills / ponyfills不同。关键区别之一是, Unfetch专注于实现fetch()API, 同时为Fetch规范的其他部分(如Headers类或Response类)提供最少(尚未功能)的支持。
2. Isomorphic Fetch同构提取是针对节点和Browserify的提取API的polyfill。构建在GitHub的WHATWG Fetch polyfill之上。

require('es6-promise').polyfill(); require('isomorphic-fetch'); fetch('//offline-news-api.herokuapp.com/stories').then(function(response) { if (response.status > = 400) { throw new Error("Bad response from server"); }return response.json(); }) .then(function(stories) { console.log(stories); });

1. Github Fetch(whatwg)每个人都知道Github, 但是并不是每个人都知道Github在Github中有一个存储库(头脑爆炸)。 Github上最著名的存储库之一就是Polyfill for Fetch。该项目实现了标准Fetch规范的子集, 足以使fetch替代传统Web应用程序中XMLHttpRequest的大多数用法。它支持以下浏览器：

铬
火狐浏览器
Safari 6.1+
Internet Explorer 10+

在现代浏览器(例如Chrome, Firefox, Microsoft Edge和Safari)中, 它们包含window.fetch的本机实现, 因此, 此polyfill中的代码对这些浏览器没有任何影响。如果你认为在这些浏览器中如何实现window.fetch时遇到错误, 则应向该浏览器供应商提出问题, 而不是向该项目提出。你还需要针对旧版浏览器的Promise polyfill。
编码愉快！