React-native Laden Bild über https funktioniert, während http nicht funktioniert

Question

Ich möchte ein Bild im iOS-Simulator über eine http uri als Quelle laden. Auf dem Bildschirm wird jedoch nichts angezeigt, es wird nur das Drahtgitter erwartet, das mit dem Inspector sichtbar gemacht werden kann. Wenn Sie den gleichen Code in Android laden, funktioniert es gut und wenn Sie ein https URI anstelle von http verwenden, funktioniert es auch gut.

Beispielcode:

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

Das Problem ist, dass Ihr versuchen, das Bild von einer HTTP-Verbindung und nicht von einer HTTPS-Verbindung zu laden, wie es von Apple gefordert wird. Versuchen Sie, wenn Ihr Code mit einem anderen URI funktioniert, das https anstelle von http verwendet. In Android sollte es entweder mit http oder https funktionieren. Lesen Sie mehr unter https://github.com/facebook/react-native/issues/8520 und http://www.techrepublic.com/article/wwdc-2016-apple-to-require-https-encryption-on-all-ios-apps-by-2017/.

Wenn Sie wirklich etwas über HTTP laden möchten, können Sie die Datei info.plist bearbeiten und dort Ihre Ausnahme hinzufügen. Ausführlichere Informationen hier https://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/

Answer 2

in

info.plist hinzufügen

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