设置 X-Frame-Options HTTP 响应头防止点击劫持攻击

X-Frame-Options 是一个 HTTP 响应头，设置 X-Frame-Options HTTP 响应头为 DENY 或 SAMEORIGIN，用于控制页面是否可以被嵌入到 <iframe>, <frame>, <embed>, 或 <object> 等元素中。这有助于防止点击劫持攻击。

DENY 或 SAMEORIGIN 分别是什么意思？

1. DENY:

   • 当设置为 DENY 时，页面不能被嵌入到任何 <iframe>, <frame>, <embed>, 或 <object> 中，无论这些元素是在同一个网站上还是在其他网站上。
   • 这意味着其他任何网站都不能将此页面嵌入到它们的页面中。
   • 例如, 如果 example.com/page 设置了 X-Frame-Options: DENY, 那么无论是 example.com 还是 other-site.com, 都不能在其页面中嵌入 example.com/page。

2. SAMEORIGIN:

   • 当设置为 SAMEORIGIN 时, 页面只能被同一源 (origin) 的页面嵌入。
   • 这意味着只有与内容相同的协议、域名和端口的页面才能嵌入这个页面。其他所有的外部源都不能嵌入。
   • 例如, 如果 example.com/page 设置了 X-Frame-Options: SAMEORIGIN, 那么只有 example.com 上的其他页面可以嵌入它。其他域名，如 other-site.com, 不能嵌入这个页面。

不同服务器或应用框架设置X-Frame-Options的方法

根据您使用的服务器或应用框架，设置 X-Frame-Options 的方法可能会有所不同。以下是一些常见的服务器和框架的设置方法：

1. Apache HTTP Server:

在 .htaccess 文件或 Apache 配置文件中添加以下行：

Header set X-Frame-Options "DENY"

或者，如果你只允许同源页面嵌入：

Header set X-Frame-Options "SAMEORIGIN"

然后重启 Apache 服务器。

2. Nginx:

在 Nginx 配置文件的 server 或 location 区块中添加：

add_header X-Frame-Options "DENY";

或者：

add_header X-Frame-Options "SAMEORIGIN";

然后重启 Nginx。

3. Express (Node.js):

如果您使用的是 Express 框架，可以使用以下代码：

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

或者：

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

4. Django (Python):

在 Django 的 settings.py 文件中添加或修改以下设置：

X_FRAME_OPTIONS = 'DENY'

或者：

X_FRAME_OPTIONS = 'SAMEORIGIN'

然后，确保 django.middleware.clickjacking.XFrameOptionsMiddleware 中间件已被启用。

5. Flask (Python):

在 Flask 应用中，您可以使用以下代码：

@app.after_request def apply_caching(response): response.headers["X-Frame-Options"] = "DENY" return response

或者：

@app.after_request def apply_caching(response): response.headers["X-Frame-Options"] = "SAMEORIGIN" return response

以上是一些常见的服务器和框架的示例。