通过 https 的 React-native 加载图像有效，而 http 无效

Question

我想通过 http uri 在 iOS 模拟器中加载图像作为源。但是屏幕上什么都没有显示，除了可以用检查器显示的线框。如果您在 Android 中加载相同的代码，它可以正常工作，如果您使用 https uri 而不是 http，它也可以正常工作。

示例代码：

render() { 
  return ( 
   <View> 
     <Image 
       source={{uri:https://facebook.github.io/react/img/logo_og.png'}} // works  
    // source={{uri: http://facebook.github.io/react/img/logo_og.png'}}  // doesn't work
       style={{width: 400, height: 400}}   
     />   
  </View>  
 );  
}

Answer 1

问题是您正在尝试从 http 连接而不是 apple 要求的 https 连接加载图像。试试你的代码是否与另一个使用 https 而不是 http 的 uri 一起工作。在 Android 中，它应该可以与 http 或 https 一起正常工作。在 https://github.com/facebook/react-native/issues/8520 and http://www.techrepublic.com/article/wwdc-2016-apple-to-require-https-encryption-on-all-ios-apps-by-2017/.

阅读更多内容

如果你真的想通过 http 加载一些东西，你可以编辑 info.plist 文件并在那里添加你的例外。此处有更多详细信息 https://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/

Answer 2

加入info.plist

<key>NSAppTransportSecurity</key>
 <dict>
 <!--Include to allow all connections (DANGER)-->
    <key>NSAllowsArbitraryLoads</key>
    <true/>
 </dict>

通过 https 的 React-native 加载图像有效，而 http 无效

React-native loading image over https works while http does not work

https

info.plist

ios

react-native

app-transport-security