How to Upload Files to Supabase Storage

1-- Allow authenticated users to upload files to their own folder
2create policy "Users can upload to own folder"
3on storage.objects for insert
4to authenticated
5with check (
6  bucket_id = 'uploads'
7  and (storage.foldername(name))[1] = auth.uid()::text
8);
9
10-- Allow authenticated users to read their own files
11create policy "Users can read own files"
12on storage.objects for select
13to authenticated
14using (
15  bucket_id = 'uploads'
16  and (storage.foldername(name))[1] = auth.uid()::text
17);
18
19-- Allow authenticated users to delete their own files
20create policy "Users can delete own files"
21on storage.objects for delete
22to authenticated
23using (
24  bucket_id = 'uploads'
25  and (storage.foldername(name))[1] = auth.uid()::text
26);

1import { createClient } from '@supabase/supabase-js'
2
3const supabase = createClient(
4  process.env.NEXT_PUBLIC_SUPABASE_URL!,
5  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
6)
7
8async function uploadFile(file: File) {
9  const { data: { user } } = await supabase.auth.getUser()
10  if (!user) throw new Error('Not authenticated')
11
12  const filePath = `${user.id}/${Date.now()}-${file.name}`
13
14  const { data, error } = await supabase.storage
15    .from('uploads')
16    .upload(filePath, file, {
17      cacheControl: '3600',
18      upsert: false,
19    })
20
21  if (error) throw error
22  return data
23}

1// For public buckets — permanent URL
2const { data } = supabase.storage
3  .from('public-bucket')
4  .getPublicUrl('user-id/photo.jpg')
5console.log(data.publicUrl)
6
7// For private buckets — temporary signed URL (1 hour)
8const { data: signedData, error } = await supabase.storage
9  .from('uploads')
10  .createSignedUrl('user-id/document.pdf', 3600)
11console.log(signedData?.signedUrl)

1const ALLOWED_TYPES = ['image/png', 'image/jpeg', 'image/webp', 'application/pdf']
2const MAX_SIZE = 10 * 1024 * 1024 // 10 MB
3
4async function safeUpload(file: File) {
5  if (!ALLOWED_TYPES.includes(file.type)) {
6    return { error: `File type ${file.type} is not allowed.` }
7  }
8  if (file.size > MAX_SIZE) {
9    return { error: `File is too large. Maximum size is 10 MB.` }
10  }
11
12  const { data: { user } } = await supabase.auth.getUser()
13  if (!user) return { error: 'Please sign in to upload files.' }
14
15  const { data, error } = await supabase.storage
16    .from('uploads')
17    .upload(`${user.id}/${Date.now()}-${file.name}`, file, {
18      cacheControl: '3600',
19      upsert: false,
20    })
21
22  if (error) return { error: error.message }
23  return { data }
24}