跨域XHR失败，启用了Access-Control-Allow-Origin头 [英] Cross Domain XHR failing inspite of Access-Control-Allow-Origin header
问题描述
我是XHR的新手，我试图解决一个简单的用例。我有一个web服务器，我的javascript从哪里获取数据。但是，服务器会将javascript XHR请求重定向到备用位置（例如Amazon S3上的文件），而不是提供数据本身。
I am new to XHR and am trying to solve a simple use case. I have a web server, from where my javascript would fetch data. But instead of serving the data itself, the server would redirect the javascript XHR request to an alternate location (for example a file on Amazon's S3) to fulfill the request.
使我进入跨域XHR的世界，我无法得到一个简单的例子工作灵感读一点关于它。我添加访问控制允许原产地：*到我的主域中的标题，服务于包含javascript的网页。但它不工作。我缺少什么？我需要这个工作，不管浏览器，所以我寻找的东西初始服务器可以做的其他服务作为一个代理，这违背了将请求卸载到S3的目的。
This brought me into the world of cross domain XHR, and I am unable to get even a simple example working inspite of reading a bit about it. I am adding "Access-Control-Allow-Origin: *" to the header in my main domain which serves the web page containing the javascript. But it does not work. What am I missing? I need this to work regardless of browser so am looking for something the initial server can do other than serving as a proxy, which defeats the purpose of offloading the request to S3.
- Chrome ：在
第二次调用中显示Exception：NetworkError：DOM Exception 19。 - IE ：显示警告，但在
确认后打开第二个网址。 - Firefox ：在第二个
电话上说例外：Faliure。
- Chrome : Gives "Exception: NetworkError: DOM Exception 19" on the second call.
- IE: Shows a warning but opens second url after confirmation.
- Firefox: Just says "Exception: Faliure" on the second call.
test.php的代码如下：
<?php
header('Content-type: text/html');
header('Access-Control-Allow-Origin: *');
?>
<!DOCTYPE html>
<html>
<header>
<script type="text/javascript">
var request;
var url1 = "data/file.csv";
var url2 = "http://stackoverflow.com/users/1293955/ng-algo";
try
{
if (window.XMLHttpRequest) {
// IE7+, Firefox, Chrome, Opera, Safari
request = new XMLHttpRequest();
}
else {
// code for IE6, IE5
request = new ActiveXObject('Microsoft.XMLHTTP');
}
// load data. 'false' indicates that further script
// is not executed until data is loaded and parsed
alert("Test1 with url: "+url1);
request.open('GET', url1, false);
request.send();
alert(request.responseText);
alert("Test2 with url: "+url2);
request.open('GET', url2, false);
request.send();
alert(request.responseText);
} catch (e) { alert("Exception: "+e.message); }
</script>
</header>
This is a test page
</html>
推荐答案
对于任何任意请求
对于第二个请求成功， stackoverflow.com 必须在其响应中包含相关的 Access-Control-Allow - * 标头，请求。
For the 2nd request to succeed, stackoverflow.com would have to include relevant Access-Control-Allow-* headers in their responses that give your website permission to make the request. And whether those are included in the response or not is entirely up to Stack Exchange, in this case.
此外，通过包含 Access-Control-在这种情况下是否包含在响应中， Allow-Origin：* ，您实际上允许其他网站向他们起源请求您的网页。
Also, by including Access-Control-Allow-Origin: * in the response, you're actually allowing other websites to request your page from their origin.
您可能需要的是服务器上的代理脚本。您可以从Ben Alman找到一个广义解决方案：
What you may need is a "proxy" script on your server. You can find a generalized solution from Ben Alman:
- http://benalman.com/projects/php-simple-proxy/
- https://github.com/cowboy/php-simple-proxy
这将允许：
request.open('GET', 'proxy.php?url=' + encodeURIComponent(url2), false);
这篇关于跨域XHR失败，启用了Access-Control-Allow-Origin头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
