Uplood image from Retool to Supabase bucket

App Building
,
1

  • Goal:

  • Browse image from file input control and upload to Supabase bucket

  • Steps:
    Javascript code

  • Details:
    Code JS :
    const supabaseUrl = ''; //Removed from here.
    const supabaseKey = ''; /Removed from here.
    const supabase1 = supabase.createClient(supabaseUrl, supabaseKey);

await supabase1.storage.from('events').upload('images/car.png', fileInput1.value)

2

Getting message : message:"Failed to read the 'localStorage' property from 'Window': The document is sandboxed and lacks the 'allow-same-origin' flag."

3

Hello @GwlAbhishek!

I believe the error message is coming from the storage.from('events') as Retool code is executed in a sandbox and it sounds like under the hood that method is trying to grab either the image upload event or the state of file input component via the 'Window' property which isn't accessible.

For uploading images to Supabase, I believe the best option is to set up a REST API Resource.

From there you can send image file's data from the vile upload component to a Query to the REST Resource on a trigger event such as a button click.

I just checked the Supabase docs page here and it seems you can interact via REST API with your database storage :smile: