Storage

Standard Uploads

Learn how to upload files to Supabase Storage.

Uploading

The standard file upload method is ideal for small files that are not larger than 6MB.

It uses the traditional multipart/form-data format and is simple to implement using the supabase-js SDK. Here's an example of how to upload a file using the standard upload method:


_14
import { createClient } from '@supabase/supabase-js'
_14
_14
// Create Supabase client
_14
const supabase = createClient('your_project_url', 'your_supabase_api_key')
_14
_14
// Upload file using standard upload
_14
async function uploadFile(file) {
_14
const { data, error } = await supabase.storage.from('bucket_name').upload('file_path', file)
_14
if (error) {
_14
// Handle error
_14
} else {
_14
// Handle success
_14
}
_14
}

Overwriting files

When uploading a file to a path that already exists, the default behavior is to return a 400 Asset Already Exists error. If you want to overwrite a file on a specific path you can set the upsert options to true or using the x-upsert header.


_10
// Create Supabase client
_10
const supabase = createClient('your_project_url', 'your_supabase_api_key')
_10
_10
await supabase.storage.from('bucket_name').upload('file_path', file, {
_10
upsert: true,
_10
})

We do advise against overwriting files when possible, as our Content Delivery Network will take sometime to propagate the changes to all the edge nodes leading to stale content. Uploading a file to a new path is the recommended way to avoid propagation delays and stale content.

Content type

By default, Storage will assume the content type of an asset from the file extension. If you want to specify the content type for your asset simply pass the contentType option during upload.


_10
// Create Supabase client
_10
const supabase = createClient('your_project_url', 'your_supabase_api_key')
_10
_10
await supabase.storage.from('bucket_name').upload('file_path', file, {
_10
contentType: 'image/jpeg',
_10
})

Concurrency

When two or more clients upload a file to the same path, the first client to complete the upload will succeed and the other clients will receive a 400 Asset Already Exists error. If you provide the x-upsert header the last client to complete the upload will succeed instead.