Я пытаюсь использовать aws ampify для реализации функции входа в систему в приложении angular.
Когда я нажимаю кнопку «Войти через Google», я попадаю на страницу входа в Google и возвращаюсь на мою домашнюю страницу, когда я предоставляю действительные учетные данные Google.
В своей authService я слушаю событие 'auth'
. Поэтому, когда пользователь входит в систему, субъект isLoggedInSub выдает значение «истина». Я пытаюсь отобразить значение наблюдаемого объекта isLoggedIn $, созданного на основе этой темы. Но всегда показывает ложь. Как вы можете видеть на моей странице html, я использую конвейер asyn c для отображения значения. Почему не отображается значение true?
Когда я отлаживаю этот конкретный поток, описанный выше, я действительно вижу, что он попадает в код, в котором объект излучает истину. ie this.isLoggedInSub.next(true);
компонент входа. html
<button (click) ="signInWithGoogle()" type="button" class="btn btn-outline-primary">Login with Google</button>
<span>is loggedin: {{this.authService.isLoggedIn$ | async}}</span>
loginComponent.ts
async signInWithGoogle() {
await this.authService.socialSignIn(AuthService.GOOGLE);
}
auth.service.ts
private isLoggedInSub = new BehaviorSubject<boolean>(false);
isLoggedIn$ = this.isLoggedInSub.asObservable();
constructor() {
Hub.listen('auth', (data) => {
switch (data.payload.event) {
case 'signIn':
this.isLoggedInSub.next(true);
break;
case 'signOut':
this.isLoggedInSub.next(false);
break;
case 'signIn_failure':
break;
default:
break;
}
});
}
socialSignIn(socialProvider: CognitoHostedUIIdentityProvider): Promise<ICredentials> {
return Auth.federatedSignIn({
provider: socialProvider,
});
}