Javascript React-Native fetch，网络请求失败。不使用本地主机
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38077273/
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-Native fetch, Network request failed. not using localhost
提问by Ata Mohammadi
I have an app, which im using fetch to authenticate user. it was working till few days ago and i haven't change anything. just upgraded from react 0.27 to 0.28, not fetch is not working.
我有一个应用程序，我使用 fetch 来验证用户。它一直工作到几天前，我没有改变任何东西。刚刚从 react 0.27 升级到 0.28，不是 fetch 不起作用。
i have searched for almost 2 days and i have read almost all questions in stackoverflow. most of users trying to fetch something from localhost, and when they change it to actual ip address , they get it to work. but im not fetching anything from localhost, also mine code used to be working.
我已经搜索了将近 2 天，并且已经阅读了 stackoverflow 中的几乎所有问题。大多数用户试图从本地主机获取一些东西，当他们将它更改为实际的 ip 地址时，他们就可以正常工作了。但我没有从本地主机获取任何东西，我的代码也曾经在工作。
here is my code :
这是我的代码：
fetch('http://somesite.com/app/connect', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'language':'en-US',
'Authorization': 'Bearer ' + access_token,
},
body: JSON.stringify({
uid: uid,
refresh_token: refresh_token,
token: access_token,
device: device_id,
device_name: device_name,
})
})
.then((response) => response.json())
.then((responseData) => {
console.log(JSON.stringify(responseData.body))
})
.catch((err)=> {
console.log('Some errors occured');
console.log(err);
})
.done();i tried to make some new projects, simple, just used a simple fetch example fro tutorials, it gave same error. i tried to open my website which im trying to connect to it, through browser in emulator, it works, but it seems through my, app cannot connect to any website/ip. it gives this error in chrome console :
我试图制作一些新项目，简单，只是使用了一个简单的教程获取示例，它给出了同样的错误。我试图打开我试图连接到它的网站，通过模拟器中的浏览器，它可以工作，但似乎通过我的应用程序无法连接到任何网站/ip。它在 chrome 控制台中给出了这个错误：
TypeError: Network request failed
at XMLHttpRequest.xhr.onerror (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:28193:8)
at XMLHttpRequest.dispatchEvent (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:14591:15)
at XMLHttpRequest.setReadyState (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:29573:6)
at XMLHttpRequest.__didCompleteResponse (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:29431:6)
at http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:29506:52
at RCTDeviceEventEmitter.emit (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:13428:23)
at MessageQueue.__callFunction (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:11999:23)
at http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:11906:8
at guard (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:11857:1)
at MessageQueue.callFunctionReturnFlushedQueue (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&hot=true:11905:1)
actually i have the same problem as this user here : React-native network request always fails
实际上我和这个用户有同样的问题：React-native 网络请求总是失败
UPDATE : info.plist from xcode
any help will be appreciated!
任何帮助将不胜感激！
回答by Ahmed Haque
You should check out this link: https://github.com/facebook/react-native/issues/8118
您应该查看此链接：https: //github.com/facebook/react-native/issues/8118
Looks like the issue emerged in React Native 0.28. Solution is to "Allow Arbitrary Loads" in the info.plist file found in the ios>build folder that React creates.
看起来这个问题出现在 React Native 0.28 中。解决方案是在 React 创建的 ios>build 文件夹中的 info.plist 文件中“允许任意加载”。
If you open the entire ios folder in xcode, then open this info.plist file you can create a new key to Allow Arbitrary Loads and it should fix your issue.
如果您在 xcode 中打开整个 ios 文件夹，然后打开此 info.plist 文件，您可以创建一个新密钥以允许任意加载，它应该可以解决您的问题。
回答by GustavoSevero
Set the info.plist doesn't work for me too. Trying to run on iOS.
设置 info.plist 对我也不起作用。尝试在 iOS 上运行。
回答by Allan Jiang
This issue is the code is trying to fetch HTTP endpoint instead of HTTPS, which is not encouraged. If you are fetching from localhost server, an easy solution will be exposing your localhost server through a Ngrokhttps endpoint.
这个问题是代码试图获取 HTTP 端点而不是 HTTPS，这是不鼓励的。如果您从 localhost 服务器获取数据，一个简单的解决方案是通过Ngrokhttps 端点公开您的 localhost 服务器。
Steps:
脚步：
Download ngrok and run
ngrok http 8081from terminal/cmd, where you should change 8081 to your localhost service port.Ngrok will give you a https forwarding endpoint, simply use that to access your localhost server.
下载 ngrok 并
ngrok http 8081从终端/cmd运行，您应该将 8081 更改为您的本地主机服务端口。Ngrok 会给你一个 https 转发端点，只需使用它来访问你的本地主机服务器。
