由具有沙盒属性的 <iframe> 发出的 XHR 请求的原始标头为空

Posted

技术标签:

【中文标题】由具有沙盒属性的 <iframe> 发出的 XHR 请求的原始标头为空【英文标题】:Origin header null for XHR request made from <iframe> with sandbox attribute 【发布时间】:2017-11-29 13:35:32 【问题描述】:

我有一个项目,我正在尝试从数据处理程序以制表符分隔值格式下载一些数据,但是,Google Chrome 正在为 Origin 标头值发送空值。

我在导航到 http://server.corp.somebiz.com/reportpages/Report_Page_Requests_Over_Time.aspx?app=76ac42b7-ba6f-4be4-b297-758ebc9fe615 时看到了这个

var url = 'http://server.corp.somebiz.com/DataHandlers/ReportSets.ashx?task=pagerequestsovertime&app=188d1956-c4a7-42f7-9bdd-38f54c14e125&format=tsv';

d3.tsv(url, function(d) 
  d.date = parseTime(d.date);
  d.close = +d.close;
  return d;
, function(error, data) 
  if (error) throw error;

  console.log('Do stuff');
);

以下是请求的原始标头:

GET /DataHandlers/ReportSets.ashx?task=pagerequestsovertime&app=786b5ef3-1389-4890-8004-533fd1f66f16&format=tsv HTTP/1.1
Host: server.corp.somebiz.com
Connection: keep-alive
accept: text/tab-separated-values,*/*
Origin: null
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (Khtml, like Gecko) Chrome/58.0.3029.110 Safari/537.36
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8

这以控制台上的错误结束:

XMLHttpRequest cannot load http://server.corp.somebiz.com/DataHandlers/ReportSets.ashx?task=pagere…6ac42b7-ba6f-4be4-b297-758ebc9fe615&start=2/1/2017&end=3/2/2017&format=tsv. The 'Access-Control-Allow-Origin' header has a value 'http://server.corp.somebiz.com' that is not equal to the supplied origin. Origin 'null' is therefore not allowed access.

我不仅要寻找为什么会发生这种情况,还有什么条件会导致 Chrome 向服务器发送空 Origin 标头。

这似乎是 Chrome 特有的问题,因为 Internet Explorer 11 正在向服务器发送正确的 Origin 值。

更新:添加另一个皱纹,这可能是也可能不是一个促成因素。

我将调用页面加载到 &lt;iframe&gt; 元素中以隔离脚本元素。在 iframe 之外调用页面会导致不同的行为,Chrome 上的 Origin 标头完全丢失。

【问题讨论】:

Origin null is not allowed by Access-Control-Allow-Origin的可能重复 您是从file:// url 运行代码吗?这导致了这个问题。如果是这种情况,您至少需要在本地服务器上运行。 不,我根本没有在 URL 中使用 file://。数据处理程序通过基于存储过程的 HTTP GET 动态构建请求,该存储过程从数据库中动态提取数据。 (我还查看了可能重复的问题,但它不适用。) 要清楚,我的 URL 是指运行代码的页面的 URL(即运行应用程序时在 Chrome 地址栏中看到的),而不是 url 变量的值您在代码中发出请求。 好吧,我确实是这么想的,只是确定一下。 【参考方案1】:

如果您正在加载调用页面的iframe 具有不包含值allow-same-origin、browsers give it a “unique” origin 的sandbox 属性:

当设置 [sandbox] 属性时,内容将被视为来自唯一来源,禁用表单、脚本和各种可能令人讨厌的 API,阻止链接针对其他浏览上下文,并保护插件. allow-same-origin 关键字导致内容被视为来自其真实来源,而不是强制其成为唯一来源

...当确定要在跨域请求中发送的 Origin 标头的值时,浏览器将任何唯一来源序列化为 null 并为 Origin 标头提供该值。

【讨论】:

以上是关于由具有沙盒属性的 <iframe> 发出的 XHR 请求的原始标头为空的主要内容,如果未能解决你的问题,请参考以下文章

检测对 HTML5 iframe 沙盒属性的支持

IFRAME 沙盒属性正在阻止 AJAX 调用

沙盒、IFrame 和允许同源

如何突破沙盒 iFrame?

带有“允许同源”标志错误的 iframe 沙盒

iframe下元素定位