Generating public URLs in Supabase - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ service_behavior

intermediate

Understanding public URL generation in Supabase Storage

You upload a file named image.png to a Supabase Storage bucket with public access enabled. What will the public URL look like?

A https://<project-ref>.supabase.co/storage/v1/download/public/<bucket-name>/image.png

B https://<project-ref>.supabase.co/storage/v1/object/private/<bucket-name>/image.png

C https://<project-ref>.supabase.co/storage/v1/files/public/<bucket-name>/image.png

D https://<project-ref>.supabase.co/storage/v1/object/public/<bucket-name>/image.png

💡 Hint

Public URLs use the public path segment in the URL.

Supabase Storage public URLs follow the pattern: https://<project-ref>.supabase.co/storage/v1/object/public/<bucket-name>/<file-path>. This allows direct access to files in public buckets.

❓ security

intermediate

Effect of bucket privacy on public URL accessibility

You generate a public URL for a file stored in a private Supabase Storage bucket. What will happen when you try to access this URL in a browser?

A The browser will show a 403 Forbidden error.

B The file will be downloaded successfully without authentication.

C The file will load but with a warning about privacy.

D The URL will redirect to the Supabase dashboard.

💡 Hint

Private buckets restrict access to authenticated users only.

Files in private buckets require authentication. Accessing their public URL without proper permissions results in a 403 Forbidden error.

❓ Configuration

advanced

Configuring a Supabase bucket for public URL generation

Which configuration step is necessary to allow generating public URLs for files in a Supabase Storage bucket?

A Set the bucket's region to 'public'.

B Enable file encryption for the bucket.

C Set the bucket's public access to enabled in the Supabase dashboard.

D Create a service role API key with read permissions.

💡 Hint

Public URLs require the bucket to be publicly accessible.

To generate public URLs, the bucket must have public access enabled in the Supabase dashboard settings. Other options do not enable public URL access.

❓ Architecture

advanced

Choosing the right URL type for secure file sharing

You want to share a file stored in a private Supabase bucket with a user temporarily without making the bucket public. Which approach is best?

A Change the bucket to public and share the public URL.

B Generate a signed URL with an expiration time.

C Download the file and send it via email.

D Create a new public bucket and move the file there.

💡 Hint

Temporary access without changing bucket privacy is best done with signed URLs.

Signed URLs allow temporary, secure access to private files without exposing the entire bucket publicly. Other options either reduce security or are less efficient.

✅ Best Practice

expert

Best practice for managing public URLs in a multi-tenant Supabase app

You manage a Supabase app serving multiple clients, each with their own files. How should you organize buckets and public URL access to ensure security and easy management?

A Create separate buckets per client with public access disabled; use signed URLs for sharing.

B Use a single public bucket for all clients to simplify URL generation.

C Create separate public buckets per client and share URLs directly.

D Store all files in a private bucket and share files by downloading and emailing.

💡 Hint

Consider isolation and security for each client.

Separating buckets per client with private access and using signed URLs ensures data isolation and secure sharing. Using public buckets risks exposing all clients' files.

Practice

1. What does the getPublicUrl function in Supabase do?

easy

A. It creates a link that anyone can use to access a file in a bucket.

B. It deletes a file from the storage bucket.

C. It uploads a file to the storage bucket.

D. It encrypts a file before storing it.

Solution

1. Step 1: Understand the purpose of getPublicUrl

   This function is designed to generate a URL that can be shared publicly to access a file stored in Supabase storage.

2. Step 2: Compare options with function behavior

   Only It creates a link that anyone can use to access a file in a bucket. describes creating a public link. Other options describe unrelated actions like deleting, uploading, or encrypting files.

3. Final Answer:

   It creates a link that anyone can use to access a file in a bucket. -> Option A

4. Quick Check:

   Public URL = Link to file [OK]

Hint: Public URLs let anyone access files without login [OK]

Common Mistakes:

• Confusing URL generation with file upload
• Thinking it deletes files
• Assuming it encrypts files automatically

2. Which of the following is the correct way to call getPublicUrl in Supabase to get a public URL for a file named photo.jpg in bucket images?

easy

A. supabase.getPublicUrl('images', 'photo.jpg')

B. supabase.storage.getPublicUrl('images/photo.jpg')

C. supabase.storage.from('images').getPublicUrl('photo.jpg')

D. supabase.storage.from('photo.jpg').getPublicUrl('images')

Solution

1. Step 1: Recall the correct method chaining

   The correct syntax is to select the bucket first with from('bucket_name'), then call getPublicUrl('file_path').

2. Step 2: Match options with correct syntax

   supabase.storage.from('images').getPublicUrl('photo.jpg') matches this pattern exactly. Options A, B, and D misuse method calls or argument order.

3. Final Answer:

   supabase.storage.from('images').getPublicUrl('photo.jpg') -> Option C

4. Quick Check:

   Bucket then file path = Correct call [OK]

Hint: Use .from(bucket).getPublicUrl(file) syntax [OK]

Common Mistakes:

• Calling getPublicUrl directly on storage
• Swapping bucket and file arguments
• Using wrong method names

3. What will be the output of this code snippet?

const { data } = supabase.storage.from('docs').getPublicUrl('file.txt');
console.log(data.publicUrl);

medium

A. A boolean indicating if the file exists.

B. A string URL to access 'file.txt' publicly in 'docs' bucket.

C. Undefined because 'data' is not returned by getPublicUrl.

D. An error because getPublicUrl returns a promise.

Solution

1. Step 1: Understand getPublicUrl return value

   The getPublicUrl method returns an object with a publicUrl string property immediately, not a promise.

2. Step 2: Analyze the console.log output

   Logging data.publicUrl will print the URL string to access the file publicly.

3. Final Answer:

   A string URL to access 'file.txt' publicly in 'docs' bucket. -> Option B

4. Quick Check:

   getPublicUrl returns URL string [OK]

Hint: getPublicUrl returns URL object, not a promise [OK]

Common Mistakes:

• Assuming getPublicUrl is async
• Expecting undefined data
• Confusing output with file existence check

4. You tried to generate a public URL with supabase.storage.from('media').getPublicUrl('video.mp4') but got an empty string. What is the most likely cause?

medium

A. getPublicUrl requires an async await call.

B. You forgot to import the Supabase client.

C. The bucket name should be 'videos' not 'media'.

D. The file 'video.mp4' does not exist in the 'media' bucket.

Solution

1. Step 1: Check file existence in bucket

   If the file does not exist, the public URL generated will be empty or invalid.

2. Step 2: Evaluate other options

   Importing client or bucket name mismatch would cause errors, not empty string. getPublicUrl is synchronous, so async is not needed.

3. Final Answer:

   The file 'video.mp4' does not exist in the 'media' bucket. -> Option D

4. Quick Check:

   Missing file = empty URL [OK]

Hint: Empty URL usually means file missing [OK]

Common Mistakes:

• Assuming getPublicUrl is async
• Ignoring file existence
• Mixing up bucket names

5. You want to share a file publicly but keep other files private in the same bucket. Which approach with Supabase storage and getPublicUrl is best?

hard

A. Use getPublicUrl only on files in a public bucket.

B. Set the bucket to private, then generate public URLs only for specific files using getPublicUrl.

C. Make the entire bucket public so all files are accessible.

D. Upload files with a special tag to mark them public.

Solution

1. Step 1: Understand bucket privacy settings

   Supabase storage buckets are either public or private. Public buckets allow all files to be accessed via public URLs.

2. Step 2: Evaluate file-level public access

   Supabase does not support per-file public access in private buckets. To share files publicly, the bucket must be public.

3. Step 3: Choose best practice

   Use getPublicUrl only on files in a public bucket. correctly states to use getPublicUrl on files in a public bucket to share them. Options A and D are incorrect because file-level public control is not supported. Make the entire bucket public so all files are accessible. makes all files public, which is not desired.

4. Final Answer:

   Use getPublicUrl only on files in a public bucket. -> Option A

5. Quick Check:

   Public URLs need public bucket [OK]

Hint: Only public buckets support public URLs per file [OK]

Common Mistakes:

• Thinking private buckets allow public URLs per file
• Making whole bucket public without control
• Assuming tags control public access