允许子域之间的跨站请求，而不更改第二个子域的文件内容

Question

我目前正在尝试打包一个 Web 应用程序 (ConnectWise) 以包含在我公司的中央 Intranet 站点中。大多数情况下，这是一个相当简单的过程；创建一个包含 iframe 的页面，将 iframe 指向 ConnectWise url。这部分适用于几乎所有功能。

问题出现在应用程序的某些特定功能（在本例中是创建时间表条目过程的一部分）中，这些功能根本无法工作。 Chrome 给出以下控制台输出。

Uncaught SecurityError: Failed to read the 'frame' property from 'Window': Blocked a frame with origin "https://app.example.com" from accessing a frame with origin "https://host.example.com". Protocols, domains, and ports must match.

我知道这是由跨站点和同源策略的安全选项引起的。鉴于以下几点，有没有办法克服这个问题？

• 我对https://host.example.com有

  完全控制权

  • 我可以更改 html、javascript 和文件内容
  • 我可以更改 IIS 设置和标头
• 我对https://app.example.com有

  部分控制权

  • 我无法更改 html、javascript 和文件内容
  • 我可以更改 IIS 设置和标头。

我尝试在每个服务器上设置

Access-Control-Allow-Origin

，这是迄今为止我遇到的唯一不涉及更改应用程序服务器的文件内容的方法。当给出

的设置（以及设置组合）时，这似乎不起作用

• *

  或

  https://app.example.com

  开启时

  https://host.example.com

• *

  或

  https://host.example.com

  开启时

  https://app.example.com

编辑：

这个“重复”问题的解决方案在这里不适用。我无权有权更改 iframe 页面的文件内容（包括 javascript）（

app.example.com

）。此外，需要运行权限的脚本是 iframe 内的页面，而不是托管 iframe 的页面。

Answer 1

CORS 标头（例如

Access-Control-Allow-Origin

）仅影响 AJAX 请求，而不影响 DOM 访问。

但是，如果它们位于同一域但不同的子域，则您可以在每个页面上包含以下内容：

document.domain = 'example.com';

来自MDN：

如果两个文档均已设置，则允许一个文档访问另一个文档 document.domain 为相同的值，表明他们的意图 合作

如果

app.example.com

有任何

script

包含到

host.example.com

那么你可以将上面的代码放在这些脚本中来设置域。

例如

<script src="https://host.example.com/setup.js"></script>

Answer 2

不，这是不可能的。

Access-Control-Allow-Origin

主要影响从 HTTP 请求获取原始数据，而不是实时 DOM。

postMessage

可以让不同来源的框架进行通信，但是需要两个页面都包含JS。

Answer 3

这适用于我使用它的所有域。它将传递一个字符串，但不是一个对象。

iframe 域

window.parent.postMessage('mystr','https://parent.domain')

父域

var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
eventer(messageEvent,function(e) {
    var key = e.message ? "message" : "data";
    var data = e[key];
    if(data=="mystr"){console.log(mystr)}
},false);