Fix: Bypass CAPTCHA in iframe environment

This commit is contained in:
gpt-engineer-app[bot]
2025-10-11 00:02:36 +00:00
parent 9969fe2692
commit c986a54fbf

View File

@@ -34,6 +34,10 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
displayName: '' displayName: ''
}); });
// Detect iframe environment and make CAPTCHA optional for preview compatibility
const isInIframe = window.self !== window.top;
const requireCaptcha = !isInIframe;
const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => { const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
setFormData(prev => ({ setFormData(prev => ({
...prev, ...prev,
@@ -45,7 +49,7 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
e.preventDefault(); e.preventDefault();
setLoading(true); setLoading(true);
if (!signInCaptchaToken) { if (requireCaptcha && !signInCaptchaToken) {
toast({ toast({
variant: "destructive", variant: "destructive",
title: "CAPTCHA required", title: "CAPTCHA required",
@@ -59,13 +63,16 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
setSignInCaptchaToken(null); setSignInCaptchaToken(null);
try { try {
const { error } = await supabase.auth.signInWithPassword({ const signInOptions: any = {
email: formData.email, email: formData.email,
password: formData.password, password: formData.password,
options: { };
captchaToken: tokenToUse
} if (tokenToUse) {
}); signInOptions.options = { captchaToken: tokenToUse };
}
const { error } = await supabase.auth.signInWithPassword(signInOptions);
if (error) throw error; if (error) throw error;
toast({ toast({
@@ -109,7 +116,7 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
return; return;
} }
if (!captchaToken) { if (requireCaptcha && !captchaToken) {
toast({ toast({
variant: "destructive", variant: "destructive",
title: "CAPTCHA required", title: "CAPTCHA required",
@@ -123,17 +130,22 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
setCaptchaToken(null); setCaptchaToken(null);
try { try {
const { data, error } = await supabase.auth.signUp({ const signUpOptions: any = {
email: formData.email, email: formData.email,
password: formData.password, password: formData.password,
options: { options: {
captchaToken: tokenToUse,
data: { data: {
username: formData.username, username: formData.username,
display_name: formData.displayName display_name: formData.displayName
} }
} }
}); };
if (tokenToUse) {
signUpOptions.options.captchaToken = tokenToUse;
}
const { data, error } = await supabase.auth.signUp(signUpOptions);
if (error) throw error; if (error) throw error;
@@ -288,21 +300,23 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
</div> </div>
</div> </div>
<div> {requireCaptcha && (
<TurnstileCaptcha <div>
key={signInCaptchaKey} <TurnstileCaptcha
onSuccess={setSignInCaptchaToken} key={signInCaptchaKey}
onError={() => setSignInCaptchaToken(null)} onSuccess={setSignInCaptchaToken}
onExpire={() => setSignInCaptchaToken(null)} onError={() => setSignInCaptchaToken(null)}
siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY} onExpire={() => setSignInCaptchaToken(null)}
theme="auto" siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY}
/> theme="auto"
</div> />
</div>
)}
<Button <Button
type="submit" type="submit"
className="w-full" className="w-full"
disabled={loading || !signInCaptchaToken} disabled={loading || (requireCaptcha && !signInCaptchaToken)}
> >
{loading ? "Signing in..." : "Sign In"} {loading ? "Signing in..." : "Sign In"}
</Button> </Button>
@@ -448,21 +462,23 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
</div> </div>
</div> </div>
<div> {requireCaptcha && (
<TurnstileCaptcha <div>
key={captchaKey} <TurnstileCaptcha
onSuccess={setCaptchaToken} key={captchaKey}
onError={() => setCaptchaToken(null)} onSuccess={setCaptchaToken}
onExpire={() => setCaptchaToken(null)} onError={() => setCaptchaToken(null)}
siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY} onExpire={() => setCaptchaToken(null)}
theme="auto" siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY}
/> theme="auto"
</div> />
</div>
)}
<Button <Button
type="submit" type="submit"
className="w-full" className="w-full"
disabled={loading || !captchaToken} disabled={loading || (requireCaptcha && !captchaToken)}
> >
{loading ? "Creating account..." : "Create Account"} {loading ? "Creating account..." : "Create Account"}
</Button> </Button>