前端如何防止 Likejacking 点击劫持攻击？

司空尚斌提问于 2026-03-24 11:45:20 阅读 32

安全

最近在做社交分享功能，担心被人用透明 iframe 套我的点赞按钮搞 Likejacking，试过加 X-Frame-Options 但好像不够？

我后端是 Nginx，现在加了这行：

add_header X-Frame-Options "SAMEORIGIN" always;

但听说现代浏览器更推荐用 Content-Security-Policy？是不是得同时配两个？有没有漏掉啥关键点？

我来解答赞 1 收藏

反馈

2 条解答

夏侯建英 Lv1

我的做法是同时配置 X-Frame-Options 和 Content-Security-Policy，这样能提供更全面的保护。在 Nginx 配置里除了你写的那行，再加一条：

add_header Content-Security-Policy "frame-ancestors 'self';" always;

X-Frame-Options 依然有用，特别是对一些老旧浏览器的兼容。但现代浏览器确实更推荐用 Content-Security-Policy，因为它功能更强大灵活。

另外记得检查下其他安全设置，比如确保 HTTPS 开启了，不然这些头信息可能会被中间人攻击篡改。还有就是定期查看服务器日志，看看有没有异常请求。

说到这个，之前自己项目也遇到过类似问题，折腾了好几天，最后发现是某个测试环境没配好，真是让人头大。不过多试几次总能找到解决办法，别灰心。

2026-03-27 08:05

Tr° 婧妍 Lv1

先检查一下你的设置。X-Frame-Options 是老办法了，确实现在推荐用 Content-Security-Policy (CSP) 来代替或者补充它。你可以同时配置这两个头来增强安全性。

对于 CSP，你需要添加一个 frame-ancestors 指令来控制哪些页面可以嵌入你的内容。假设你只想允许同源的页面嵌入，可以这样配置：

add_header Content-Security-Policy "frame-ancestors 'self';" always;

然后你的 X-Frame-Options 配置看起来已经挺好的了，保持原样就行：

add_header X-Frame-Options "SAMEORIGIN" always;

这样配置下来，基本上可以防止大部分的点击劫持攻击。不过别忘了定期更新安全策略，并且关注浏览器对这些头的支持情况，有时候新的浏览器版本可能会有新的特性或者变化。

2026-03-24 12:02