'X-Frame-Options','SAMEORIGIN' 跨域 iframe 问题答案

【问题标题】：'X-Frame-Options','SAMEORIGIN' Cross Domain Iframe issue'X-Frame-Options','SAMEORIGIN' 跨域 iframe 问题
【发布时间】：2021-05-09 11:50:03
【问题描述】：

我在节点 JS 中有 2 个项目。我已经包含了对我项目标题的响应是 res。 header('X-Frame-Options','SAMEORIGIN').

当我生成源链接并将其包含在元素中时，此链接仅适用于我的域，我不能包含在其他域中。

如何使用不同的域访问

谢谢...！

【问题讨论】：

标签： javascript jquery node.js iframe

【解决方案1】：

在安全性方面，我建议使用helmet.js。所以最好安装helmet.js，然后将其用作安全问题的中间件。比如下面写代码：

const express = require("express");
const helmet = require("helmet");

app = express();
app.use(helmet({
  contentSecurityPolicy: {
    directives: {
      "frame-ancestors": ["'self'", "https://otherDomain.com", "https://www.oneMoreDomain.com"]
    }
  }
}));

ContentSecurityPolicy 的 frame-ancestors 与 FRAME-OPTIONS 做同样的事情，但您可以添加将有权使用框架的域的白名单。

【讨论】：

允许使用前导通配符 http://*.example.com，如果 ancesotr 是 https，则子代也必须是 https。

【解决方案2】：

添加X-Frame-Options 标头的主要目的是防止您的页面在<iframe>（或<frame>、<embed>、<object>）内呈现。根据标头的值，您可以完全阻止它，也可以只允许嵌入同源。

因此，如果您需要允许从任何域呈现您的页面，您只需从响应中删除该标头即可。

【讨论】：

感谢@Udith Gunaratna，我已将响应标头 (res.header("X-Frame-Options", "ALLOWALL") 添加到我的 iframe 源中，现在工作正常.....
@ThamaraiKani ALLOWALL 不是该标头的有效值。设置无效值时，浏览器通常会忽略标题，所以我猜这就是您的情况。所以你所做的与完全删除标题相同。