gpt4 book ai didi

javascript - react native 。需要 .env 变量的路径

转载 作者:行者123 更新时间:2023-12-02 23:06:38 24 4
gpt4 key购买 nike

我试图要求 .env 变量中的路径,但这不起作用,我不知道是否因为不可能需要动态路径,或者是否因为编译顺序的原因,无论哪种方式,解决方法我发现atm是使用base64编码的图像。

只是为了更好的上下文:我使用react-native-config只是为了指出RN应该查看哪个.env文件,因为目前react-native-config 在 RN 0.60+ 中无法正常工作,因此我将其与 react-native-build-config 一起使用以将这些变量公开给我的 .js (如果您可以在这里给我任何建议,我会很高兴)

例如

//.env
IMAGE_SOURCE='base64SourceHere'

.

//myComponent.js 
const imageSrc = BuildConfig.IMAGE_SOURCE

<Image style={{ width: 50, height: 50 }} source={ uri: imageSrc } resizeMode="contain"/>

我的问题是..base64 编码的图像是一种不好的做法吗?如果是,即使不是,有什么建议吗?我可以使用 uri 作为本地文件路径吗?

最佳答案

什么是 Base64?
Base64 是一种编码和解码技术,用于将二进制数据转换为美国信息交换标准 (ASCII) 文本格式,反之亦然。

Base64 是一种相对有效的二进制数据编码方式,它平均仍会增加文件大小 25% 以上。这不仅会增加您的带宽费用,还会增加下载时间。

CPU 开销
在以 Base64 传输图像时,浏览器首先需要解码 Base64 编码的字符串,然后再解码图像,这会引入额外的一层不必要的工作。

缓存问题
第三个问题可能是最大的性能 killer ,但乍一看可能不是最明显的。当用户访问您的网站时,浏览器会自动将图像缓存在本地,然后在再次访问同一页面时直接从您的磁盘加载它们。由于 Base64 的工作原理,浏览器无法在本地存储图像,因此它始终需要从您的服务器或 CDN 获取图像,这会给您的服务器带来额外的负载并增加您的带宽费用。

来源链接:doc
其他更多信息:doc

Base64 图像有用:
它仅对非常小的图像有用。 Base64 编码的文件比原始文件大。
Bas64 编码图像对于小尺寸 (KB) 图像来说是很好的做法。对于更大尺寸的图像,您可以使用 .缩略图。

如何在React Native中处理图像,查看这个link .

<小时/>

在react-native中读取本 map 片:

您可以使用react-native-fs获取适用于两个平台的目录

var RNFS = require('react-native-fs');

<Image source={{uri: 'file://' + RNFS.DocumentDirectoryPath + '/directory/example.png'}} />
<小时/>

在 React Native 应用程序中设置 .env

-->您可以使用react-native-config。它允许您指定 .env 文件以将变量导入代码中。要安装,请检查:doc

--> react-native-dotenv 是 React Native 中 .env 文件的另一种解决方案。安装时请检查:doc

关于javascript - react native 。需要 .env 变量的路径,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57559815/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com