- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我在 google reCaptcha 中遇到一些问题验证码很好,显示正常,但是当我提交它时,当我向
发送 POST 请求时出现连接问题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');
});
});
};
我在那里添加了标题,但它总是说
No 'Access-Control-Allow-Origin' header is present on the requested resource
有人可以帮助我吗?谢谢
我正在使用 Chrome,并且我已使用此插件在 Chrome 中启用了 CORS:
现在它给了我另一个错误:
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 响应的步骤:
this.headers.append('Content-Type', 'application/x-www-form-urlencoded');
添加到 header 。 (至少在 Angular2 中)显然,之后您不能期望所有用户都安装 Chrome CORS 扩展程序,而且您不想将您的 secret 存储在客户端中,这真的很糟糕。因此,在开发中使用它后,您需要设置一个小型网络服务器,该服务器将接受来自客户端的请求并将其转发给 Google,然后将响应发送回您的客户端。
附注其他让我困惑的事情是人们说添加 this.headers.append('Access-Control-Allow-Origin', '*');
但这是您在设置时应用的设置一个网络服务器,这与执行来自客户端的请求无关。我一直尝试将其应用于我的客户端 Angular http 请求,认为这将是最终的修复。
关于angularjs - 验证码问题 : No 'Access-Control-Allow-Origin' header is present on the requested resource always shows even I have add header in angularJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26964929/
我是一名优秀的程序员,十分优秀!