仍然允许来自自己域的框架的 Javascript 框架 killer ？

Question

我们正在使用 X-Frame-Options header 和可能本页描述的 JS/CSS 设置实现点击劫持保护:

https://www.owasp.org/index.php/Clickjacking_Defense_Cheat_Sheet

作为引用，JS/CSS 解决方案如下所示:

<style id="antiClickjack">body{display:none !important;}</style>

<script type="text/javascript">
   if (self === top) {
     var antiClickjack = document.getElementById("antiClickjack");
     antiClickjack.parentNode.removeChild(antiClickjack);
   } else {
     top.location = self.location;
   }
</script>

鉴于所有现代浏览器都广泛支持 X-Frame-Options header ，我想知道我们是否应该保留 JS 框架 killer 。也许只是为了好的措施？如果这样做，我们需要注意的是，我们使用 colorbox 从我们自己的域中生成 iframe 弹出窗口。这可以通过将其设置为 SAMEORIGIN 来容纳在 X-Frame-Options header 中，但我不知道如何修改 JS 以允许来自同一域的帧，而不会轻易绕过它。

实际上，脚本会比较 self === top 并在它们相同时从正文样式中删除 display:none;。我可以修改条件以像这样检查域:

if (self === top || this.top.location.hostname === 'www.example.com')

但这使用了可以从框架页面更改的 location 对象，有效地绕过了脚本。基本上，我在这里寻找与这个被否决的建议类似的东西:

https://stackoverflow.com/a/21900420/998048

那么，2 个问题:

1.) 是否仍然认为使用 JS 实现帧查杀是最佳实践，甚至是必要的？

2.) 如果是这样，是否有更好、更安全的方法来保留 JS，但仍允许来 self 们自己域的帧？

Answer 1

我仍然使用 Javascript 方法，因为我的设置不允许我使用服务器端语言。

But this uses the location object which can be changed from the framing page

怎么会这样？如果更改了位置对象，您的浏览器会将您重定向到新的位置对象。如果在顶部窗口中更改了 location.hostname，它将重定向到您的网站。但是我建议使用 parent 而不是 top - 否则其他框架中的所有框架都可能会重定向到它们自己。

但是，如果用户禁用了 JS，则这些都不会发生，因此继续使用 X-Frame-Options 可能是个好主意。但是对于不关心 X-Frame-Options header 的浏览器，我会说保留 JS 解决方案。