使用存储 API 将图像上传到 Supabase 存储

问题描述

Supabase 很棒！！我正在尝试使用对 <SUPABASE_URL>/storage/v1/object/<BUCKET_NAME>/<IMAGE_NAME> 的 POST 请求将图像上传到公共存储桶。

困难的是我只有 base64 编码的图像字符串，我无法向上述端点发出成功请求。已经尝试了多次设置 Content-type 的迭代，但没有成功。

我正在尝试从 Appsmith 上传我的图像，该图像为图像提供了 base64 格式，我必须从此处点击上述端点。

请帮帮我。

解决方法

我很高兴能找到另一个像我一样的 Supabase 粉丝！

我听到了你的痛苦。您可以尝试使用 this 技术将 base 64 字符串转换为 blob 对象吗？

const byteCharacters = atob(b64Data);

const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
    byteNumbers[i] = byteCharacters.charCodeAt(i);
}

const byteArray = new Uint8Array(byteNumbers);

const blob = new Blob([byteArray],{type: contentType});        

最后的 blob 变量是您可以用来上传到 Supabase 的变量。

另外，您是否考虑过使用 Supabase-js SDK？这将使您的生活更轻松，因为它们提供了更好的 API 来与 Supabase 交互。

你可以在这里获取 supabase-js 包： https://www.npmjs.com/package/@supabase/supabase-js

您可以在这里找到一些示例代码： https://supabase.io/docs/reference/javascript/storage-from-upload

就您而言，您可以执行以下操作来上传文件：

const { data,error } = await supabase
  .storage
  .from('avatars')
  .upload('public/sample.png',blob,{
    cacheControl: 3600,upsert: false
  })