How to prevent my site page to be loaded via 3rd party site frame of iframe?

当您希望防止其他第三方网站通过iFrame加载您的网站页面时，可以采取多种措施来加强安全性和保护网站内容。以下是一些方法：

1. 使用X-Frame-Options HTTP响应头

X-Frame-Options是一个HTTP响应头，用于控制网页是否有权在iframe、frame、embed或object中显示。您可以设置以下几种值：

• DENY：不允许任何网站通过框架展示本网站的页面。
• SAMEORIGIN：只允许同源的网站通过框架展示本网站的页面。
• ALLOW-FROM uri：只允许特定的URI通过框架展示本网站的页面。

例如，如果您想要完全禁止在iframe中加载您的页面，您可以在您的服务器配置中添加以下指令：

http
X-Frame-Options: DENY

2. 使用Content Security Policy (CSP)

Content Security Policy是一个更加现代和灵活的方式，它允许网站管理员定义页面可以如何执行，还包括指定哪些资源可以被嵌入。通过设置CSP的frame-ancestors指令，您可以控制哪些父级页面可以嵌入您的内容。例如：

http
Content-Security-Policy: frame-ancestors 'self'

这个指令告诉浏览器只允许来自同一源的父页面嵌入内容。如果想要允许特定的第三方域名，可以直接列出它们：

http
Content-Security-Policy: frame-ancestors 'self' https://example.com

3. JavaScript 基于域的检查

虽然不是最可靠的方法，因为用户可以禁用JavaScript或者绕过这些检查，但您还可以使用JavaScript来检查您的页面是否被第三方网站嵌入。以下是一个简单的例子：

javascript
if (window.top !== window.self) {
    window.top.location = window.location;
}

这段代码检查当前页面是否是顶级窗口，如果不是，它会尝试通过改变顶级窗口的地址来跳出iframe。

结合使用

为了最大化安全性，建议结合使用上述几种方法。例如，您可以在您的服务器设置中使用X-Frame-Options和CSP，并在您的前端代码中添加JavaScript检查作为附加的安全措施。

示例：配置 Apache 服务器

如果您的网站运行在Apache服务器上，您可以在.htaccess文件中设置X-Frame-Options：

apache
Header always set X-Frame-Options "DENY"

并且配置CSP：

apache
Header always set Content-Security-Policy "frame-ancestors 'self'"

这样配置后，Apache服务器会自动为所有页面响应添加这些HTTP头。

注意事项

• 需要注意的是，X-Frame-Options已经被CSP的frame-ancestors指令替代，但由于旧浏览器可能不支持CSP，为了兼容性，可能需要同时使用两种方法。
• 对于任何安全措施，都应当定期审查和测试以确保它们仍然有效，并且随着浏览器和网站安全标准的发展进行更新。

您无法从服务器端检查它，但您可以在页面加载后使用 JavaScript 来检测它。比较top和self，如果它们不相同，则您处于一个框架中。

此外，一些现代浏览器尊重X-FRAME-OPTIONS标头，它可以有两个值：

• DENY – 如果页面包含在框架中，则阻止呈现该页面
• SAMEORIGIN – 与上面相同，除非页面与顶级框架集持有者属于同一域。

用户包括Google的Picasa，它不能嵌入框架中。

支持标头的浏览器，最低版本：

• IE8 和 IE9
• 歌剧 10.50
• 狩猎4
• 铬4.1.249.1042
• Firefox 3.6.9（带有NoScript的旧版本）

Stackoverflow 包含一些 JS 来测试它 ( master.js)。这是它的相关部分：

shell
if(top!=self){
    top.location.replace(document.location);
    alert("For security reasons, framing is not allowed; click OK to remove the frames.")
}

但请记住，JS 可以被禁用。

对于现代浏览器，您可以使用CSP（内容安全策略），这是一个标准。以下标头将阻止文档在任何位置加载到框架中：

shell
Content-Security-Policy: frame-ancestors 'none'

X-（不过IE 11 需要前缀）。您还可以更改'none'为允许框架的来源，例如您自己的网站。

为了覆盖较旧的浏览器，最好与@Maerlyn 的答案一起使用。

您可以使用 javascript 阻止在 iframe 中加载页面

shell
<script type="text/javascript">
if ( window.self !== window.top ) {
    window.top.location.href=window.location.href;
}
</script>

此代码将页面 iframe 容器的地址更改为您的页面地址，并强制容器显示您的页面。

或者，如果您不介意您的内容出现在某些位置，但又不想出现在某个网站上，则可以阻止特定域。例如，如果offendingdomain.com要嵌入您的内容，您可以这样做：

shell
<script type="text/javascript">
    if(document.referrer.indexOf("offendingdomain.com") != -1) {
        window.location = "http://www.youtube.com/watch_popup?v=oHg5SJYRHA0";
    }
</script>

这将检查父文档的位置并查看它是否offendingdomain.com正在嵌入您的内容。然后，该脚本会将该 iframe 发送到某个著名的 YouTube 视频作为惩罚。事实上，他们只是自己翻滚。