S
Supabase•2mo ago
In&Out

Google oauth redirect is broken

Whatever i do, whatever link i give it, on auth login it always redirects to localhost/3000 even tho nowhere in my whole app is there a single mention of it, not even in google console, why?
11 Replies
In&Out
In&OutOP•2mo ago
  const handleGoogle = async () => {
    console.log("window.location.origin:", window.location.origin);
    console.log(
      "Redirect URL will be:",
      `${window.location.origin}/auth/callback`
    );

    const { error } = await supabase.auth.signInWithOAuth({
      provider: "google",
      options: {
        redirectTo: "MYSITELINK/auth/callback",
      },
    });

    if (error) console.error(error);
  };
  const handleGoogle = async () => {
    console.log("window.location.origin:", window.location.origin);
    console.log(
      "Redirect URL will be:",
      `${window.location.origin}/auth/callback`
    );

    const { error } = await supabase.auth.signInWithOAuth({
      provider: "google",
      options: {
        redirectTo: "MYSITELINK/auth/callback",
      },
    });

    if (error) console.error(error);
  };
import { createClient } from "@/lib/supabase/server";
import { NextResponse } from "next/server";

export async function GET(request: Request) {
  const { searchParams, origin } = new URL(request.url);
  const code = searchParams.get("code");
  console.log(origin);

  // always redirect to /dashboard unless "next" param explicitly provided
  let next =
    searchParams.get("next") ?? "MYSITELINK/dashboard";
  if (!next.startsWith("/")) {
    // if "next" is not a relative URL, force it to /dashboard
    next = "MYSITELINK/dashboard";
  }

  if (code) {
    const supabase = await createClient();
    const { error } = await supabase.auth.exchangeCodeForSession(code);

    if (!error) {
      const forwardedHost = request.headers.get("x-forwarded-host"); // original origin before load balancer
      // const isLocalEnv = process.env.NODE_ENV === 'development'
      // const isLocalEnv = false
      //       if (isLocalEnv) {
      //   return NextResponse.redirect(`${origin}${next}`)
      // } else

      if (forwardedHost) {
        return NextResponse.redirect(
          `MYSITELINK`
        );
      } else {
        return NextResponse.redirect(
          `MYSITELINK`
        );
      }
    }
  }

  // failed login → send them back home
  return NextResponse.redirect(`MYSITELINK`);
}
import { createClient } from "@/lib/supabase/server";
import { NextResponse } from "next/server";

export async function GET(request: Request) {
  const { searchParams, origin } = new URL(request.url);
  const code = searchParams.get("code");
  console.log(origin);

  // always redirect to /dashboard unless "next" param explicitly provided
  let next =
    searchParams.get("next") ?? "MYSITELINK/dashboard";
  if (!next.startsWith("/")) {
    // if "next" is not a relative URL, force it to /dashboard
    next = "MYSITELINK/dashboard";
  }

  if (code) {
    const supabase = await createClient();
    const { error } = await supabase.auth.exchangeCodeForSession(code);

    if (!error) {
      const forwardedHost = request.headers.get("x-forwarded-host"); // original origin before load balancer
      // const isLocalEnv = process.env.NODE_ENV === 'development'
      // const isLocalEnv = false
      //       if (isLocalEnv) {
      //   return NextResponse.redirect(`${origin}${next}`)
      // } else

      if (forwardedHost) {
        return NextResponse.redirect(
          `MYSITELINK`
        );
      } else {
        return NextResponse.redirect(
          `MYSITELINK`
        );
      }
    }
  }

  // failed login → send them back home
  return NextResponse.redirect(`MYSITELINK`);
}
i wanted to make it so, on success to go to /dashboard here are the links from google cloud 
# Authorized JavaScript origins
https://MYSITE
# Authorized redirect URIs
https://MYSITE/auth/callback
https://<your-supabase-project>.supabase.co/auth/v1/callback
# Authorized JavaScript origins
https://MYSITE
# Authorized redirect URIs
https://MYSITE/auth/callback
https://<your-supabase-project>.supabase.co/auth/v1/callback
silentworks
silentworks•2mo ago
Check your Supabase dashboard URLs section to make sure you don't have localhost:3000 in there. Also this url MYSITELINK/auth/callback must be in your Redirect URLs list in the Supabase dashboard. It must match exactly that and not be using wildcard urls.
garyaustin
garyaustin•2mo ago
Please don't shout mods you are not in a conversation with and your question has nothing to do with the OP's topic. Please start a new post with as much detail as you can.
In&Out
In&OutOP•2mo ago
lmao odd people how do i check that, if you mean in vscode, there is none it is nevermind, found it... it should have been clearer on how to do that but it is what it is, thank you @silentworks one more thing, how to make it on success to redirect me to /dashboard, it always just redirects me to home page
silentworks
silentworks•2mo ago
You've modified the original auth/callback script provided in the Supabase docs so this will no longer redirect to the page you want it to. You have explicitly stated it should redirect to your MYSITELINK in the code you shared above.
In&Out
In&OutOP•2mo ago
fine, i did this but its the same 
  try {
    const supabase = await createClient();
    const { error } = await supabase.auth.exchangeCodeForSession(code);

    if (error) {
      console.error("Auth exchange failed:", error.message);
      return NextResponse.redirect(HOME_URL);
    }

    // Success – redirect to dashboard
    console.log("Auth exchange successful");
    return NextResponse.redirect(DASHBOARD_URL);
  } catch (err) {
    console.error("Unexpected error during auth:", err);
    return NextResponse.redirect(HOME_URL);
  }
  try {
    const supabase = await createClient();
    const { error } = await supabase.auth.exchangeCodeForSession(code);

    if (error) {
      console.error("Auth exchange failed:", error.message);
      return NextResponse.redirect(HOME_URL);
    }

    // Success – redirect to dashboard
    console.log("Auth exchange successful");
    return NextResponse.redirect(DASHBOARD_URL);
  } catch (err) {
    console.error("Unexpected error during auth:", err);
    return NextResponse.redirect(HOME_URL);
  }
silentworks
silentworks•2mo ago
What's the last console log that was written when you tried this?
In&Out
In&OutOP•2mo ago
none, it doesnt console log nothing for some reason
silentworks
silentworks•2mo ago
Which means this is never reached. Which means your middleware is redirecting you before you even get to this endpoint.
In&Out
In&OutOP•2mo ago
how bruh, this is confusing ughh
silentworks
silentworks•2mo ago
What does your middleware look like? share it here. Also can you share a screenshot of your directory structure which should show the middleware.ts file in it too.

Did you find this page helpful?