angular - AWS Amplify UI - 输入确认码后“无法获取登录用户”

问题描述

当我确认注册时，我遇到了 Amplify Cognito UI 没有进入下一阶段的问题。在本地运行时会发生这种情况，我还没有尝试过。

UI 的其余部分正常工作（当您注册时，它会移动到“输入您的确认码”对话框，我可以使用现有用户正确登录），但是当我输入我的代码并单击确认时，我得到以下信息控制台中的错误，它保持在同一屏幕上。

AuthClass - Failed to get the signed in user – "No current user"

但是，查看 Cognito 控制台，用户已更改为 CONFIRMED 状态，所以我知道它正在工作。

我正在手动使用放大（即我没有使用任何 CLI 元素或后端，我将它连接到现有的 Cognito 用户池）。

这是我的 AWS 配置（如前所述，手卷，一些 ID 被屏蔽）

const awsConfig = {
    Auth: {
        region: 'eu-west-1',
        userPoolId: 'eu-west-1_xxxxxxx',
        userPoolWebClientId: 'xxxxxxxxxxxxxxxxxxxxxx',
        mandatorySignIn: true,

        authenticationFlowType: 'USER_PASSWORD_AUTH',

        oauth: {
            scope: ['email', 'aws.cognito.signin.user.admin'],
            redirectSignIn: 'http://localhost:3000/',
            redirectSignOut: 'http://localhost:3000/',
            responseType: 'code',
        },
    },
};

在我的组件 ts 文件中，我几乎遵循了他们的示例

export class SignInComponent implements OnInit, OnDestroy {

    user: CognitoUserInterface | undefined;
    authState: AuthState | undefined;

    signUpFormFields: FormFieldTypes;

    constructor(private _ref: ChangeDetectorRef) {
        this.signUpFormFields = [
            {
                type: 'email',
                label: 'Email Address',
                placeholder: 'you@email.com',
                required: true,
            },
            {
                type: 'given_name',
                label: 'First Name',
                placeholder: '',
                required: true,
            },
            {
                type: 'family_name',
                label: 'Last Name',
                placeholder: '',
                required: true,
            },
            {
                type: 'password',
                label: 'Password',
                placeholder: '',
                required: true,
            },
        ];

        onAuthUIStateChange((newAuthState) => {
            console.log(newAuthState);
        });
    }

    ngOnInit(): void {
        onAuthUIStateChange((authState, authData) => {
            this.authState = authState;
            this.user = authData as CognitoUserInterface;
            this._ref.detectChanges();
        });
    }

    ngOnDestroy(): (authStateHandler: AuthStateHandler) => () => void {
        return onAuthUIStateChange;
    }

}

和 HTML 元素一样

<amplify-authenticator *ngIf="authState !== 'signedin'" usernameAlias="email">
    <amplify-sign-up slot="sign-up" usernameAlias="email" [formFields]="signUpFormFields"></amplify-sign-up>
    <amplify-sign-in slot="sign-in" usernameAlias="email"></amplify-sign-in>
</amplify-authenticator>

<div *ngIf="authState === 'signedin' && user" class="App">
    <amplify-sign-out></amplify-sign-out>
    <div>Hello, {{user.username}}</div>
    <!-- This is where you application template code goes -->
</div>

我不确定这里应该实际发生什么，它应该按照Cognito 示例进入登录屏幕，还是应该进入登录屏幕。文档对预期的流程不是很清楚。

但我知道它不应该停留在那个屏幕上，控制台出现错误！

有谁知道我在这里做错了什么，或者我需要做什么才能将 UI 踢到流程的下一部分？

谢谢

标签： angularamazon-web-servicesamazon-cognitoaws-amplify

angular - AWS Amplify UI - 输入确认码后“无法获取登录用户”

问题描述

解决方案

推荐阅读