javascript 跨域资源共享和file://
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5138057/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Cross-Origin resource sharing and file://
提问by Justin Beckwith
I am writing an HTML5 application that is gathering data from a few different sources using JSONP. Anything I'm doing with a GET works perfectly. I'm now trying to POST data, and I've run into an interesting snag. I need to POST data from my application to another, where my application is running from a local machine. I am trying to write a cross-platform capable mobile application (think Pulse/Flipboard), so the code will always be running from a local source. My thought process was as follows:
我正在编写一个 HTML5 应用程序，它使用 JSONP 从几个不同的来源收集数据。我用 GET 做的任何事情都完美无缺。我现在正在尝试发布数据，但遇到了一个有趣的问题。我需要将数据从我的应用程序发布到另一个，我的应用程序在本地机器上运行。我正在尝试编写一个跨平台的移动应用程序（想想 Pulse/Flipboard），因此代码将始终从本地源运行。我的思考过程如下：
- Use JSONP - JSONP does not allow for posting, it just doesn't work that way (Post data to JsonP)
- Rely on CORS - Since the request is coming from a local source using
file://, the origin header is null. This causes the request to fail (XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin) - Use another server to bounce the request off of - this would be expensive
- 使用 JSONP - JSONP 不允许发布，它只是不能那样工作（将数据发布到 JsonP）
- 依赖 CORS - 由于请求来自使用 的本地源
file://，因此原始标头为空。这会导致请求失败（XmlHttpRequest 错误： Origin null is not allowed by Access-Control-Allow-Origin） - 使用另一台服务器来退回请求 - 这会很昂贵
All of the browsers I'm targeting are webkit based (iPad, Playbook, Android), so I'm wondering if there are any creaks in the same origin policy code that I can sneak through? Maybe something using iframe or postMessage?
我所针对的所有浏览器都是基于 webkit 的（iPad、Playbook、Android），所以我想知道在同一个源策略代码中是否有任何我可以偷偷摸摸的吱吱声？也许使用 iframe 或 postMessage 的东西？
采纳答案by Justin Beckwith
As it would turn out, the easiest way to do this is to post to the target url inside of an iframe. Same origin policy on most browsers allows you to perform an HTTP POST from one domain to another unrelated domain. I solved the problem by adding an iframe to my page, initially set to a local bootstrapping page. Since that page was loaded from the same domain, I am able to control it via script. I used that to post the form to my target site, and polled the results to determine if my call was successful. It's not elegant, but it works.
事实证明，最简单的方法是发布到 iframe 内的目标 url。大多数浏览器上的同源策略允许您从一个域到另一个不相关的域执行 HTTP POST。我通过向我的页面添加 iframe 解决了这个问题，最初设置为本地引导页面。由于该页面是从同一个域加载的，因此我可以通过脚本对其进行控制。我用它来将表单发布到我的目标站点，并轮询结果以确定我的呼叫是否成功。这并不优雅，但它有效。
回答by thirtydot
This Javascript library can almost certainly help you:
这个 Javascript 库几乎肯定可以帮助您：
easyXDM is a Javascript library that enables you as a developer to easily work around the limitation set in place by the Same Origin Policy, in turn making it easy to communicate and expose javascript API's across domain boundaries.
..
At the core easyXDM provides a transport stack capable of passing string based messages between two windows, a consumer (the main document) and a provider (a document included using an iframe). It does this by using one of several available techniques, always selecting the most efficient one for the current browser. For all implementations the transport stack offers bi-directionality, reliability, queueing and sender-verification.
easyXDM 是一个 Javascript 库，它使您作为开发人员可以轻松地解决同源策略设置的限制，从而使跨域边界的 javascript API 通信和公开变得容易。
..
在核心，easyXDM 提供了一个传输堆栈，能够在两个窗口、消费者（主文档）和提供者（使用 iframe 包含的文档）之间传递基于字符串的消息。它通过使用几种可用技术中的一种来实现这一点，始终为当前浏览器选择最有效的一种。对于所有实现，传输堆栈提供双向性、可靠性、排队和发送方验证。
