feat: implement redirect-based OAuth authorization for Google login

- Added a new endpoint `/auth/google/authorize-redirect` to handle OAuth authorization via server-side redirect, addressing CSRF cookie issues in Firefox/Safari.
- Updated the `GoogleLoginButton` component to use the new redirect endpoint instead of the previous JSON-based authorization method.
- Enhanced CSRF cookie handling by explicitly setting the cookie domain and ensuring compatibility with cross-origin requests.
This commit is contained in:
DESKTOP-RTLN3BA\$punk 2026-01-02 00:25:02 -08:00
parent a6b0400858
commit 9029f5c621
2 changed files with 78 additions and 25 deletions

View file

@ -3,7 +3,7 @@ import { IconBrandGoogleFilled } from "@tabler/icons-react";
import { motion } from "motion/react";
import { useTranslations } from "next-intl";
import { Logo } from "@/components/Logo";
import { trackLoginAttempt, trackLoginFailure } from "@/lib/posthog/events";
import { trackLoginAttempt } from "@/lib/posthog/events";
import { AmbientBackground } from "./AmbientBackground";
export function GoogleLoginButton() {
@ -13,29 +13,12 @@ export function GoogleLoginButton() {
// Track Google login attempt
trackLoginAttempt("google");
// Redirect to Google OAuth authorization URL
// credentials: 'include' is required to accept the CSRF cookie from cross-origin response
fetch(`${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/auth/google/authorize`, {
credentials: "include",
})
.then((response) => {
if (!response.ok) {
throw new Error("Failed to get authorization URL");
}
return response.json();
})
.then((data) => {
if (data.authorization_url) {
window.location.href = data.authorization_url;
} else {
trackLoginFailure("google", "No authorization URL received");
console.error("No authorization URL received");
}
})
.catch((error) => {
trackLoginFailure("google", error?.message || "Unknown error");
console.error("Error during Google login:", error);
});
// IMPORTANT: Use the redirect-based authorize endpoint for cross-origin OAuth
// This fixes CSRF cookie issues in Firefox/Safari where cookies set via
// cross-origin fetch requests may not be sent on subsequent redirects.
// The authorize-redirect endpoint does a server-side redirect to Google
// and sets the CSRF cookie properly for same-site context.
window.location.href = `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/auth/google/authorize-redirect`;
};
return (
<div className="relative w-full overflow-hidden">