Google Login in React is not triggering events

user_15060095 0
Viewed 940

Im using React to build an app and i'm using react-google-login. The login works, but the onSuccess event is not triggered The HTTP request is working and returns all the information

export class Auth extends Component {

    constructor(props) {
        super(props);
    
        this.state = {
          isLogined: false,
          accessToken: ''
        };
    
        this.login = this.login.bind(this);
        this.handleLoginFailure = this.handleLoginFailure.bind(this);
        this.logout = this.logout.bind(this);
        this.handleLogoutFailure = this.handleLogoutFailure.bind(this);
      }
    
      login (response) {
          console.log('login!!');
        if(response.accessToken){
          this.setState(state => ({
            isLogined: true,
            accessToken: response.accessToken
          }));
        }
      }
    
      logout (response) {
        this.setState(state => ({
          isLogined: false,
          accessToken: ''
        }));
      }
    
      handleLoginFailure (response) {
        alert('Failed to log in')
      }
    
      handleLogoutFailure (response) {
        alert('Failed to log out')
      }
    
    render() {
        return (
            <div>
               
                <GoogleLogin
                    clientId="CLIENTID"
                    buttonText='Login'
                    onSuccess={ this.login }
                    onFailure={ this.handleLoginFailure }
                    cookiePolicy={ 'single_host_origin' }
                    responseType='code,token'
                />
                
            </div>
            )
        }

}
export default Auth;

I've tried some tutorials and watch the documentation but nothing works

reactjs google-authentication javascript
3 Answers

I would recommend an onClick and an onSuccess it well does whatever it is you want it to do if that won't work then maybe make the login button have a function onSuccess and onClick but take what I say with a grain of salt I am really new to coding and I'm 12 so there's also that

user_150599670

Give this a try:

export class Auth extends Component {
    state = {
      isLogined: false,
      accessToken: ''
    };
    
    login = (response) => {
        console.log('login!!');
      if(response.accessToken){
        this.setState(state => ({
          isLogined: true,
          accessToken: response.accessToken
        }));
      }
    }
    
    render() {
      return (
        <div>

          <GoogleLogin
              clientId="CLIENTID"
              buttonText='Login'
              onSuccess={login}
              cookiePolicy={ 'single_host_origin' }
              responseType='code,token'
          />

        </div>
      )
    }
}
export default Auth;

user_82447310

For me, it was Privacy Badger blocking it. Once I disabled it, the callbacks started to work again.

user_67308030
Related