ReCAPTCHA v2 does not work in IE compatibility view

I am trying to get recapatcha v2 to work in my ASP MVC project. Client computers have IE10 / IE11 and show all intranet pages in a compatibility view, which is why recaptcha is not displayed because it is intended.

The problem is that he rarely accepts my answer, although this is correct. It just shows a new image, but every time at some time I get it right. Does anyone else experience this?

If you enable compability for google.com in IE and visit the demo site , you can try it.

+4
source share
3 answers

reCAPTCHA requires that the compatibility view is not enabled for operation, see

https://support.google.com/recaptcha/?hl=en-GB#6223838

+3
source

You see the reCaptcha return reserve. It seems that you need to get two correct answers in a row. Then it gives you the response code, which you copy and paste into the element <textarea>.

So what you may be experiencing is that you are not getting two consecutive reCaptchas correctly.

You can test the fallback recaptcha by adding a parameter fallback=trueto the JavaScript resource :

<script src="https://www.google.com/recaptcha/api.js?fallback=true" async defer></script>

As explained by @Coulton recaptcha does not support IE compatibility mode.

+2
source

reCaptcha javascript querySelectorAll querySelector. IE 11 IE 7.0, IE 7.0 , , querySelectorAll querySelector, .

Now I am using .net web forms, so you may have to adapt it a bit for MVC, but here it is:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="reCaptcha.aspx.cs" Inherits="reCaptcha" %>

<!DOCTYPE html>
<script type="text/javascript">
    // this defines these functions if they don't exist.
    if (!document.querySelectorAll) {
        document.querySelectorAll = function (selectors) {
            var style = document.createElement('style'), elements = [], element;
            document.documentElement.firstChild.appendChild(style);
            document._qsa = [];

            style.styleSheet.cssText = selectors +
                '{x-qsa:expression(document._qsa && document._qsa.push(this))}';
            window.scrollBy(0, 0);
            style.parentNode.removeChild(style);

            while (document._qsa.length) {
                element = document._qsa.shift();
                element.style.removeAttribute('x-qsa');
                elements.push(element);
            }
            document._qsa = null;
            return elements;
        };
    }

    if (!document.querySelector) {
        document.querySelector = function (selectors) {
            var elements = document.querySelectorAll(selectors);
            return (elements.length) ? elements[0] : null;
        };
    }
</script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.js' type="text/javascript"></script>
<script src='https://www.google.com/recaptcha/api.js' type="text/javascript"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/1.3.2/jquery.min.js' type="text/javascript"></script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>reCaptcha Test</title>

</head>
<body>
    <h1>reCaptcha Test</h1>
    <form id="frmResult" runat="server">  
    <div class="g-recaptcha" data-sitekey=""></div>
        <script type="text/javascript">
         function IeVersion() {
                    //Set defaults
                    var value = {
                        IsIE: false,
                        TrueVersion: 0,
                        ActingVersion: 0,
                        CompatibilityMode: false
                    };

                    //Try to find the Trident version number
                    var trident = navigator.userAgent.match(/Trident\/(\d+)/);
                    if (trident) {
                        value.IsIE = true;
                        //Convert from the Trident version number to the IE version number
                        value.TrueVersion = parseInt(trident[1], 10) + 4;
                    }

                    //Try to find the MSIE number
                    var msie = navigator.userAgent.match(/MSIE (\d+)/);
                    if (msie) {
                        value.IsIE = true;
                        //Find the IE version number from the user agent string
                        value.ActingVersion = parseInt(msie[1]);
                    } else {
                        //Must be IE 11 in "edge" mode
                        value.ActingVersion = value.TrueVersion;
                    }

                    //If we have both a Trident and MSIE version number, see if they're different
                    if (value.IsIE && value.TrueVersion > 0 && value.ActingVersion > 0) {
                        //In compatibility mode if the trident number doesn't match up with the MSIE number
                        value.CompatibilityMode = value.TrueVersion != value.ActingVersion;
                    }
                    return value;
                }
         var ie = IeVersion();
         var reCaptchaApi = "";

        $(document).ready(function () {
            $('.g-recaptcha').each(function (index, obj) {
            grecaptcha.render(obj, { 'sitekey': reCaptchaApi });
      });
      if (ie.CompatibilityMode) {
          // loading it twice makes it load in compatibility mode.
            $('.g-recaptcha').each(function (index, obj) {
                grecaptcha.render(obj, { 'sitekey': reCaptchaApi });
            });
        }
        });
    </script>
</form> 

</body>
</html>

This allows loading reCaptcha V-2 in compatibility mode.

+1
source

Source: https://habr.com/ru/post/1610566/


All Articles