JS works on Greasemonkey, but does not work directly on the page

0

I'm doing some testing using Google ReCaptcha.

What I'm trying to do is to automatically click on the checkbox when the captcha appears. I took this teste() function from the greasemonkey site and it works perfectly using the plugin, but it does not work if I add it directly to my page.

Would anyone tell me why this is so? What does greasemonkey do differently for script work?

<html>
    <head>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script><scripttype='text/javascript'src='https://www.google.com/recaptcha/api.js'></script></head><bodyonload='test();'><formaction="hello" method="POST">
            <div id='testid'>
                <div class="g-recaptcha"
                    data-sitekey="SITE_KEY_HERE"
                    data-callback="onSuccess">
                </div>
            </div>
        </form>
    </body>

    <script>

        function test() {
            var domain = (window.location != window.parent.location) ? document.referrer.toString() : document.location.toString();
            if (domain.indexOf('miped.ru') == -1 && domain.indexOf('indiegala') == -1 && domain.indexOf('gleam.io') == -1) {
                var clickCheck = setInterval(function() {
                    console.log('test');
                    if (document.querySelectorAll('.recaptcha-checkbox-checkmark').length > 0) {
                        clearInterval(clickCheck);
                        document.querySelector('.recaptcha-checkbox-checkmark').click();
                    }
                }, 100);
            }
        }

        var onSuccess = function(response) {
              alert(grecaptcha.getResponse());
        };

    </script>

</html>
    
asked by anonymous 22.01.2018 / 21:44

1 answer

0

The difference is that when you add ReCaptcha through the code below, the Google script automatically creates a iframe .

<div class="g-recaptcha" data-sitekey="MY-KEY"></div>

It turns out that when you try to change an element within this iframe , you can not. This is due to security.

While greasemonkey injects this same script into iframe created, so it works correctly.

You can even test this (I'll use Chrome for testing) .

Step 1 - Access link

Step 2 - Press F12 to open the browser console.

Step 3 - Enter the code document.querySelector('iframe').querySelector('.recaptcha-checkbox-checkmark'); and press enter.

  

See that nothing happens. This is because you are trying to access an element from an iframe outside of it.

Step 4 - Now change the access to the Google iframe. Click Top and then Anchor .

Step5-Nowthatyou're"inside" the created iframe, you can access and modify any elements within it. Try running the code below.

document.querySelector('.recaptcha-checkbox-checkmark').click();

This is how greasemonkey does. It simply injects the code into the iframe, allowing it to access / modify an element's event.

    
22.01.2018 / 22:06