Question

我正在使用Firebase电话身份验证（SMS OTP验证），它需要一个recaptcha验证程序。如果用户第一次尝试成功，则该流程工作正常，但是如果用户失败，则无法再次尝试（由于未重置重新设置，该流程不会引起麻烦）。

我已经查看了Firebase文档-https://firebase.google.com/docs/auth/web/phone-auth#use-invisible-recaptcha

这就是他们的建议；

grecaptcha.reset(window.recaptchaWidgetId);

// Or, if you haven't stored the widget ID:
window.recaptchaVerifier.render().then(function(widgetId) { // <- I've tried this 
  grecaptcha.reset(widgetId);
}

但是，这似乎无法解决问题，用户仍然无法重试。

Login.ts -

declare global {
    interface Window { grecaptcha: any;
        _recaptchaVerifier: auth.RecaptchaVerifier; }
}

...

ionViewDidLoad() {
    window._recaptchaVerifier = new auth.RecaptchaVerifier('submitButton', {
        'size': 'invisible',
        'callback': function(response) {
            this.submitProfile()
            },
        'expired-callback': ()=>{
            this.resetReCaptcha()
        }

        });
    }

private submitProfile() : void{

            this._authAf.auth.signInWithPhoneNumber(x, window._recaptchaVerifier).then(result=>{
                    const alertSignIn = this._alertCtrl.create({
                    title: 'Enter Code',
                    inputs: [{type: 'number', name: 'vCode'}],
                    buttons: [{text: 'Verify', handler: data => {

                        const loadSignIn = this._loadingCtrl.create({})
                        loadSignIn.present().then(()=>{
                            result.confirm(data['vCode']).then(() =>{
                                loadSignIn.dismiss()
                            }, e=>{
                                loadSignIn.dismiss()
                                this.resetReCaptcha();
                                return
                            })  
                        });
                    }}
                ]
            });
            alertSignIn.present();
        }).catch((e)=>{
            this.resetReCaptcha();
        })
    }

private resetReCaptcha(){
        window._recaptchaVerifier.render().then(function(widgetId) {
            window.grecaptcha.reset(widgetId);
        })
    }

Login.html

<button  id="submitButton" ion-button full [disabled]="!profile.valid">Sign</button>

流量- 按submitButton后，警报应弹出并确认。

预期结果：现有的Recaptcha应该重置并让用户重试

实际结果：没有重置的迹象，signInWithPhoneNumber似乎没有“回应”

离子|无法重置验证码（因此用户无法再次尝试进行身份验证）

0 个答案: