React google login silently failing

user_13147315 0
Viewed 1168
  
  const onGoogleLoginFailure = () => {
    console.log("failed");
  };

const onGoogleLoginSuccess = useCallback((response) => {
    const idToken = response.tokenId;
    console.log("WHY ARE YOU LIKE THIS");
    fetch("/api/auth/", {
      method: "GET",
      headers: {
        Authorization: idToken,
      },
    }).then((res) => console.log(res));
    // .then((_) =>  navigate("/overview"))
  }, []);

  return isLoading ? null : (
    <Flex alignItems="center" justifyContent="center" h="100vh">
      <GoogleLogin
        clientId="tokenBOI" // your Google app client IDđ
        onSuccess={onGoogleLoginSuccess}
        onFailure={() => onGoogleLoginFailure}
        disabled={false}
        render={(renderProps) => {
          return (
            <Button onClick={renderProps.onClick}>
              Login
            </Button>
          );
        }}
      />
    </Flex>
  );

As stated, this code above fails silently and triggers onFailure. The id token is valid, the scope is inside one org. The prompt to select an account opens up, I select the account, the prompt closes and then nothing happens.

react-google-login google-signin reactjs
2 Answers

The package react-google-login is in the process of being deprecated, thats why the authentication process fails. I'm facing the same issue, so Apparently we have to use react-oauth/google package for authentication, so thats worth looking at. Check https://www.npmjs.com/package/@react-oauth/google for more details.

user_138683730

try these

const LoginFailure = (response) => {
    console.log(response)
    swal('Login fail')
  }

and call Function onFailure={LoginFailure }

user_160505570
Related