React Native 中的 URI 与 URL答案

【问题标题】：URI vs URL in React NativeReact Native 中的 URI 与 URL
【发布时间】：2018-10-19 08:01:48
【问题描述】：

在 react-native 中可以这样做：

const somePath = 'https://...'
<Image source={somePath} />

或

const somePath = 'https://...'
<Image source={{uri: somePath}} />

据我对网址的了解，URI 是 URL 和 URN 的超集。

问题

将网址作为 URL 提供给 source 有哪些潜在问题？
将网址作为 URI 提供给 source 有哪些潜在问题？
向source 提供图像地址的哪种方法更准确、更安全且经得起未来考验？

【问题讨论】：

标签： url react-native uri webaddress

【解决方案1】：

您提供的第一个代码示例不起作用

const somePath = 'https://...'
<Image source={somePath} />

一般来说，您应该使用 source 属性来提供像这样的本地图像

const someLocalImage = require("./assets/someImageName.png");
<Image source={someLocalImage} />

以及像这样显示远程图像的 uri

<Image source={{uri: "https://example.com/someRemoteImagePath.png" />

也可以使用uri显示base64图片数据

<Image
      source={{uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAzCAYAAAA6oTAqAAAAEXRFWHRTb2Z0d2FyZQBwbmdjcnVzaEB1SfMAAABQSURBVGje7dSxCQBACARB+2/ab8BEeQNhFi6WSYzYLYudDQYGBgYGBgYGBgYGBgYGBgZmcvDqYGBgmhivGQYGBgYGBgYGBgYGBgYGBgbmQw+P/eMrC5UTVAAAAABJRU5ErkJggg=='}}
    />

【讨论】：