Возникли проблемы при добавлении регистрации API Google с reactjs - PullRequest
0 голосов
/ 18 марта 2020

Я пытаюсь добавить регистрацию API Google с помощью reactjs и backend с помощью spotify. Я использую reactjs с редуксом.

Проблема в Я не могу проверить, работает ли он или нет .

Я получаю ответ от API Google, и я передал данные из ответа на мои действия, после чего они будут переданы на внутренний сервер.

Это мой код

googleAuth. js

const responseGoogle = response => {
      //console.log("rs", res);
      // console.log("callling action", action);
      //action(res.profileObj);
      if (response) {
        console.log('GOOGLE API LOGIN')

        console.log(response);
        console.log('Google Id', response.googleId);
        console.log('Email id', response.profileObj.email)
        console.log('UserName', response.profileObj.name)
        console.log('Access Token', response.accessToken)
        this.setState({
          data: {
            email: response.profileObj.email,
            username: response.profileObj.name,
            password: response.googleId
          }
        });
        this.props.SignUpGoogle(this.state.data);
      }

    }

Кнопка входа в Google

<GoogleLogin
        className="margin7"
        clientId="XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
        onSuccess={responseGoogle}
        onFailure={responseGoogle}
        cookiePolicy={"single_host_origin"}
        icon={false}
        render={renderProps => (
          <Button
            style={{
              minHeight: "40px",
              borderRadius: "0px",
              boxShadow: "none"
            }}
            type="submit"
            className="google"
            title={title}
            onClick={renderProps.onClick}
            disabled={invalid}
          />
        )}
      />

UserActions

export const SignUpGoogle = data => dispatch => {
  const reqObj = {
    email: data.email,
    isFacebook: false,
    isGoogle: true,
    username: data.name,
    password: data.googleId
  };
  authInstance
    .post("/signup/buyer", reqObj)
    .then(res => {
      dispatch({
        type: types.SET_USER_INFO_LOAD
      });
      new _rest()
        .get("/buyer")
        .then(response => {
          console.log("response", response);
          dispatch({
            type: types.SET_USER_INFO_SUCCESS,
            payload: response.data
          });

        })
        .catch(err => { });
    })
    .catch(err => { console.log(err) });
};

1 Ответ

0 голосов
/ 18 марта 2020

Проблема здесь

this.setState({
      data: {
        email: response.profileObj.email,
        username: response.profileObj.name,
        password: response.googleId
      }
    });
    this.props.SignUpGoogle(this.state.data);

setState не приостанавливает выполнение. Поэтому, когда действие вызывает, состояние не устанавливается. Состояние по-прежнему пустое

Попробуйте это

this.setState({
          data: {
            email: response.profileObj.email,
            username: response.profileObj.name,
            password: response.googleId
          }
        });
        this.props.SignUpGoogle({
          data: {
            email: response.profileObj.email,
            username: response.profileObj.name,
            password: response.googleId
          }
        });

Или, если вам нужно таким же образом, выполните asyn c функцию и дождитесь setState, как показано ниже

    const googleResponse = async response = {
   your code 

    await setState(your code)
   }
...