无法在 React Native 中获取或向 http URL 发出 XHR 请求（但 https 和 http://localhost 工作正常）

Question

我尝试在 React Native 中向远程服务器发出请求，但总是得到TypeError: Network request failed；我尝试了不同的URL，发现如果我向http://rap2api.taobao.org/app/mock/3008/GET/api/creations这样的http URL发出请求，它总是失败； 如果我向 https://facebook.github.io/react-native/movies.json 之类的 https URL 发出请求，它会起作用； 如果我向http://localhost:3002/list 之类的 http localhost URL 发出请求，它也可以工作。

componentDidMount() {
  console.log("_fetchData");
  this._fetchData()
}
_fetchData = () => {
      fetch('http://rap2api.taobao.org/app/mock/3008/GET/api/creations')
        .then((response) => response.json())
        .then((responseJson) => {
          console.log('responseJson',responseJson)
        })
        .catch((error) => {
          console.error(error);
        });
    
}

我在网上查了很多参考资料，猜想这与 Info.plist doc 中的设置有关。我试着做一些修改，比如：

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSExceptionDomains</key>
  <dict>
    <key>localhost</key>
    <dict>
      <key>NSExceptionAllowsInsecureHTTPLoads</key>
      <true/>
    </dict>
    <key>rap2api.taobao.org</key>
    <dict>
      <key>NSExceptionAllowsInsecureHTTPLoads</key>
      <true/>
      <key>NSIncludesSubdomains</key>
      <true/>
    </dict>
  </dict>
</dict>

或

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

但是，它们都不起作用，我在请求 http URL 时仍然遇到同样的错误。我确信 API 很好，因为我在 Web 应用程序上尝试过它并成功获得响应。有什么问题？

Answer 1

来自https://facebook.github.io/react-native/docs/network.html：

默认情况下，iOS 会阻止任何未使用 SSL 加密的请求。如果您需要从明文 URL（以 http 开头的 URL）获取，您首先需要添加应用程序传输安全异常。如果您提前知道需要访问哪些域，则仅为这些域添加例外会更安全；如果直到运行时域才知道，您可以完全禁用 ATS。但请注意，从 2017 年 1 月起，Apple 的 App Store 审核将需要合理的理由来禁用 ATS。有关详细信息，请参阅 Apple 的文档。

来自https://developer.apple.com/library/content/documentation/General/Reference/InfoPlistKeyReference/Articles/CocoaKeys.html#//apple_ref/doc/uid/TP40009251-SW33

从 iOS 10.0 及更高版本以及 macOS 10.12 及更高版本开始，支持以下子项：
NSAllowsArbitraryLoadsForMedia
NSAllowsArbitraryLoadsInWebContent
NSRequiresCertificateTransparency
NSAllowsLocalNetworking
注意：有两个“允许任意加载”键，它们采用不同的命名模式。注意正确使用…ForMedia 和…InWebContent。

您可以尝试明确设置 NSAllowsArbitraryLoadsForMedia 和 NSAllowsArbitraryLoadsInWebContent。

还要确保在 Xcode 中清理和重建您的项目，以便更新后的 plist 设置包含在您的包中。