6

CORS和跨域消息传递在我看来是一样的:它们允许跨域通信。

是否有任何理由使用一个与另一个?

4

3 回答 3

10

CORS 用于 ajax 请求或 flash 通常不允许的 flash 请求。例如,如果域 x 没有跨域策略,并且您通过 flash 从那里检索 mp3 文件进行播放,则 flash 将不允许您读取 mp3 文件的 id3 标签。对于 ajax,如果目标服务器没有允许您的域发出请求的跨域策略,则您完全无法发出请求。

跨域消息传递允许您与文档中来自不同来源的 iframe 进行通信。例如,如果您有 youtube 视频 iframe,您可以向该 iframe 传递一条消息以更改音量。通常不可能进行通信,因为 iframe 具有不同的来源,因此您无法以编程方式对 youtube iframe 执行任何操作。

使用一个或另一个的原因现在应该很清楚了。CORS 允许您从另一个来源请求数据,而当您想与 iframe 内部但不在同一来源的应用程序通信时,使用主窗口和 iframe 之间的消息传递。

一个实际的例子:

1.你有一个带有 youtube 播放器的 iframe。

2.您请求从 youtube 数据 api (CORS, 可以是 JSONP, XHR 或其他) 播放一些视频。

3.您现在将跨域消息传递给 iframe 以开始播放您在步骤 #2 中请求的任何视频

于 2011-11-18T17:50:40.093 回答
1

首先,您应该知道以下浏览器支持 CORS:Internet Explorer 8+、Firefox 3.5+、Safari 4+ 和 Chrome。请注意,IE7 和旧版本的 Firefox 和 Safari 根本不支持它。但是事件 IE8 有一些限制 - 它不支持将凭据和“预检”请求发送到服务器。此外,您的服务器应该为 CORS 请求做好准备,即还应该在服务器上执行一些额外的工作。

使用 JSONP 或 iFrames 的跨域消息传递在浏览器支持方面更加普遍,有时甚至不需要额外的服务器端工作。

于 2011-11-18T17:53:39.413 回答
0

我相信这个问题的精神是“对于做跨域 XHR,CORS 和基于 iframe+postMessage 的方法的相对优缺点是什么?”

解释它们的用途并不能真正帮助回答这个问题。

在这里,我尝试从想要为特定已知页面/域提供“服务”(数据、行为)并需要这些域能够“调用”它的服务提供商的角度来回答这个问题。

CORS

  • 优点
    • 易于理解何时工作/在客户端上超级简单(不需要任何复杂的逻辑,一个简单的 XmlHttpRequest/fetch 调用就可以解决问题)
  • 缺点
    • 性能:每个新 URL 的前期往返开销(以及在 CORS 授权过期后之前访问过的 URL)
    • 潜在复杂/经常被误解的服务器端实现(指定何时应该允许 CORS,处理专门的动词等)
    • 跨浏览器的支持覆盖率非常低(比 postMessage):https ://caniuse.com/#feat=cors vs https://caniuse.com/#feat=x-doc-messaging

iframe+postMessage

  • 优点
    • SameSite cookie 处理不是问题(跨越域边界的是 postMessage 调用,而不是 XHR 调用)
    • 简单的服务器端实现(只需托管一个包含您的 JS 代码和跨域消息传递规则的“页面”;大部分复杂性最终都在前端 JS 中)
  • 缺点
    • 更多的客户工作;如果您提供服务,而不是提供简单的端点,您需要提供“SDK”,即要在目标页面中执行的脚本。
    • 潜在复杂/经常被误解的客户端实现(指定应允许发布给您的来源等)
    • 处理大消息时的影响可能比大 XHR 有效负载到达时更高?https://dassur.ma/things/is-postmessage-slow/
    • 如果您设置“X-Frame-Options”以帮助保护您的(提供服务的)站点,则可能存在复杂性 - 您需要为消息传递 iframe 主机“页面”添加豁免。

(请调整/更正/添加!)

于 2020-02-03T20:04:33.093 回答