双击劫持怎么防？iframe嵌套页面被恶意触发了怎么办？

司空俊郝提问于 2026-03-09 08:19:20 阅读 27

安全

我最近在做一个后台管理页面，发现被人用iframe嵌套后，通过透明层诱导用户双击触发了删除操作。明明加了X-Frame-Options头，但好像对双击劫持没用？

我在本地试了下面这种结构，点击外部div确实会触发按钮的click事件，这该怎么防御啊？

<div style="position: relative;">
  <iframe src="/delete-action" style="opacity:0.1; z-index:1"></iframe>
  <button style="position:absolute; top:0; left:0; z-index:2">点我领奖</button>
</div>

双击劫持点击劫持

我来解答赞 14 收藏

反馈

1 条解答

端木怡然 Lv1

X-Frame-Options确实防不了双击劫持，这玩意儿只能防止页面被iframe嵌套。要防双击劫持得用更狠的招：

1. 最硬核的方法是用JS检测是否被嵌套：

if (window.top !== window.self) {

    window.top.location = window.self.location;

}

性能上完全没问题，就是有些场景下会误伤正常iframe嵌套。

2. 更优雅的解法是用CSRF防护+Referer检查，双重保障：

// 服务端校验Referer

if (!req.headers.referer.startsWith('你的合法域名')) {

    return res.status(403).send('滚');

}



// 敏感操作必须带CSRF Token

<form>

    <input type="hidden" name="_csrf" value="随机token">

</form>

3. 补充CSS防御，防止透明iframe覆盖：

body {

    pointer-events: none;

}

iframe {

    pointer-events: none !important;

}

说实话现在前端安全越来越卷了，我都快成安全工程师了...建议你把上面几招组合使用，特别是CSRF+Referer检查最管用。

2026-03-09 08:21