在 Web 开发中，安全性一直是一个非常关键的问题，其中之一就是防止 点击劫持攻击。而 npm 包 frameguard 就是用来帮助我们解决这个问题的。
frameguard 简介
frameguard 是一个基于 Express 的 Node.js 模块，它可以很方便地设置 HTTP 响应头，从而防止你的网站被其他网站所嵌套引用。通过设置 X-Frame-Options 响应头，你可以告诉浏览器是否允许在 iframe 中显示你的网页。frameguard 支持以下三种选项：
deny- 完全禁止在 iframe 中显示当前页面；sameorigin- 允许相同域名下的页面在 iframe 中显示当前页面；allow-from: uri- 允许指定 URI 的页面在 iframe 中显示当前页面。
安装和使用
首先，确保已经安装了 Node.js 和 Express。接下来，我们可以通过以下命令来安装 frameguard：
npm install --save frameguard
使用 frameguard 也非常简单，只需将其作为 Express 中间件加载，并传递选项对象即可。比如，如果你想设置 X-Frame-Options 响应头为 DENY，那么可以这样做：
const express = require('express');
const frameguard = require('frameguard');
const app = express();
app.use(frameguard({ action: 'deny' }));如果你想允许相同域名下的页面在 iframe 中显示当前页面，可以这样做：
app.use(frameguard({ action: 'sameorigin' }));如果你想允许指定 URI 的页面在 iframe 中显示当前页面，则需要将 allow-from 值设置为该 URI。比如，
app.use(frameguard({ action: 'allow-from', domain: 'https://example.com' }));示例代码
以下是一个完整的 Express 应用程序示例，其中设置了 frameguard 中间件：
-- -------------------- ---- -------
----- ------- - -------------------
----- ---------- - ----------------------
----- --- - ----------
-- -- --------------- ---- ----
-------------------- ------- ------ ----
-- ------------ ---- --
------------ ----- ---- -- -
----------
------
----------------------- -------------------
------
-------------- ---------
------- ---- ------ --- -- --------- -- -- -----------
-------
-------
---
---
-- ---------- ----
---------------- -- -- -
------------------- -- ------- -- ---- --------
---当你尝试在另一个网站中嵌套引用该页面时，会发现它无法在 iframe 中正确显示。这是因为设置了 X-Frame-Options 响应头为 DENY，所以浏览器不允许该页面在 iframe 中显示。
总结
frameguard 是一个非常有用的 npm 包，可以帮助我们防止点击劫持攻击。通过设置 X-Frame-Options 响应头，我们可以告诉浏览器是否允许在 iframe 中显示我们的网页。使用 frameguard 也非常简单，只需将其作为 Express 中间件加载，并传递选项对象即可。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/53421