Нужно ждать функцию, которая находится внутри обратного вызова - PullRequest
1 голос
/ 30 сентября 2019

Я использую Auth0 для выполнения аутентификации в моем приложении React.

После перенаправления по умолчанию, которое Auth0 выполняет после получения информации, мне нужно проанализировать возвращаемый хеш, а затем использовать некоторые из возвращенных всохраните токен авторизации в хранилище для других задач позже. Однако эта функция, которая обрабатывает сохранение authToken, происходит в обратном вызове parseHash (функция auth0).

Как мне дождаться завершения handleLogin () (функции, вызываемой в обратном вызове), прежде чем перейти кдругие задачи? Я не могу сделать parseHash () асинхронным, так как у меня нет к нему реального доступа.

Root.tsx

`if (this.props.location.hash) {
      this.props.authClient.parseHash(
        { hash: this.props.location.hash },
        (err, authResult) => handleLogin(err, authResult, this.props.dispatch)
      );
    }
  }`

handleLogin.ts

`export const handleLogin = (
  err: Auth0ParseHashError | null,
  authResult: Auth0DecodedHash | null,
  dispatch: Dispatch
) => {
  if (authResult) {
    const userId = authResult.idTokenPayload.sub;
    dispatch(
      setAuthToken({
        token: {
          accessToken: authResult.idToken,
          userId
        }
      })
    );
  }
};`

Этоинформация, которая предоставляется о parseHash () из Auth0

`parseHash(
    options: ParseHashOptions,
    callback: Auth0Callback<Auth0DecodedHash | null, Auth0ParseHashError>
  ): void;`

  `Decodes the id_token and verifies  the nonce.
  @param callback: function(err, {payload, transaction})`

Ответы [ 2 ]

0 голосов
/ 30 сентября 2019

const test = async () => {
  await example();
  console.log(`finished !`);
}

function example() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve();
    }, 2000);
  });
}

test();

Тогда для вашего случая я бы сказал: Внутри асинхронной функции

// Async anonymous function that directly executes
(async() => {
    const ret = await (err, authResult) => handleLogin(err, authResult, this.props.dispatch);

    if (this.props.location.hash) {
        this.props.authClient.parseHash(
            { hash: this.props.location.hash },
            ret
        );
    }
})()

Дело в том, handleLogin() делаеткажется, ничего не возвращает, поэтому ret может остаться нулевым. Возможно, в вашей логике есть проблема.

Помните, что:

(x) => x

- это то же самое, что и

(x) => { return x; }

, с функциями стрелок.

0 голосов
/ 30 сентября 2019

Если вы используете redux thunk , то отправка будет возвращать обещание. Вы должны быть в состоянии использовать .then, например,

handleLogin(err, authResult, this.props.dispatch).then(() => {/*other task code here*/})

Вам также необходимо вернуть отправку из функции handleLogin

...