javascript - 使用 postMessage 跨域消息传递

Question

我有一个要求，我需要在 iframe 内打开一个 html 页面，而该页面又被放置在另一个 html 页面内(此页面的 uri 以 file://开头)。 iframe 和外部 html 页面之间需要有跨域消息传递。当 iframe 内的页面从本地机器加载时(外部页面和 iframe 中的页面都有 file://uri)，它工作得很好。

现在，如果我尝试创建一个应用程序，将其托管在本地计算机中并在 iframe 内打开它，虽然页面成功加载，但外框架与 iframe 中的页面之间的消息传递失败。

我在 Chrome 中收到以下错误:-

Uncaught SecurityError: Blocked a frame with origin "http://localhost/newapp" 
from accessing a frame with origin "null".  The frame requesting access has a protocol of 
"http", the frame being accessed has a protocol of "file". Protocols must match.

我已经在托管应用程序的服务器上允许跨源请求。我还可以尝试哪些其他步骤来实现 postMessage 通信？

Answer 1

错误消息很明确:您没有使用相同的协议(protocol)。一种是使用 HTTP，另一种是使用文件。

作为 Chrome 的安全选择，您需要在 HTTP 或文件协议(protocol)下提供服务。