Question

我正在使用AWS Cognito实现忘记密码的逻辑。到目前为止，我已经成功按照文档中的提示使用“提示”更改了密码。这是代码

var username = document.getElementById('reset-pass').value;
    var data = {
        UserPoolId: _config.cognito.userPoolId,
        ClientId: _config.cognito.clientId
    };
    var userPool = new AmazonCognitoIdentity.CognitoUserPool(data);

    // setup cognitoUser first
    var cognitoUser = new AmazonCognitoIdentity.CognitoUser({
        Username: username,
        Pool: userPool
    });

cognitoUser.forgotPassword({
        onSuccess: function (result) {
            console.log('call result: ' + result);
        },
        onFailure: function(err) {
            alert(err);
        },
        inputVerificationCode() {
            var verificationCode = prompt('Please input verification code ' ,'');
            var newPassword = prompt('Enter new password ' ,'');
            cognitoUser.confirmPassword(verificationCode, newPassword, this);
        }
    });

我的问题不是使用提示，而是如何在下一页上确认用户。示例
用户在第一页上输入电子邮件，然后使用forgotPassword()发送邮件。
现在，用户被重定向到新页面。在这里，我想输入代码以及新密码，然后调用cognitoUser.confirmPassword方法。

我试图创建一个延迟间隔，在输入详细信息之后，它将在按下按钮时触发清除间隔。

   function resetPassword() {
    var username = document.getElementById('reset-pass').value;
    var data = {
        UserPoolId: _config.cognito.userPoolId,
        ClientId: _config.cognito.clientId
    };
    var userPool = new AmazonCognitoIdentity.CognitoUserPool(data);

    // setup cognitoUser first
    var cognitoUser = new AmazonCognitoIdentity.CognitoUser({
        Username: username,
        Pool: userPool
    });
    // call forgotPassword on cognitoUser
    cognitoUser.forgotPassword({
        onSuccess: function (result) {
            alert("Mail Sent")
        },
        onFailure: function (err) {
            console.log(err)
        },
        inputVerificationCode()
        {
            window.myVar = setInterval(function(){
                console.log('check');
            }, 10000);
            var verificationCode = document.getElementById('code').value;
            var newPassword = document.getElementById('fpass').value;
            cognitoUser.confirmPassword(verificationCode, newPassword, this);
        }
    });
}

代码的HTML部分-

<div class="change">
    <form>
        <label>Enter Email ID</label>
        <input type="email" id="reset-pass" required />
        <br />
        <div class=""><a href="#" class="btn btn_red" id="next" onclick="resetPassword()">Next</a></div>
    </form>
</div>

div class="change-confirm">
<form>
    <label>Enter Code</label>
    <input type="number" id="code" required />
    <br />
    <label>Enter New Password</label>
    <input type="password" id="fpass" required />
    <br />
    <div class=""><a href="#" class="btn btn_red" onclick="clearInterval(window.myVar);"> Reset</a></div>
</form>
</div>

但是以上代码从未执行。相反，它会在一段时间后停止执行。所以我的问题是，有什么方法可以延迟cognitoUser.confirmPassword方法的函数调用吗？我不想使用提示，而是在发送邮件后在文本字段中获取电子邮件和代码。

Answer 1

聚会晚了一点，但是可以帮助别人。

您可以将创建的congitoUser传递给状态，然后通过从状态中检索cognitoUser对象来使用cognitoUser.confirmPassword(...)。

Answer 2

您应该考虑使用aws-amplify-react，它提供了一个withAuthenticator高阶组件，该组件提供了带有忘记密码，MFA等的登录流程。它由为AWS工作的一组开发人员维护

https://aws-amplify.github.io/docs/js/react#add-auth

使用AWS Cognito忘记密码表格

2 个答案: