首页 > 解决方案 > React Native Expo 将 URL 图像转换为 Base64

问题描述

我正在开发一个从 api 加载图像的应用程序。该应用程序的要求是将这些图像离线存储在基于 sqllite 的应用程序数据库中。我认为唯一的方法是将图像转换为 base64 字符串并且我很容易显示图像。

我以前使用过 RN-Fetch-Blob 库,但 expo 不支持。所以我正在寻找一种方法来做到这一点,但我没有找到任何东西。

我试过这个库 react-native-image-base64

但它不起作用

ImgToBase64.getBase64String('http://i.imgur.com/XP2BE7q.jpg')
        .then(base64String => console.log(base64String))
        .catch(err => console.log(err));

有人告诉我如何在 Expo 中将图像转换为 base64 吗?

标签: reactjstypescriptreact-nativeecmascript-6expo

解决方案


虽然这不能回答您的问题,但您可能需要考虑将图像作为 BLOB 类型存储在您的 sqlite DB 中。您可以在这里查看一些示例:https ://medium.com/@ericmorgan1/upload-images-to-firebase-in-expo-c4a7d4c46d06

这个想法是,使用 Expo,我们可以使用 ImagePicker 获取 URI,然后使用fetch()API 检索 BLOB 数据。

一旦我们获得了 BLOB 数据,我们就可以将其存储到我们的 SQLite DB 中。


例子:

const imageUrl = 'http://i.imgur.com/XP2BE7q.jpg';
const response = await fetch(imageUrl);
// This will be the blob data that you will have to store inside your SQLite DB
const blob = await response.blob();

推荐阅读