reCAPTCHA Unexpected token in JSON at position 0

夙愿已清 提交于 2020-11-28 07:09:17

问题


We use reCAPTCHA ver 2 as checkbox "I am not bot". Since from 2020-11-05 19:23:00Z during our page loading we get exception:

recaptcha__ru.js:211 Uncaught (in promise) SyntaxError: Unexpected token   in JSON at position 0
    at JSON.parse (<anonymous>)
    at recaptcha__ru.js:211
    at recaptcha__ru.js:209
    at Array.<anonymous> (recaptcha__ru.js:132)
    at Array.<anonymous> (recaptcha__ru.js:208)
    at GM.$ (recaptcha__ru.js:211)
    at Array.<anonymous> (recaptcha__ru.js:253)
    at QS.next (recaptcha__ru.js:416)
    at y (recaptcha__ru.js:355)

Exception occurs in https://www.google.com/recaptcha/api2/anchor?ar=1&k=6LcOyt8ZAAAAAD9WJMwwwvgvSGp8Bi0zWYS-FMX5&co=aHR0cDovL2JsYWNrYmlyZDo0ODA4MA..&hl=ru&v=1AZgzF1o3OlP73CVr69UmL65&size=normal&cb=a79dhaz0etu

Our page has not been changed. The reCAPTCHA breaks unexpectedly in one moment. On other page reCAPTCHA is still working (may be it is important the working page is a embedded inside iframe).

Any hints? What went wrong?

UPDATED

We try to isolate reCAPTCHA inside iframe in our JSP page as @user2384519 suggested:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Captcha test</title>
<script>
    function extractRecaptchaResponse() {
        var c = document.getElementById('g-recaptcha-isolator');
        if (c) {
            var src = c.contentWindow.document
                    .getElementById('g-recaptcha-response');
            if (src) {
                var target = document.getElementById('g-recaptcha-response');
                target.value = src.value;
            }
        }
        return true;
    }
</script>
</head>
<body>
    <h:form id="g-recaptcha-form">

        <h:panelGroup>
            <iframe id="g-recaptcha-isolator" src="/recaptcha.htm"
                onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+"px";}(this));'
                style="height: 78px; width: 100%; border: none; overflow: hidden;">
            </iframe>
        </h:panelGroup>

        <textarea id="g-recaptcha-response" name="g-recaptcha-response"
            style="display: none"></textarea>

        <h:panelGroup>

            <h:commandLink onclick="extractRecaptchaResponse()"
                actionListener="#{recaptcha.submit}">
                <span>Submit</span>
            </h:commandLink>

        </h:panelGroup>

    </h:form>
</body>
</html>

recaptcha.htm:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<script src="https://www.google.com/recaptcha/api.js"></script>
</head>
<body>
<div class="g-recaptcha" data-sitekey="xxxxxxx"></div>

and it solves the problem with JSON error, but reCAPTCHA shows popup with image selector and iframe cuts the popup.


回答1:


If you are using Prototype.js:

The Prototype JS library overrides the method reduce in the class Array.

The issue is resolved if you just add the following script after all imports (preferentially after the body tag):

Array.prototype.reduce = function(callback, initialVal) {
    var accumulator = (initialVal === undefined) ? undefined : initialVal;
    for (var i = 0; i < this.length; i++) {
        if (accumulator !== undefined)
            accumulator = callback.call(undefined, accumulator, this[i], i, this);
        else
            accumulator = this[i];
    }
    return accumulator;
};

Alternative solution:

The solution is modify the file Prototype.js and remove the function reduce from the file.

Object.extend(Array.prototype, {
    _each: function(iterator) {
        for (var i = 0, length = this.length; i < length; i++)
            iterator(this[i]);
    },
    clear: function() {
        this.length = 0;
        return this;
    },
    first: function() {
        return this[0];
    },
    last: function() {
        return this[this.length - 1];
    },
    compact: function() {
        return this.select(function(value) {
            return value != null;
        });
    },
    flatten: function() {
        return this.inject([], function(array, value) {
            return array.concat(Object.isArray(value) ? value.flatten() : [value]);
        });
    },
    without: function() {
        var values = $A(arguments);
        return this.select(function(value) {
            return !values.include(value);
        });
    },
    reverse: function(inline) {
        return (inline !== false ? this : this.toArray())._reverse();
    },
    //FROM HERE
    reduce: function() {
        return this.length > 1 ? this : this[0];
    },
    //TO HERE
    uniq: function(sorted) {
        return this.inject([], function(array, value, index) {
            if (0 == index || (sorted ? array.last() != value : !array.include(value)))
                array.push(value);
            return array;
        });
    },
    intersect: function(array) {
        return this.uniq().findAll(function(item) {
            return array.detect(function(value) {
                return item === value
            });
        });
    },
    clone: function() {
        return [].concat(this);
    },
    size: function() {
        return this.length;
    },
    inspect: function() {
        return '[' + this.map(Object.inspect).join(', ') + ']';
    },
    toJSON: function() {
        var results = [];
        this.each(function(object) {
            var value = Object.toJSON(object);
            if (!Object.isUndefined(value)) results.push(value);
        });
        return '[' + results.join(', ') + ']';
    }
});

In order to do that you will need open the jar file winch references to RichFaces (richfaces-impl-3.3.3.Final.jar).




回答2:


We also faced the same issue on 11/5. For quick fix, we have embedded recapcha in iframe. It was getting block by ajax4jsf/framework.pack.js




回答3:


We had the same problem, then identified that the issue was a conflict caused by another minified js file loaded on the same page.

We trimmed down what js was loaded on the page down to a bare minimum, eliminating the collision, and now it works fine again.



来源:https://stackoverflow.com/questions/64737646/recaptcha-unexpected-token-in-json-at-position-0

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!