如何使用X-Frame-Options头防范ClickJacking（点击劫持）攻击

一、X-Frame-Options 可选配置值 #

• DENY：完全禁止任何页面将当前资源嵌入到frame/iframe中，防护等级最高
• SAMEORIGIN：仅允许同域名下的页面嵌入当前资源，是大部分业务场景的首选配置
• ALLOW-FROM 域名：仅允许指定的域名页面嵌入当前资源，注意部分新版浏览器已废弃该属性，这类场景建议搭配CSP的frame-ancestors指令使用

二、不同环境的配置实现 #

2.1 Nginx 配置 #

在nginx.conf或者对应站点的server配置块中添加以下代码：

add_header X-Frame-Options "SAMEORIGIN" always;

配置完成后执行nginx -s reload重载配置即可生效。

2.2 Apache 配置 #

在httpd.conf或者站点的.htaccess文件中添加：

Header always set X-Frame-Options "SAMEORIGIN"

修改后执行systemctl restart httpd重启Apache服务生效。

2.3 IIS 配置 #

打开IIS管理器，找到对应站点的「HTTP响应头」功能，点击「添加」，名称输入X-Frame-Options，值输入SAMEORIGIN，确定后重启站点生效。

2.4 后端代码直接配置（无服务端配置权限时可选） #

如果没有权限修改服务端配置，可以直接在后端代码中添加响应头：

• Java（SpringBoot）：

response.addHeader("X-Frame-Options", "SAMEORIGIN");
// 或使用Security配置：http.headers().frameOptions().sameOrigin();

• PHP：

header('X-Frame-Options: SAMEORIGIN');

• Node.js（Express）：

app.use((req, res, next) => {
  res.setHeader('X-Frame-Options', 'SAMEORIGIN');
  next();
});

三、配置验证方法 #

配置完成后可以用两种方式验证是否生效：

• 打开浏览器开发者工具的「网络」面板，刷新页面，查看对应请求的响应头中是否存在X-Frame-Options字段，值是否符合预期
• 主动创建一个测试HTML文件，用iframe嵌入目标站点，查看页面是否被浏览器拦截加载

内容的提问来源于stack exchange，提问作者Faran Saleem