Files
supabase/apps/docs/content/guides/storage/uploads/standard-uploads.mdx
608040b8cb chore(docs) Resolve 'simple' style warnings where applicable (#46966)
Contributes to DOCS-1052

## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Resolves MDX linting errors related to "simple" where it applies.
There was a couple cases that did not apply. For example, a product with
"Simple" in the name.

These changes are made in context, either by removing or using a more
descriptive synonym like "minimal" or "basic".

## Tophatting

1. Read each of the diffs.
2. See that the text still makes sense in context.

For extra due diligence, you can run `pnpm lint:mdx` locally and see the
'simple' errors that remain and whether they are worth addressing.


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

## Summary by CodeRabbit

* **Documentation**
* Updated many guide, tutorial, and troubleshooting pages with clearer
“basic”/“minimal” wording across setup steps, local testing
instructions, security cautions, and RLS guidance.
* Refined headings, example descriptions, and inline comments for
consistency (including deployment, MCP, metrics API, and search/function
phrasing).
* Improved readability with small snippet formatting tweaks (whitespace
plus import/comment ordering) and added a self-hosting debugging note
for Envoy admin endpoints via a short-lived `curl` container.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: Chris Chinchilla <chris.ward@supabase.io>
Co-authored-by: Nik Richers <nrichers@gmail.com>
2026-06-16 21:45:55 +00:00

312 lines
7.3 KiB
Plaintext

---
id: 'standard-uploads'
title: 'Standard Uploads'
description: 'Learn how to upload files to Supabase Storage.'
subtitle: 'Learn how to upload files to Supabase Storage.'
sidebar_label: 'Uploads'
---
## Uploading
The standard file upload method is ideal for small files that are not larger than 6MB.
You implement file uploads with the supabase-js SDK using the traditional `multipart/form-data` format. Here's an example of how to upload a file using the standard upload method:
<Admonition type="note">
Though you can upload up to 5GB files using the standard upload method, we recommend using [TUS Resumable Upload](/docs/guides/storage/uploads/resumable-uploads) for uploading files greater than 6MB in size for better reliability.
</Admonition>
<Tabs
scrollable
size="small"
type="underlined"
defaultActiveId="js"
queryGroup="language"
>
<TabPanel id="js" label="JavaScript">
```javascript
// @noImplicitAny: false
// ---cut---
import { createClient } from '@supabase/supabase-js'
// Create Supabase client
const supabase = createClient('your_project_url', 'your_supabase_api_key')
// Upload file using standard upload
async function uploadFile(file) {
const { data, error } = await supabase.storage.from('bucket_name').upload('file_path', file)
if (error) {
// Handle error
} else {
// Handle success
}
}
```
</TabPanel>
<$Show if="sdk:dart">
<TabPanel id="dart" label="Dart">
```dart
// Upload file using standard upload
Future<void> uploadFile(File file) async {
await supabase.storage.from('bucket_name').upload('file_path', file);
}
```
</TabPanel>
</$Show>
<$Show if="sdk:swift">
<TabPanel id="swift" label="Swift">
```swift
import Supabase
// Create Supabase client
let supabase = SupabaseClient(supabaseURL: URL(string: "your_project_url")!, supabaseKey: "your_supabase_api_key")
try await supabase.storage.from("bucket_name").upload(path: "file_path", file: file)
```
</TabPanel>
</$Show>
<$Show if="sdk:kotlin">
<TabPanel id="kotlin" label="Kotlin">
```kotlin
supabase.storage.from("bucket_name").upload("file_path", bytes)
//Or on JVM/Android: (This will stream the data from the file to supabase)
supabase.storage.from("bucket_name").upload("file_path", file)
```
</TabPanel>
</$Show>
<$Show if="sdk:python">
<TabPanel id="python" label="Python">
```python
response = supabase.storage.from_('bucket_name').upload('file_path', file)
```
</TabPanel>
</$Show>
<TabPanel id="curl" label="cURL">
```bash
curl -X POST "https://{your_project_ref}.supabase.co/storage/v1/object/{bucket_name}/{file_path}" \
-H "apikey: {your_anon_key}" \
-H "Authorization: Bearer {your_jwt_token}" \
--data-binary "@/local/path/to/your/file.ext"
```
</TabPanel>
</Tabs>
## 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.
<Tabs
scrollable
size="small"
type="underlined"
defaultActiveId="js"
queryGroup="language"
>
<TabPanel id="js" label="JavaScript">
```javascript
import { createClient } from '@supabase/supabase-js'
const file = new Blob()
// ---cut---
// Create Supabase client
const supabase = createClient('your_project_url', 'your_supabase_api_key')
await supabase.storage.from('bucket_name').upload('file_path', file, {
upsert: true,
})
```
</TabPanel>
<$Show if="sdk:dart">
<TabPanel id="dart" label="Dart">
```dart
await supabase.storage.from('bucket_name').upload(
'file_path',
file,
fileOptions: const FileOptions(upsert: true),
);
```
</TabPanel>
</$Show>
<$Show if="sdk:swift">
<TabPanel id="swift" label="Swift">
```swift
import Supabase
// Create Supabase client
let supabase = SupabaseClient(supabaseURL: URL(string: "your_project_url")!, supabaseKey: "your_supabase_api_key")
try await supabase.storage.from("bucket_name")
.upload(
path: "file_path",
file: file,
options: FileOptions(
upsert: true
)
)
```
</TabPanel>
</$Show>
<$Show if="sdk:kotlin">
<TabPanel id="kotlin" label="Kotlin">
```kotlin
supabase.storage.from("bucket_name").upload("file_path", bytes) {
upsert = true
}
```
</TabPanel>
</$Show>
<$Show if="sdk:python">
<TabPanel id="python" label="Python">
```python
response = supabase.storage.from_('bucket_name').upload('file_path', file, {
'upsert': 'true',
})
```
</TabPanel>
</$Show>
<TabPanel id="curl" label="cURL">
```bash
curl -X POST "https://{your_project_ref}.supabase.co/storage/v1/object/{bucket_name}/{file_path}" \
-H "apikey: {your_anon_key}" \
-H "Authorization: Bearer {your_jwt_token}" \
-H "x-upsert: true" \
--data-binary "@/local/path/to/your/file.ext"
```
</TabPanel>
</Tabs>
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, pass the `contentType` option during upload.
<Tabs
scrollable
size="small"
type="underlined"
defaultActiveId="js"
queryGroup="language"
>
<TabPanel id="js" label="JavaScript">
```javascript
import { createClient } from '@supabase/supabase-js'
const file = new Blob()
// ---cut---
// Create Supabase client
const supabase = createClient('your_project_url', 'your_supabase_api_key')
await supabase.storage.from('bucket_name').upload('file_path', file, {
contentType: 'image/jpeg',
})
```
</TabPanel>
<$Show if="sdk:dart">
<TabPanel id="dart" label="Dart">
```dart
await supabase.storage.from('bucket_name').upload(
'file_path',
file,
fileOptions: const FileOptions(contentType: 'image/jpeg'),
);
```
</TabPanel>
</$Show>
<$Show if="sdk:swift">
<TabPanel id="swift" label="Swift">
```swift
import Supabase
// Create Supabase client
let supabase = SupabaseClient(supabaseURL: URL(string: "your_project_url")!, supabaseKey: "your_supabase_api_key")
try await supabase.storage.from("bucket_name")
.upload(
path: "file_path",
file: file,
options: FileOptions(
contentType: "image/jpeg"
)
)
```
</TabPanel>
</$Show>
<$Show if="sdk:kotlin">
<TabPanel id="kotlin" label="Kotlin">
```kotlin
supabase.storage.from("bucket_name").upload("file_path", bytes) {
contentType = ContentType.Image.JPEG
}
```
</TabPanel>
</$Show>
<$Show if="sdk:python">
<TabPanel id="python" label="Python">
```python
response = supabase.storage.from_('bucket_name').upload('file_path', file, {
'content-type': 'image/jpeg',
})
```
</TabPanel>
</$Show>
<TabPanel id="curl" label="cURL">
```bash
curl -X POST "https://{your_project_ref}.supabase.co/storage/v1/object/{bucket_name}/{file_path}" \
-H "apikey: {your_anon_key}" \
-H "Authorization: Bearer {your_jwt_token}" \
-H "Content-Type: {Content-Type}" \
--data-binary "@/local/path/to/your/file.ext"
```
</TabPanel>
</Tabs>
## 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.