500 errors when uploading to supabase bucket with blob data type with supabase-js

[migui3230]

Bug report

• I confirm this is a bug with Supabase, not with my own application.
• I confirm I have searched the Docs, GitHub Discussions, and Discord.

Describe the bug

supabase-js API for uploading to a bucket returns this error when trying to pass in a blob data type with the filename parameter
ERROR Error uploading image to bucket: {"error": "Internal", "message": "Internal Server Error", "statusCode": "500"}

it uploads perfectly when I started passing in an arrayBuffer data type instead

To Reproduce

this code uses expo image picker

const addPictureToTableAndBucket = async () => {
    const { data: session } = await supabase.auth.getSession();
    const user = session?.session?.user;
    const userId = user?.id;

    const fileExt = profileImage?.split(".").pop();
    const blob = await (await fetch(profileImage as string)).blob();

    const { data, error } = await supabase.storage
      .from("profile_pics")
      .upload(`${userId}.${fileExt}`, blob, {
        upsert: true,
      });

  };

  const pickImage = async () => {
    const result = await ImagePicker.launchImageLibraryAsync({
      mediaTypes: ImagePicker.MediaTypeOptions.Images,
      allowsEditing: true,
      aspect: [4, 3],
      quality: 1,
    });

    console.log(result);

    if (!result.canceled) {
      setProfileImage(result.assets[0].uri);
      await addPictureToTableAndBucket();
    }
  };

policies for the bucket are public and public for the insert, update, read, delete operations

Expected behavior

uploads happen perfectly for the bucket without any errors

Screenshots

If applicable, add screenshots to help explain your problem.

System information

• OS: macOS Ventura 13.2
• Version of supabase-js: 2.8.0
• Version of Node.js: 19.5.0

Additional context

Add any other context about the problem here.

[Whitelistedd]

I am also having this issue

[NicolasReibnitz]

Seems to be a problem with a missing column in the storage.objects table:

originalError: error: insert into "objects" ("bucket_id", "metadata", "name", "owner", "version") values ($1, DEFAULT, $2, DEFAULT, $3) - column "version" of relation "objects" does not exist

Full error log here:
error.log

Adding the column (which seems to be only missing in the local version of my project) fixes the issue. I used the following SQL:

alter table "storage"."objects" add column "version" text;

[NicolasReibnitz]

My apologies. Looking at the initial message again makes me think that this is probably totally unrelated. 😄

[emirrtopaloglu]

I was getting the same error, and later I decided to try Base64 instead of Blob. This solved my problem, and it might solve yours too.

Imports:

import { supabase } from "../../../libs/supabase";
import * as ImagePicker from "expo-image-picker";
import * as FileSystem from "expo-file-system";
import { decode } from "base64-arraybuffer";

Pick Image:

const pickImage = async () => {
  const options: ImagePicker.ImagePickerOptions = {
    mediaTypes: ImagePicker.MediaTypeOptions.Images,
    allowsEditing: true,
  };

  const result = await ImagePicker.launchImageLibraryAsync(options);

  if (!result.canceled) {
    const img = result.assets[0];
    const base64 = await FileSystem.readAsStringAsync(img.uri, {
      encoding: "base64",
    });
    const filePath = `${id}/avatar_${new Date().getTime()}.jpg`;
    const contentType = "image/jpeg";

    const { error } = await supabase.storage
      .from("avatars")
      .upload(filePath, decode(base64), { contentType, upsert: true });

    if (error) throw error;

    updatePhoto(filePath);
  }
};

Update Photo:

const updatePhoto = async (filePath: string) => {
  const {
    data: { publicUrl },
  } = supabase.storage.from("avatars").getPublicUrl(filePath);

  setImage(publicUrl);

  const { error } = await supabase.auth.updateUser({
    data: { avatar_url: publicUrl },
  });
  
  if (error) throw error;
};

[otopba]

I have same error:

"error": [ { "message": "Internal Server Error", "name": "Error", "raw": "{\"statusCode\":500,\"error\":\"internal\",\"originalError\":{\"length\":106,\"name\":\"error\",\"severity\":\"ERROR\",\"code\":\"42P01\",\"position\":\"13\",\"file\":\"parse_relation.c\",\"line\":\"1392\",\"routine\":\"parserOpenTable\"}}", "stack": "Error: Internal Server Error\n at DBError.fromDBError (/app/dist/storage/database/knex.js:443:16)\n at Function.<anonymous> (/app/dist/storage/database/knex.js:25:39)\n at Object.onceWrapper (node:events:632:26)\n at Function.emit (node:events:517:28)\n at Function.emit (node:domain:489:12)\n at Client_PG.<anonymous> (/app/node_modules/knex/lib/knex-builder/make-knex.js:299:10)\n at Client_PG.emit (node:events:529:35)\n at Client_PG.emit (node:domain:489:12)\n at /app/node_modules/knex/lib/execution/internal/query-executioner.js:46:12\n at process.processTicksAndRejections (node:internal/process/task_queues:95:5)" } ],

[mibacode]

In my case, my insert and update storage policies were breaking from a change I had made to one of the fields the policies relied on.

[waylon999]

I have same error:

"error": [ { "message": "Internal Server Error", "name": "Error", "raw": "{\"statusCode\":500,\"error\":\"internal\",\"originalError\":{\"length\":106,\"name\":\"error\",\"severity\":\"ERROR\",\"code\":\"42P01\",\"position\":\"13\",\"file\":\"parse_relation.c\",\"line\":\"1392\",\"routine\":\"parserOpenTable\"}}", "stack": "Error: Internal Server Error\n at DBError.fromDBError (/app/dist/storage/database/knex.js:443:16)\n at Function.<anonymous> (/app/dist/storage/database/knex.js:25:39)\n at Object.onceWrapper (node:events:632:26)\n at Function.emit (node:events:517:28)\n at Function.emit (node:domain:489:12)\n at Client_PG.<anonymous> (/app/node_modules/knex/lib/knex-builder/make-knex.js:299:10)\n at Client_PG.emit (node:events:529:35)\n at Client_PG.emit (node:domain:489:12)\n at /app/node_modules/knex/lib/execution/internal/query-executioner.js:46:12\n at process.processTicksAndRejections (node:internal/process/task_queues:95:5)" } ],

@otopba Were you able to get this working? I am facing the same exact error, which is not too helpful in being able to solve the issue.

[trqy]

Hi , any update about this error

[Ashutoshkr-12]

POST https://qgbqyrnvwqubbutwjzcf.supabase.co/storage/v1/object/avatar/avatar_6fa28d83-8869-459e-a722-9a7accb624e3_1743658681299_ss_1.png 400 (Bad Request)

ProfileImage.tsx:114 Error uploading avatar:
{statusCode: '403', error: 'Unauthorized', message: 'new row violates row-level security policy'}

i have checked all the RLS policy everything is correct i also try to create a new bucket from client still not working on images. On the other side i try to upload user data in table it was perfectly done.

[krolow]

@Ashutoshkr-12 have u figure it out? I'm facing same issue quite weird 🤔