Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Removing Recaptcha v2 problematically after being solved

I'm adding the Google Recaptcha v2 problematically to a backbone view like so:

// this is the callback function
var getRecaptchaResponse = function (response) {
    if (response) {
        thisView.captchaResponse = response;
        thisView.canShowContinue();
    } else {
        alert("Captcha response was incorrect");
    }
};

// render the recaptcha
var renderCaptcha = function () {
    thisView.captchaWidgetId = grecaptcha.render('recaptcha-container', {
        sitekey: GlobalSettings.recaptchaKey,
        callback: getRecaptchaResponse,
        size: 'compact'
    });
};

// map the internal function to the window
// so that the callback registered in the 
// link below can be called by JSONP.
window.renderCaptcha = renderCaptcha;

// load the script
$.getScript('https://www.google.com/recaptcha/api.js?onload=renderCaptcha&render=explicit', function () { });

Once the Captcha is solved successfully I want to remove it from the UI, so I'm simply removing the div container:

// if the user has solved the captcha yet, don't continue
if (!thisView.captchaResponse) {
    return;
}

// remove recpatcha
$('#recaptcha-container').remove();

There doesn't seem to be a API method that Google have offered to destroy the grecaptcha widget properly though. Is this a problem? What's the recommended way of doing this?

The above removal of the container works in Chrome, but not in IE11. In IE11 the captcha challenge remains visible.

like image 240
Rebecca Avatar asked Oct 29 '22 03:10

Rebecca


1 Answers

As per reCAPTCHA's FAQ, it seems that after removing the container, you should reset the captcha object using grecaptcha.reset(id)

https://developers.google.com/recaptcha/docs/faq

I'm getting an uncaught SecurityError: blocked a frame with origin "https://www.google.com" from accessing a frame with origin "". What should I do?

This typically occurs if the reCAPTCHA widget HTML element is programmatically removed sometime after the end user clicks on the checkbox. We recommend using the grecaptcha.reset() javascript function to reset the reCAPTCHA widget.

like image 71
Ezenhis Avatar answered Nov 09 '22 15:11

Ezenhis