Question

我认为数据URI方案不是跨域请求，但我发现firefox和chrome的行为方式非常不同。

我知道这样做有点奇怪。问题不在于为什么你想要对数据做出请求：text / json ;, URI？，但是这可能吗？

$.get('data:text/json;,{"foo":"bar"}',function(data){
   alert(JSON.stringify(data));
})

Firefox确实如此，Chrome没有。

Answer 1

根据The Web Origin Concept (RFC 6454)，常规起源由triple (uri-scheme, uri-host, uri-port)组成。由于数据URI方案与HTTP URI方案不相同，并且它描述的URI当然没有与Web应用程序相同的主机和端口，因此很明显您的数据URI具有不同的来源。

我在php中创建了一个示例代码：

<强> http://test.loc/
在HTTP响应中返回aaa。

aaa

<强> http://test.loc/x.html
如果没有被CORS阻止，则发送GET http://test.loc/并在正文中显示aaa。

<script>
var xhr = new XMLHttpRequest();
xhr.open('GET', "http://test.loc", true);
xhr.onreadystatechange = function (){
    if (xhr.readyState==4)
        document.body.innerHTML = xhr.responseText;
};
xhr.send();
</script>

<强> http://test.loc/y.php
从数据URI加载http://test.loc/x.html脚本。

<object
    data="data:text/html;base64,<?php echo base64_encode(file_get_contents('x.html')); ?>"
></object>

结果：

msie目前不支持数据URI
firefox始终显示aaa
chrome display aaa仅当我设置Access-Control-Allow-Origin: null时，否则它会在沙盒中运行脚本，并隐藏XHR响应

结论：

目前只有chrome以正确的方式支持带有数据URI的CORS。我们应该向mozilla发送bug report，因为这是一个安全问题。在数据URI中发送的Javascript可以避免常规的js过滤器...

3年后：

根据我的Firefox错误报告，规格已更改，因此他们修复此问题。因此，数据URI现在需要支持它们的每个浏览器上的allow origin头。

数据URI方案和CORS

1 个答案:

我在php中创建了一个示例代码：

结果：

结论：

3年后：