skip to Main Content

I’m facing an issue with Google OAuth login in my React app. The authentication process works perfectly on localhost, but when deployed to a domain server (hosted on Vercel), the login is not successful. I have already verified the following:

  1. Google Console Configuration:

    • The JavaScript origin and authorize URL in the Google Console are correctly set for my domain.

2 Network Status:

  • When attempting to login using Google on the domain server, the network status shows a status 200 response.

Here is a snippet of the relevant code:

handleGoogleLogin = async (credentialResponse) => {
    var decoded = jwtDecode(credentialResponse.credential);
    const user = {
      name: decoded.name, // Customize based on Google's response
      email: decoded.email,
      sub:decoded.sub,
      

     // Customize based on Google's response
      // Add more fields as needed
    };

    try {
      // Check if the response structure matches your expectations
     
     
        // Store the user data in your MongoDB database using an API endpoint
       
        const res = await axios.post(`/api/v1/auth/google`, { user })
        console.log("res",res.data);
        console.log(res.data.token)
        if (res && res.data.success) {
          toast.success('Logged in successfully');
          setAuth({
            ...auth,
            user: res.data.user,
            token:res.data.token, // Update the user field correctly
          });
         console.log("res",auth);
          navigate(location.state || '/');
          localStorage.setItem('auth', JSON.stringify(res.data));
        } else {
          toast.error(res.data.message);
        }
    
    } catch (error) {
      console.log('eer',error);
      toast.error('Something went wrong');
    }
  }; <GoogleOAuthProvider  clientId="cliend id">
  <GoogleLogin
                    onSuccess={handleGoogleLogin}
                    rememberMe={true} 
                    onError={() => {
                      console.log('Login Failed');
                    }}
                  />
    </GoogleOAuthProvider>

Additionally, the app is built on the MERN stack, hosted on Vercel, and environment variables in the .env file are correctly configured.

I have thoroughly checked the above aspects, and everything seems to be in order. However, the login is not working on the domain server. Any guidance or suggestions on what might be causing this issue would be greatly appreciated.

Thank you!

2

Answers


  1. Did you add your domain to firebase console?
    If not, you need to add your domain to allow authentication.

    Login or Signup to reply.
  2. Make sure that your server is configured to handle CORS properly. If there are CORS issues, they might prevent the successful completion of the OAuth flow.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search