reCaptcha 问题：请求的资源上不存在“Access-Control-Allow-Origin”标头，即使我在 angularJS 中添加标头，也始终显示

我在 google reCaptcha 中遇到一些问题 验证码很好，显示正常，但是当我提交它时，当我向以下地址发送 POST 请求时出现连接问题

https://www.google.com/recaptcha/api/verify https://www.google.com/recaptcha/api/verify

这里是错误日志：

XMLHttpRequest cannot load https://www.google.com/recaptcha/api/verify. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3002' is therefore not allowed access. The response had HTTP status code 405.

这是我的html代码：

<div class="form-group" style="margin-bottom: 20px;">
    <div class="text-center center-block">
      <div class="text-center center-block" vc-recaptcha
      tabindex="3"
      theme="white"
      key="model.key"
      lang="en"
           </div>
    <button class="btn" ng-click="submit()">Submit</button>
  </div>
</div>

这是我的controller.js

 $scope.model = {
            key: //THIS IS MY PUBLIC KEY
        };
 $scope.submit = function() {

            var valid;
            var ip;
            $http.jsonp('http://ipinfo.io/?callback=JSON_CALLBACK')
                    .success(function(data) {
                        console.log("stateChangeStart ip = " + data.ip);
                        ip = data.ip;
                    }).then(function() {
                $http({
                    method: 'POST',
                    headers: {
                        'Access-Control-Allow-Origin': '*',
                        'Access-Control-Allow-Methods': 'POST'
                    },
                    url: 'https://www.google.com/recaptcha/api/verify',
                    data: {
                        'privatekey': /* THIS IS MY PRIVATE KEY */,
                        'remoteip': ip,
                        'challenge': vcRecaptchaService.data().challenge,
                        'response': vcRecaptchaService.data().response
                    }

                }).success(function(result, status) {
                    console.log('it work');

                }).error(function(data, status, headers, config) {
                    console.log('error');

                });

            });
        };

我在那里添加了标题，但它总是说

请求中不存在“Access-Control-Allow-Origin”标头 资源

有人可以帮助我吗？ 谢谢

Update:

我正在使用 chrome，并且我已使用此插件在 Chrome 中启用了 CORS：

在chrome中启用CORS https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi/related

现在它给了我另一个错误：

XMLHttpRequest cannot load https://www.google.com/recaptcha/api/verify. A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost:3002' is therefore not allowed access. 

我将我的controller.js更改为：

 $scope.model = {
            key: //THIS IS MY PUBLIC KEY
        };
 $scope.submit = function() {

            var valid;
            var ip;
            $http.jsonp('http://ipinfo.io/?callback=JSON_CALLBACK')
                    .success(function(data) {
                        console.log("stateChangeStart ip = " + data.ip);
                        ip = data.ip;
                    }).then(function() {
                $http({
                    method: 'POST',
                    headers: {
                        'Access-Control-Allow-Origin': 'http://localhost:3002',
                        'Access-Control-Allow-Methods': 'POST, GET, OPTIONS'
                    },
                    url: 'https://www.google.com/recaptcha/api/verify',
                    data: {
                        'privatekey': /* THIS IS MY PRIVATE KEY */,
                        'remoteip': ip,
                        'challenge': vcRecaptchaService.data().challenge,
                        'response': vcRecaptchaService.data().response
                    }

                }).success(function(result, status) {
                    console.log('it work');

                }).error(function(data, status, headers, config) {
                    console.log('error');

                });

            });
        };

但总是显示该错误，请帮助我。

很多这样的东西确实令人困惑。我们看到像上面这样的评论说“不要从客户端验证”。但是，如果您像我一样，您只是想让它在开发中首先工作，而我此时并不真正关心安全性。但是，我没有意识到 Chrome 比网络服务器更严格！如果不先做两件事，Chrome 将不允许您执行验证 Google 响应的步骤：

1. 安装 CORS chrome 插件
2. add this.headers.append('Content-Type', 'application/x-www-form-urlencoded');在发送帖子之前添加到标题。 （至少在角度2中）

显然，之后你不能指望所有用户都安装 Chrome CORS 扩展，而且你不想将你的秘密存储在客户端中，这真的很糟糕。因此，在开发中使用它后，您需要设置一个小型网络服务器，该服务器将接受来自客户端的请求并将其转发给 Google，然后将响应发送回您的客户端。

附：其他让我困惑的是人们说要添加this.headers.append('Access-Control-Allow-Origin', '*');但这是您在设置网络服务器时应用的设置，这与执行来自客户端的请求无关。我一直尝试将其应用于我的客户端角度 http 请求，认为这将是最终的解决方案。