从文件：//scheme运行的应用程序的CORS错误

Question

我有一个AngularJS/Cordova应用程序，可以在远程服务器上轮询JSON服务：

$http({method: 'GET', url: 'http://example.com/index.php'})

在浏览器中开发并运行我的内部网apache服务器（http://dev）我得到“不存在“访问控制允许源站”标题”，因此我通过添加以下内容来解决此问题：

Header set Access-Control-Allow-Origin "http://dev"

所有工作正常，我看到Origin： http：//dev在我的Chromedev工具。

所以，第一次考虑这个问题，我想知道当应用程序在Android/iOS网络视图中运行时，起源会是什么。我决定在我的设备上进行构建和部署，并期望在远程调试中看到相同的错误（SafariiOS和Weinre为Android），但令我惊讶的是，它可以工作（不发送任何CORS头）！我还发现，在这两个设备的应用程序运行在webview下的文件：//方案，而不是（我假设）由手机操作系统提供的某种超文本传输协议服务器。

因此，研究似乎表明，文件：//不需要CORS，这样的“站点”可以访问任何域上的任何XHR资源。但是，当我在桌面浏览器上测试这一点时，我发现Safari不需要文件：//需要CORS，但Chrome需要，FireFox也可以在没有CORS的情况下工作

所以我的问题是：

1）为什么我的应用程序在Android/iOS中没有CORS工作-是因为CORS不适用于file：//，还是Cordova正在做一些事情使其在设备中工作？

我有

2）如果，等待回答Q1，我应该想在安全的网站上，并明确允许来自应用程序的请求，你给文件：//主机的访问控制允许原产地值是多少？在我的调试中，文件：//的请求中没有Origin标头

3） 除了阻止对远程服务器的XHR请求，Chrome还阻止了我的应用程序模板（我使用的是单独的文件），见下文。这是我的应用程序的潜在问题，还是我不需要担心的Chrome问题？

XMLHttpRequest cannot load file:///Volumes/projects/phonegap/www/templates/tabs.html. Cross origin requests are only supported for HTTP. 




Answer 1

CORS头有两种方式来表示应该允许跨域XHR：

• 发送访问控制允许源：（允许所有主机）
• 将您希望允许的主机放在后端的源标题中

对于文件：//URL，它们将生成一个空源文件，无法通过第二个选项（回显）进行授权。

如上所述：

跨域策略不适用于PhoneGap（出于各种原因，基本上是因为您的应用程序基本上是在设备上运行文件：//URI）。

请注意，您必须为您的应用程序设置一个白名单才能访问这些外部域。

至于Chrome问题，可以在开发人员的控制台中看到：

加载资源失败：::ERR_FILE_NOT_FOUNDfile：///C：/2.htmlXMLHttpRequest无法加载file：///C：/2.html.收到无效响应。因此，不允许访问源'null'。

讨论了Chromium项目的问题跟踪程序#40787。他们将这些问题标记为无法修复，因为这种行为是设计造成的。

有一种解决方案建议，为了开发目的，只需关闭Chrome中的CORS，在Chrome中启动——允许从文件访问文件——禁用web安全

e、 g.窗户

`C:\Users\YOUR_USER\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files --disable-web-security`

以下是一些与科尔多瓦相关的回答：

• CORS和phonegap应用程序
• Apache Cordova中的域白名单-控制对外部域的访问的安全模型

有关CORS的更多信息，请查看这些资源：

• 跨源资源共享和文件：//
• 一个不错的CORS教程：http://www.html5rocks.com/en/tutorials/cors/
• 围绕原产地政策工作
• HTTP权限改造（CORS）（Mozilla）

还请检查CORS的浏览器支持：

• http://caniuse.com/#feat=cors

并记录W3C上的正式CORS规范：）