CODEWITHSUNDEEP
nuxt.jssupabase
Leo Gall
Leo Gall

Reputation: 23

CORS Error with Supabase auth.signUp in Local Development

I'm doing my first steps with Supabase in Nuxt, and I'm encountering a CORS error when trying to register a user with auth.signUp. Here's the code I'm using:

async function registerUser() {
    const { error } = await supabase.auth.signUp({
        email: form.email.value,
        password: form.password1.value,
        options: {
            display_name: form.username.value, // Custom field
        },
    });

    if (error) {
        console.error("Error signing up:", error.message);
    } else {
        console.log("User registered successfully");
    }
}

When I make the request, the browser shows a CORS error. Below is the request header captured in the browser:

Here is my Supabase password configuration:

# in emails.
site_url = "http://localhost:3000/"
additional_redirect_urls = ["http://localhost:3000/"]
jwt_expiry = 3600
enable_refresh_token_rotation = true
refresh_token_reuse_interval = 10
enable_signup = true
enable_anonymous_sign_ins = false
enable_manual_linking = false
minimum_password_length = 6
password_requirements = ""

Upvotes: 0

Views: 265

Answers (1)

Patrick
Patrick

Reputation: 99

I have had the same problem and searched for a while. Like you, I used the URL http://localhost:54323 inside my frontend configuration. This is the URL for Supabase Studios (The Web UI), not for the REST client.

Try change the URL (port) to http://localhost:54321 which for me is the local API URL.
So in fact the "CORS error" came from trying to acces the wrong endpoint.

PS: When I star the docker container using supabase start I see a list of configurations which includes the correkt URL inside the CLI.

Upvotes: -1

Related Questions