无法在React Native iOS模拟器中按URI显示图像 [英] Can't show Image by URI in React Native iOS Simulator

问题描述

我正在使用react-native 0.28.0

I'm using react-native 0.28.0

我正在尝试根据本教程在iPhone模拟器上显示图像： http://www.appcoda.com/react-native-introduction/

I'm trying to show an image on iPhone simulator according to this tutorial: http://www.appcoda.com/react-native-introduction/

var styles = StyleSheet.create({
image: {
    width: 107,
    height: 165,
    padding: 10
  }
}

var imageURI = 'http://books.google.com/books/content?id=PCDengEACAAJ&printsec=frontcover&img=1&zoom=1&source=gbs_api'

然后在渲染中（ ）函数，我添加：

<Image style={styles.image} source={{uri:imageURI}} />

分配给图片的空间在那里，但是图片未显示。

The space allocated for the image is there, but the image is not shown.

但是，如果我使用的是本地图片，则会显示图片。

However, if I use local image instead, the image will be shown.

var Picture = require('./content.jpeg')

在 render（）功能：

<Image source={Picture} style={styles.thumbnail} />

如何使用URI作为源显示图片？

How can I show picture using URI as source?

推荐答案

问题是您正在尝试从http连接而不是https连接加载图像，因为它需要by apple。

尝试使用另一个使用https而不是http的uri。
在Android中它应该可以正常使用http或https。

阅读更多
https://github.com/facebook/react-native/issues/8520 和 http://www.techrepublic.com/article/wwdc-2016-apple-to -require-HTTPS的加密上所有IOS-应用程序，通过-2017 / 。

The problem is that your are trying to load the image from a http connection and not from a https connection as it is demanded by apple.
Try if your code works with another uri which uses https instead of http. In Android it should work fine with either http or https.
Read more at 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/

If you really want to load something over http you can edit the info.plist file and add your exception there. More detailed info here https://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/

参见还有我的stackoverflow问题：通过https进行React-native加载图像，而http不起作用

See also my stackoverflow question here: React-native loading image over https works while http does not work

这篇关于无法在React Native iOS模拟器中按URI显示图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！