javascript - HTTPS 图像未在 react native 图像中呈现

Question

我正在尝试渲染图像“https://www.edamam.com/web-img/22c/22c27bdc6b8dc67215c7478cb4e5dc42.jpg”，它在网络浏览器中工作正常，但在 react native 图像中该图像不会出现。

我正在尝试做:

 <Image
style={{ height: 200, width: 200 }}
source={{
    uri:
        "https://www.edamam.com/web-img/22c/22c27bdc6b8dc67215c7478cb4e5dc42.jpg"
}}
/>;

这也行不通:

 <Image
style={{ flex: 1, resizeMode: "cover" }}
source={{
    uri:
        "https://www.edamam.com/web-img/22c/22c27bdc6b8dc67215c7478cb4e5dc42.jpg"
}}
/>;

我在这里做错了什么？

Answer 1

我试过你的代码，一开始我没有得到图像，然后我使用 onError 处理程序处理错误并发现以下错误

An SSL error has occurred and a secure connection to the server cannot be made

您可以查看此错误的 stackoverflow 答案 here

我通过更改尝试了第一个解决方案

info.plist

使用以下配置并且它有效

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key>
  <true/>
</dict>

查看 this document，上述方法不推荐，相反他们建议了其他方法(在链接的 stackoverflow 答案中也提到了)。

希望这会有所帮助。