CORS configuration in Supabase - Mini Project: Build & Apply

Configure CORS for a Supabase Project

📖 Scenario: You are setting up a Supabase backend for a web app. To allow your frontend to communicate securely with your backend, you need to configure CORS (Cross-Origin Resource Sharing) settings correctly.This project will guide you through creating and updating the CORS configuration for your Supabase project.

🎯 Goal: Configure the CORS settings in Supabase to allow requests only from the exact origin https://myfrontend.example.com.

📋 What You'll Learn

Create a list variable named allowed_origins with the origin https://myfrontend.example.com

Create a configuration dictionary named cors_config with a key origins set to the allowed_origins list

Write a function named apply_cors_config that takes config as a parameter and returns a dictionary with key status and value "CORS applied"

Call the apply_cors_config function with cors_config and assign the result to result

💡 Why This Matters

🌍 Real World

Configuring CORS is essential to allow your frontend web app to securely communicate with your backend services without exposing your backend to unwanted origins.

💼 Career

Understanding and configuring CORS is a common task for cloud engineers and backend developers to ensure secure and functional web applications.

1

Create the allowed origins list

Create a list variable called allowed_origins containing the single string "https://myfrontend.example.com".

Supabase

# Your code here

Hint

Use square brackets to create a list with one string element.

2

Create the CORS configuration dictionary

Create a dictionary called cors_config with a key "origins" set to the variable allowed_origins.

Supabase

allowed_origins = ["https://myfrontend.example.com"]
# Your code here

Hint

Use curly braces to create a dictionary and set the key to the list variable.

3

Write a function to apply the CORS configuration

Define a function named apply_cors_config that takes one parameter config and returns a dictionary with the key "status" and the value "CORS applied".

Supabase

allowed_origins = ["https://myfrontend.example.com"]
cors_config = {"origins": allowed_origins}
# Your code here

Hint

Define a function with def and return the required dictionary.

4

Call the function and assign the result

Call the function apply_cors_config with the argument cors_config and assign the result to a variable named result.

Supabase

allowed_origins = ["https://myfrontend.example.com"]
cors_config = {"origins": allowed_origins}

def apply_cors_config(config):
    return {"status": "CORS applied"}

# Your code here

Hint

Call the function with the dictionary variable and assign the output to result.