phantom3313 Posts - Answer Overflow

phantom3313

•Created by phantom3313 on 4/27/2025 in #help

Intercept a email password sign-in at server?

I want to customize the behavior when an unverified user attempts to sign in. Currently, the built-in requireEmailVerification automatically sends a verification email, but I'd prefer to just return a 403 status and let my frontend handle requesting verification emails explicitly. Are there any hooks, middleware options, or configuration settings that would allow this customization?

2 replies

BABetter Auth

•Created by phantom3313 on 4/25/2025 in #help

How to Prevent Automatic Resending of Verification Email on Login with requireEmailVerification?

I have a question regarding the requireEmailVerification option. When I set requireEmailVerification: true, the backend correctly returns a 403 response if a non-verified user tries to log in. I handle this on the frontend by showing a verification modal. However, I’ve noticed that BetterAuth also automatically resends the verification email to the user when this happens. What I want: I want the verification email to be sent only when the user explicitly requests it (for example, by clicking a "Resend Verification Email" button in the modal), not automatically when they attempt to log in. Is there a way to disable this automatic resending of the verification email when a non-verified user tries to log in, while still using requireEmailVerification: true? Or do I need to implement custom logic to handle this scenario? Here’s my current configuration:

export const auth = betterAuth({
  ...
  emailAndPassword: {
    enabled: true,
    requireEmailVerification: true,
  },
  emailVerification: {
    ...
    sendVerificationEmail: async ({ user, url }) => {
      await sendMail(
        user.email,
        "Verify your email address",
        verification_email_html(url)
      );
    },
    
  },
});

export const auth = betterAuth({
  ...
  emailAndPassword: {
    enabled: true,
    requireEmailVerification: true,
  },
  emailVerification: {
    ...
    sendVerificationEmail: async ({ user, url }) => {
      await sendMail(
        user.email,
        "Verify your email address",
        verification_email_html(url)
      );
    },
    
  },
});

And here is my login handler:

  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
    ...
    await authClient.signIn.email(
      {
        email,
        password,
      },
      {
        onError: (ctx) => {
          setLoading(false);
          if (ctx.error && ctx.error.status === 403) {
            setShowVerificationModal(true);
          } else {
            setError(ctx.error?.message || "Sign in failed.");
          }
        },
        onSuccess: () => {
         ...
        },
        onRequest: () => ...,
      }
    );
  };

  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
    ...
    await authClient.signIn.email(
      {
        email,
        password,
      },
      {
        onError: (ctx) => {
          setLoading(false);
          if (ctx.error && ctx.error.status === 403) {
            setShowVerificationModal(true);
          } else {
            setError(ctx.error?.message || "Sign in failed.");
          }
        },
        onSuccess: () => {
         ...
        },
        onRequest: () => ...,
      }
    );
  };

Is there a configuration option to prevent the automatic sending of the verification email on login, or do I need to implement custom logic to handle this scenario?

2 replies

BABetter Auth

•Created by phantom3313 on 4/22/2025 in #help

Is it okay for getsession req to be made for every protected route or I should cache it?

Hey guys I have some routes which needs to be protected so I use this wrapper

export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
const { data, isPending, error } = authClient.useSession();

  if (isPending) {
    return (
      <div className="flex items-center justify-center min-h-screen">
        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" />
      </div>
    );
  }

  
  if (error || !data?.session) {
    return <Navigate to="/signin" replace />;
  }

  if (!data?.session || data.user.emailVerified === false) {
    return <Navigate to="/verify-mail" replace state={{ flow: "signin" }} />;
  }

  return <>{children}</>;
}

export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
const { data, isPending, error } = authClient.useSession();

  if (isPending) {
    return (
      <div className="flex items-center justify-center min-h-screen">
        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" />
      </div>
    );
  }

  
  if (error || !data?.session) {
    return <Navigate to="/signin" replace />;
  }

  if (!data?.session || data.user.emailVerified === false) {
    return <Navigate to="/verify-mail" replace state={{ flow: "signin" }} />;
  }

  return <>{children}</>;
}

so naturally every time I visit a route enclosed by this a api/auth/get-session call is made, I am a beginer and wanted to know is this behaviour okay or will it land a heavy hit on server?

8 replies

Gaming

Programming