提问人:davyioner 提问时间:11/14/2023 更新时间:11/14/2023 访问量:24
在 React-native expo 中将 blob 转换为图像
Converting a blob to an image in React-native expo
问:
我有一个 react-native expo 应用程序,正在尝试从我的存储桶中检索图像、解密它们并展示它们。我有加密的上传、检索和解密工作。现在我想展示这些图像。
我有存储在存储桶中的图像,这些图像是加密的。我的加密和解密如下所示:
export function encryptBlob(blob: Blob, masterKey: string): Promise<string> {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = function (event: any) {
const arrayBuffer = event.target?.result;
if (!arrayBuffer) {
reject("Failed to read binary data from blob.");
return;
}
const uint8Array = new Uint8Array(arrayBuffer);
let binaryData = "";
uint8Array.forEach((byte) => {
binaryData += String.fromCharCode(byte);
});
const strengthenedPassword = getStrengthenedPassword(masterKey);
const cipherText = CryptoJS.AES.encrypt(binaryData, strengthenedPassword, {
mode: CryptoJS.mode.CBC,
}).toString();
resolve(cipherText);
};
reader.onerror = function (error) {
reject("An error occurred while reading the blob: " + error);
};
reader.readAsArrayBuffer(blob);
});
}
export function decryptBlob(cipherText: string, contentType : string, masterKey: string): Promise<Blob> {
return new Promise((resolve, reject) => {
try {
const strengthenedPassword = getStrengthenedPassword(masterKey);
const decryptedBinary = CryptoJS.AES.decrypt(cipherText, strengthenedPassword).toString(CryptoJS.enc.Latin1);
const byteNumbers = Array.from(decryptedBinary, (char : any) => char.charCodeAt(0));
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], { type: contentType });
resolve(blob);
} catch (error) {
reject("An error occurred during decryption: " + error);
}
});
}
从存储桶中获取文件后,我运行如下函数:
const decryptedBlob = await decryptBlob(response.content, response.contentType, encryptionKey);
当我打印此文件时,它看起来像这样:
{"_data":{"blobId":"0a059363-64e4-4b59-9253-be52c5146cda","offset":0,"size":16993323,"type":"application/octet-stream; charset=UTF-8","__collector":{}}}
我可以使用 new Blob([decryptedBlob], { type: “image/jpeg” });然后文件如下所示:
{"_data":{"blobId":"00d18f7c-e3ab-43ff-87eb-471397ad0046","offset":0,"size":16993323,"type":"image/jpeg","__collector":{}}}
在此之后,我卡住了如何显示此图像。我可以直接调用它吗?我必须将其写入文件系统吗?希望有人对此有任何经验。
答: 暂无答案
评论