I am trying to display a simple image from an URL in the iOS Simulator. When the URL is a https domain it works fine but when I try loading from a http domain the image is not loaded. Via the inspector you can see that a blank image was created. My code is the following:
render() { return ( <View> <Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} // source={{uri: 'http://facebook.github.io/react/img/logo_og.png'}} style={{width: 400, height: 400}} onLoadStart={() => console.warn('loading started')} onLoad={() => console.warn('loading successful')} onLoadEnd={() => console.warn("loading endet (successful or not")} /> </View> ); }
I already tried:
- Restarting the packager and the iOS simulator (no change)
- Reset Contents and Settings of the iOS simulator (no change)
- Tried several other images via http and https
- Created new project from scratch via
react-native
init myurltestproject` and added code from above (still not working for http images)
I am using:
- react-native-cli: 1.0.0
- react-native: 0.28.0
- macOS 10.10.5 (Yosemite)
- MacBook Pro 13inch early 2015
Side note:
Interestingly when I try to run the exact same code on the simulator but via Deco IDE (Version 1.1.2 (0.7.0)) http and https url are working.
Any solution for loading the images over http?
@gitlovenotwar You can add a security exception in Info.plist file.
<key>NSAppTransportSecurity</key> <dict> <key>NSAllowsArbitraryLoads</key> <true/> </dict>
Reference: https://googleadsdeveloper.blogspot.in/2015/08/handling-app-transport-security-in-ios-9.html
Our is not working with https in Android. Can you please tell us how was your working on Android?