mirror of
https://github.com/supabase/supabase.git
synced 2026-07-04 13:34:28 +08:00
166 lines
5.0 KiB
Plaintext
166 lines
5.0 KiB
Plaintext
---
|
|
title: 'Storage'
|
|
description: 'Supabase Storage'
|
|
---
|
|
|
|
# Storage
|
|
|
|
## Overview
|
|
|
|
Supabase Storage makes it simple to store and serve large files.
|
|
|
|
### Files
|
|
|
|
Files can be any sort of media file. This includes images, GIFs, and videos. It is best practice to store files outside of your database because of their sizes.
|
|
|
|
### Folders
|
|
|
|
Folders are a way to organize your files (just like on your computer). There is no right or wrong way to organize your files. You can store them in whichever folder structure suits your project.
|
|
|
|
### Buckets
|
|
|
|
Buckets are distinct containers for files and folders. You can think of them like "super folders". Generally you would create distinct buckets for different Security and Access Rules. For example, you might keep all public files in a "public" bucket, and other files that require logged-in access in a "restricted" bucket.
|
|
|
|
## Getting started
|
|
|
|
This is a quick guide that shows the basic functionality of Supabase Storage. Find a full [example application in GitHub](https://github.com/supabase/supabase/edit/master/examples/nextjs-ts-user-management), which you can deploy yourself.
|
|
|
|
<a href="https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fsupabase%2Fsupabase%2Ftree%2Fmaster%2Fexamples%2Fnextjs-ts-user-management&project-name=supabase-user-management&repository-name=supabase-user-management&demo-title=Supabase%20User%20Management&demo-description=An%20example%20web%20app%20using%20Supabase%20and%20Next.js&demo-url=https%3A%2F%2Fsupabase-nextjs-ts-user-management.vercel.app&demo-image=https%3A%2F%2Fi.imgur.com%2FZ3HkQqe.png&integration-ids=oac_jUduyjQgOyzev1fjrW83NYOv&external-id=nextjs-user-management">
|
|
<img src="https://vercel.com/button" alt="Deploy with Vercel" />
|
|
</a>
|
|
|
|
### Create a bucket
|
|
|
|
You can create a bucket using the Supabase Dashboard. Since the storage is interoperable with your Postgres database, you can also use SQL or our client libraries. Here we create a bucket called "avatars":
|
|
|
|
<!---
|
|
TODO: Get tabs to render - @supabase/ui Tabs component fails to render)
|
|
--->
|
|
|
|
[Reference](https://pub.dev/documentation/storage_client/latest/storage_client/SupabaseStorageClient/createBucket.html)
|
|
|
|
### Upload a file
|
|
|
|
You can upload a file from the Dashboard, or within a browser using our JS libraries.
|
|
|
|
<video width="99%" playsinline controls>
|
|
<source src="/videos/storage/upload.mp4" type="video/mp4" playsInline />
|
|
</video>
|
|
|
|
### Download a file
|
|
|
|
You can download a file from the Dashboard, or within a browser using our JS libraries.
|
|
|
|
<video width="99%" playsinline controls>
|
|
<source src="/videos/storage/download.mp4" type="video/mp4" playsInline />
|
|
</video>
|
|
|
|
### Add security rules
|
|
|
|
To restrict access to your files you can use either the Dashboard or SQL.
|
|
|
|
<video width="99%" playsinline controls>
|
|
<source src="/videos/storage/policies.mp4" type="video/mp4" playsInline />
|
|
</video>
|
|
|
|
### Helpers
|
|
|
|
Supabase Storage is configured with database SQL helper functions which you can use in your database queries and policies.
|
|
|
|
<hr />
|
|
|
|
`storage.filename()`
|
|
|
|
Returns the name of a file.
|
|
|
|
```sql
|
|
select storage.filename(name)
|
|
from storage.objects;
|
|
```
|
|
|
|
For example, if your file is stored in `public/subfolder/avatar.png` it would return:
|
|
|
|
`'avatar.png'`
|
|
|
|
<hr />
|
|
|
|
`storage.foldername()`
|
|
|
|
Returns an array path, with all of the subfolders that a file belongs to.
|
|
|
|
```sql
|
|
select storage.foldername(name)
|
|
from storage.objects;
|
|
```
|
|
|
|
For example, if your file is stored in `public/subfolder/avatar.png` it would return:
|
|
|
|
`[ 'public', 'subfolder' ]`
|
|
|
|
<hr />
|
|
|
|
`storage.extension()`
|
|
|
|
Returns the extension of a file.
|
|
|
|
```sql
|
|
select storage.extension(name)
|
|
from storage.objects;
|
|
```
|
|
|
|
For example, if your file is stored in `public/subfolder/avatar.png` it would return:
|
|
|
|
`'png'`
|
|
|
|
<hr />
|
|
|
|
### Security
|
|
|
|
Supabase Storage is integrated with your Postgres Database. This means that you can use the same Policy engine for managing access to your files.
|
|
|
|
### Policy Examples
|
|
|
|
Here are some examples to show you the power of PostgreSQL's Row Level Security. Each policy is attached to a table, and the policy is executed every time a table is accessed.
|
|
|
|
#### Allow public access to a bucket
|
|
|
|
```sql
|
|
-- 1. Allow public access to any files in the "public" bucket
|
|
create policy "Public Access"
|
|
on storage.objects for select
|
|
using ( bucket_id = 'public' );
|
|
```
|
|
|
|
#### Allow logged-in access to a bucket
|
|
|
|
```sql
|
|
-- 1. Allow logged-in access to any files in the "restricted" bucket
|
|
create policy "Restricted Access"
|
|
on storage.objects for select
|
|
using (
|
|
bucket_id = 'restricted'
|
|
and auth.role() = 'authenticated'
|
|
);
|
|
```
|
|
|
|
#### Allow individual access to a file
|
|
|
|
```sql
|
|
-- 1. Allow a user to access their own files
|
|
create policy "Individual user Access"
|
|
on storage.objects for select
|
|
using ( auth.uid() = owner );
|
|
```
|
|
|
|
### Tips
|
|
|
|
#### Go Easy
|
|
|
|
Supabase Storage is in Beta. If you're experiencing any issues, let us know on our [GitHub](https://github.com/supabase/supabase/discussions) and we will fix it as fast as we can.
|
|
|
|
## Next steps
|
|
|
|
- Got a question? Ask here.
|
|
- Read more about storage in our blog post.
|
|
- Sign in: app.supabase.com
|