google invisible ReCaptcha serverseitige Validierung schlägt fehl

Question

Ich habe das unsichtbare reCaptcha in meine Anwendung integriert und die Client-seitige Antwort kommt als Teil der Lösung der Image-Herausforderung. Ich rufe dann eine Winkelfunktion auf, um die Benutzerantwort auf der Serverseite unter Verwendung des folgenden Codes zu validieren. wo onloginSubmit (Token) ist der Erfolg zurückrufen.

<button id="btnLogin" ng-disabled="loginForm.$invalid" 
           class="g-recaptcha primarybtn margin-left-zero form-control-input" 
           data-sitekey="{{public_key}}" 
           data-callback='onloginSubmit'>{{'label_login' | 
           translate}}</button> 

<script> 
    function onloginSubmit(token) { 
     angular.element(document.getElementById('loginForm')).scope().verifyReCaptcha(token); 
    }; 
</script> 

in eckig ich rufe die verifyReCaptcha wie folgt.

$scope.public_key = "------ My Site Key -------"; 
    $scope.private_key = "------ My Secret Key -------"; 
    $scope.verifyReCaptchaURL = "https://www.google.com/recaptcha/api/siteverify"; 

$scope.verifyReCaptcha = function(reCaptchaToken){ 
     var captchaData = { 
       secret : $scope.private_key, 
       response : reCaptchaToken 
     } 

     $http({ 
      headers: { 
      'Accept': 'application/json,text/plain', 
      'Content-Type': 'application/json;application/x-www-form-urlencoded;charset=utf-8;', 
      }, 
      url: $scope.verifyReCaptchaURL, 
      method: 'POST', 
      data: captchaData 
     }).success(function (data) { 
      console.log("success"); 
      $scope.login(); 
     }).error(function (data) { 
      console.log("error"); 
      $window.location.reload(true); 
     }); 
    }; 

wenn ich den api Service https://www.google.com/recaptcha/api/siteverify traf. Ich bekomme den folgenden Fehler.

Failed to load https://www.google.com/recaptcha/api/siteverify: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. The response had HTTP status code 405. 

Ich konnte nicht mehr Dokumentation für das Problem finden.

was ist es, dass ich falsch mache und auch wenn es einen Fehler gibt das recaptcha nicht kommt und die Login-Taste, die ich benutze nicht reagiert.

In der Anfrage benenne ich die Methode als Post, die Methode wird als Optionen geritten und die Anfrage-Payload, die ich sende, ist nicht vorhanden. das ist, was ich

Request URL:https://www.google.com/recaptcha/api/siteverify Request Method:OPTIONS Status Code:405 Remote Address:10.120.118.50:8080 Referrer Policy:no-referrer-when-downgrade

Answer 1

Die meisten der Sache in der Registerkarte Netzwerke bekam man einen tollen Job gemacht. Eine Sache besteht darin, in Ihrer Anwendung zu verlangen, zu einer externen Domäne zu kommunizieren, so dass Sie HTTP-Header-Inhaltstyp einschließen können, ein JSONP-Format enthalten.

$http({ 
     headers: { 
     'Accept': 'application/json,text/plain', 
     'Content-Type': 'application/jsonp;application/x-www-form-urlencoded;charset=utf-8;', 
     }, 
     url: $scope.verifyReCaptchaURL, 
     method: 'POST', 
     data: captchaData 
    }).success(function (data) { 
     console.log("success"); 
     $scope.login(); 
    }).error(function (data) { 
     console.log("error"); 
     $window.location.reload(true); 
    });