Astro auth Supabase not working

[royal wing]

Hi @minor shore. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

The knowledge sources don’t mention this exact error message, but they do show the same pattern you’re using: a <form method="post"> posting to /api/auth/register and then calling request.formData() in the endpoint. [Supabase auth pages; Supabase auth endpoints]

Given that:

• Your endpoint code matches the docs.
• Your form markup also matches the docs (same attributes, same names). [Supabase auth pages]

The error:

Content-Type was not one of "multipart/form-data" or "application/x-www-form-urlencoded".

means that the request reaching /api/auth/register is not a normal HTML form POST. Something is sending a request with a different Content-Type (e.g. application/json) to that same URL, so request.formData() throws.

From the docs, request.formData() is only valid when the request is a real form submission (multipart/form-data or application/x-www-form-urlencoded). [Build HTML forms]

So, based on the docs, here’s what to check:

1. Confirm the request is coming from the HTML form only

   • Make sure you don’t have any JavaScript calling /api/auth/register with fetch() and a JSON body.
   • If you do, either:
     • Change that JS to send a FormData object (so the browser sets a valid form Content-Type), or
     • Add a separate JSON endpoint and don’t call request.formData() there.

   The docs’ Supabase example only uses a plain HTML form submit, no fetch(). [Supabase auth pages]

2. Ensure the form is rendered as-is

   Your form should look like the example:

   <form action="/api/auth/register" method="post">
     <label for="email">Email</label>
     <input type="email" name="email" id="email" />
     <label for="password">Password</label>
     <input type="password" name="password" id="password" />
     <button type="submit">Register</button>
   </form>
   

   This is exactly what the docs use, and it works with request.formData(). [Supabase auth pages]

3. If you’re in output: 'static' mode

   The docs note that with static output you must add export const prerender = false; at the top of the endpoint file so it’s rendered on demand. [Supabase auth endpoints]

   // src/pages/api/auth/register.ts
   export const prerender = false; // only if using output: 'static'
   
   import type { APIRoute } from "astro";
   import { supabase } from "../../../lib/supabase";
   
   export const POST: APIRoute = async ({ request, redirect }) => {
     const formData = await request.formData();
     const email = formData.get("email")?.toString();
     const password = formData.get("password")?.toString();
   
     if (!email || !password) {
       return new Response("Email and password are required", { status: 400 });
     }
   
     const { error } = await supabase.auth.signUp({ email, password });
   
     if (error) {
       return new Response(error.message, { status: 500 });
     }
   
     return redirect("/signin");
   };
   

If, after confirming the above, you still see the same error, the most likely cause (based on the docs’ usage of request.formData()) is that some other client code is hitting /api/auth/register with a non-form Content-Type. In that case, you’ll need to either stop that request or handle it separately instead of calling request.formData() for it.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@minor shore Kapa.ai is still learning and improving, please let me know how I did by reacting below.