React-natywny obraz ładujący na https działa, gdy http nie działa

Question

Chcę załadować obraz w symulatorze iOS na podstawie http uri jako źródła. Ale nic nie jest wyświetlane na ekranie, oczekując szkieletu, który może być widoczny dla inspektora. Jeśli załadujesz ten sam kod w Androidzie, działa dobrze i jeśli użyjesz https uri zamiast http, to również działa dobrze.

Przykładowy kod:

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

Problemem jest to, że starają się załadować obraz z połączenia HTTP i nie z połączenia https jak to jest wymagane przez apple. Sprawdź, czy Twój kod działa z innym urządzeniem uri, które używa protokołu HTTPS zamiast http. W systemie Android powinien działać poprawnie z protokołem http lub https. Przeczytaj więcej na https://github.com/facebook/react-native/issues/8520 i http://www.techrepublic.com/article/wwdc-2016-apple-to-require-https-encryption-on-all-ios-apps-by-2017/.

Jeśli naprawdę chcesz załadować coś na http, możesz edytować plik info.plist i dodać tam swój wyjątek. Więcej szczegółowych informacji o https://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/

Answer 2

dodać Info.plist

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