dinesh sharaf
dinesh sharaf

Reputation: 101

Angular 2: expired-callback is not getting fired in google reCAPTCHA

I've a form in my angular 2 application with google reCAPTCHA and I'm loading it like below.

<div class="g-recaptcha" [attr.data-sitekey]="sitekey" expired-callback="expCallback" data-callback="verifyCallback"></div>

in corresponding component constructor I'm binding the expCallback like below.

constructor(private _accountsApi: AccountsApiService, private _fb: FormBuilder) {
    this.initForm();
    window['verifyCallback'] = this.recaptchaCallback.bind(this);
    window['expCallback'] = this.resetCaptcha.bind(this);
}

resetCaptcha() {
    grecaptcha.reset();
}

Now, if the user solves the Captcha and kept the page idle for 2 minutes. Now I'm getting error message on Captcha widget "Verification expired. Check the checkbox again" When I get this error message, the resetCaptcha() method is not getting invoked.

Am I missing anything? Or is there any better way to reload the captcha when it gets expired?

Upvotes: 0

Views: 2041

Answers (3)

Muthulakshmi M
Muthulakshmi M

Reputation: 777

` It works for me

$w:any = window;

constructor(){this.$w['verifyCallback'] = this.verifyCallback.bind(this);}`

Upvotes: 0

ravi punjwani
ravi punjwani

Reputation: 506

You can use the following code to reset the validated / used recaptcha

let myWindow: any = window; myWindow.grecaptcha.reset();

Currently you can call it a workaround only. For more updates, follow this thread at github:

Link to this feature thread at GitHub

Upvotes: 1

ravi punjwani
ravi punjwani

Reputation: 506

I've used this module that is developed for angular2 only. Works quite nicely, with the callback.

angular2-recaptcha

Upvotes: 0

Related Questions