Javascript 如何正确设置跨域脚本执行？

我们使用第三方报告应用服务器。我们的应用程序（我们称之为SiteA）包括一个脚本，该脚本由报表服务器提供，具有嵌入报表的方法。当调用该方法时，它会创建一个iFrame，从报表服务器加载请求的报表、脚本和样式（我们称之为siteb）

报告页面按预期加载，嵌入在其iFrame中。报告中的交互按预期运行。但是，报告页面（来自站点B）随后向父级（站点a）发送postMessage（）以调用一个方法来调整包含iFrame的容器元素的大小，并向父级（站点a）发送另一个postMessage（）以滚动到同一容器元素的顶部

供应商告诉我们，我们需要实施适当的CORS设置，以使其能够工作，除了“其他客户正在使用此方法”之外，没有提供进一步的解释。当前，它在控制台中抛出一个错误，声明：

未捕获的DomeException:从中阻止了原点为“[Site B]”的帧 访问交叉原点帧

在过去的两天里，我在MDN和其他网站上阅读了大量文档，但我仍然不清楚哪些服务器应用了哪些设置？我已经在这里和那里看到了几个关于设置头的例子，但是我所读到的几乎所有内容都只适用于从客户端（由站点A提供服务）向远程（站点B）发出Ajax请求，而对于我们正在处理的场景，根本没有什么必要的内容。有人能在这里透露一些信息吗？哪个服务器需要哪些头

---

非常感谢您的帮助。

为了避免CORS问题，您需要以下几点： 如果站点A使用iframe加载站点B。在站点B NGINX/APACHE配置中，您需要包括以下标题：

add_header 'Access-Control-Allow-Origin' "$http_origin" always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With' always;

在APACHE上：

---

在NGINX上：

为了避免CORS问题，您需要以下几点： 如果站点A使用iframe加载站点B。在站点B NGINX/APACHE配置中，您需要包括以下标题：

add_header 'Access-Control-Allow-Origin' "$http_origin" always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With' always;

在APACHE上：

---

在NGINX上：

CORS与此无关

---

错误消息表示站点B正试图访问站点A上被禁止的内容。这意味着站点B应该使用

postMessage

，但不是（或者至少不是正确的）。

CORS在这里是不相关的

---

错误消息表示站点B正试图访问站点A上被禁止的内容。这意味着站点B应该使用

postMessage

，但不是（或者至少是不正确的）。

@ayxos的答案在技术上也是正确的，尽管我们已经有了这一点（只需要验证我做得对）。在阅读了昆汀的回答之后，进一步的审查表明，报告服务器的脚本是不正确的。供应商已经有了修复程序，我们只是还没有应用升级。感谢所有回答的人。@ayxos的回答在技术上也是正确的，尽管我们已经准备好了（只需要验证我做得对）。在阅读了昆汀的回答之后，进一步的审查表明，报告服务器的脚本是不正确的。供应商已经有了修复程序，我们只是还没有应用升级。感谢所有回答的人。