javascript - React Native 获取 https localhost 网络请求失败

Question

我正在尝试从 ASP.NET 服务器获取本地托管的 API：

  try {
    const response = await fetch(`https://localhost:2318/api/Restaurant`)
    const data = await response.json()
    console.log(data)
  } catch (error) {
    console.error(error)
  }

但是，它会引发错误：

Network request failed
at node_modules/whatwg-fetch/dist/fetch.umd.js:535:17 in setTimeout$argument_0

我的端点都不起作用。从公共 API 获取有效。同样奇怪的是，在模拟器内的 Safari 中打开获取 url https://localhost:2318/api/Restaurant 可以正常工作并按预期返回数据。

我正在使用 Expo v42.0.1、RN v0.66。

有任何想法吗？

标签： javascriptreactjsreact-nativefetchexpo

Answer 1

您正在向将具有自签名证书的 localhost 服务器发出请求。因此，iOS 或 Android 都不允许直接从该 API 获取。

最简单的解决方案是使用react-native-fetch-blob。（只需将 trusty 作为 true 传递）。

RNFetchBlob.config({
  trusty : true
})
.then('GET', 'https://example.com')
.then((resp) => {
  // ...
})

如果您仍想使用fetch并尝试以下解决方案。

1. 如果您使用 iOS 设备进行测试：您可以做两件事：

• 您可以使用以下实现进行 HTTP 调用（在您的 url 中将 https 更改为 http）。

如果要启用 HTTP 请求，请将其添加到 info.plist：

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>

• 您可以使用以下实现来使用 HTTPS（自签名）调用。

  来自带有自签名证书的 https 服务器的 React-native fetch()

2. 如果您使用 Android 设备进行测试：

   尝试以下解决方案： https ://stackoverflow.com/a/55246927/8893384