Javascript React Fetch 在 IE11 中不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37258632/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
React Fetch not working in IE11
提问by Andy5
I have a ReactJS application that works as expected in Chrome, but fails in IE-11.
我有一个 ReactJS 应用程序，它在 Chrome 中按预期工作，但在 IE-11 中失败。
The problem is this - we have two drop down lists which are populated from rest services when the page is first loaded. The application is running under SSL. When the page is loaded through IE-11, I get an IE-11 bug issue where the first request call gets cancelled out by the second-the bug is described here:
问题是这样的 - 我们有两个下拉列表，当页面第一次加载时，它们从休息服务中填充。应用程序在 SSL 下运行。当页面通过 IE-11 加载时，我遇到了一个 IE-11 错误问题，其中第一个请求调用被第二个请求取消 - 此处描述了错误：
https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/1282036/
https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/1282036/
So, I am just asking the community whether there is a work around for IE-11 or is there away to implement my code sequentially where if the first is complete the second is called:
所以，我只是问社区是否有解决 IE-11 的方法，或者是否可以按顺序实现我的代码，如果第一个完成，则调用第二个：
export let getMainData = (dtType, url)=> {
return dispatch=>{
dispatch(sendGet(dtType));
const action = (async(url) => {
const response = await fetch(url);
let data = await response.json();
dispatch(receiveGet(dtType,data));
});
action(url);
};
};
The code above is common code and is used by others in the React App. So what I am thinking if there is away to have a level of abstraction where the two drop down lists can call sequentially and then call the above underneath, perhaps?
上面的代码是通用代码，在React App中被其他人使用。那么我在想如果有一个抽象级别，两个下拉列表可以顺序调用，然后在下面调用上面的，也许？
回答by Fez Vrasta
Just include isomorphic-fetchas polyfill to make it work on unsupported browsers.
只需包含isomorphic-fetch作为 polyfill 即可使其在不受支持的浏览器上工作。
回答by c-chavez
As pointed out, fetch is not supported by IE11, I also had this problem in my React app. You can, alternatively, use Axios.
正如所指出的，IE11 不支持 fetch，我的 React 应用程序中也有这个问题。或者，您可以使用Axios。
If you are migrating (or can migrate), check My answerto this post
Basically, check this code:
基本上，检查这个代码：
Fetch JSON post request
获取 JSON 发布请求
let url = 'https://someurl.com';
let options = {
method: 'POST',
mode: 'cors',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json;charset=UTF-8'
},
body: JSON.stringify({
property_one: value_one,
property_two: value_two
})
};
let response = await fetch(url, options);
let responseOK = response && response.ok;
if (responseOK) {
let data = await response.json();
// do something with data
}
Axios JSON post request
Axios JSON 发布请求
let url = 'https://someurl.com';
let options = {
method: 'POST',
url: url,
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json;charset=UTF-8'
},
data: {
property_one: value_one,
property_two: value_two
}
};
let response = await axios(options);
let responseOK = response && response.status === 200 && response.statusText === 'OK';
if (responseOK) {
let data = await response.data;
// do something with data
}
I always have main request function that the app uses, so it doesn't matter if you use fetch or axios. For example in 'your-common.js':
我总是有应用程序使用的主要请求函数，所以你使用 fetch 还是 axios 都没有关系。例如在“your-common.js”中：
async function request(url, method, objectData){
// use axios or fetch or isomorphic-fetch
}
So if your complete app is using your request function, you simply change the library in that function and no harm is done as long as you return the same object or value. You can also wrap the fetch (or axios or whatever http library you use) in a try/catch block to handle promises if using async/await.
因此，如果您的完整应用程序正在使用您的请求函数，您只需更改该函数中的库，只要您返回相同的对象或值，就不会造成任何伤害。如果使用 async/await，您还可以将 fetch（或 axios 或您使用的任何 http 库）包装在 try/catch 块中以处理承诺。
回答by OutstandingBill
Unrelated to ReactJS, but I hope useful to others who land here as I did.
与 ReactJS 无关，但我希望对像我一样登陆这里的其他人有用。
I found the Github fetch polyfilland TaylorHakes' Promise polyfillnice and easy to get started with in the context of my ASP.NET MVC web application. Both were recommended by https://ourcodeworld.com
我发现Github fetch polyfill和TaylorHakes 的 Promise polyfill在我的 ASP.NET MVC Web 应用程序的上下文中很好且易于上手。两者均由https://ourcodeworld.com推荐
回答by Felipe Skinner
回答by Leandro Budau
IE dont offer suport for the fetch use. You need use some polyfill for solve this problem. You can use http://github.github.io/fetch/.
IE 不提供对 fetch 使用的支持。你需要使用一些 polyfill 来解决这个问题。您可以使用http://github.github.io/fetch/。
