Registry / http-networking / x-frame-options

x-frame-options

JSON →
library1.0.0jsnpmunverified

The `x-frame-options` package provides a simple Express middleware to set the `X-Frame-Options` HTTP response header, a security mechanism designed to prevent clickjacking attacks by controlling whether a page can be rendered within `<iframe>`, `<frame>`, `<embed>`, or `<object>` elements. Currently at version 1.0.0, the package was last published over a decade ago. While still functional, the `X-Frame-Options` header itself is considered a legacy solution in modern web development. For comprehensive and more granular protection against framing-based attacks, the `frame-ancestors` directive within Content Security Policy (CSP) is the recommended approach. This package is typically used for supporting older browsers that might not fully support CSP, often in conjunction with CSP `frame-ancestors` to ensure broad compatibility. The middleware defaults the `X-Frame-Options` header value to 'Deny', offering the strongest initial protection.

http-networkingauth-security
npm install x-frame-options
package ↗
INSTALL
IMPORT
SIG · X-FRAME-OPTIONS
X
x-frame-options
http-networkingjavascriptv1.0.0
Install
—
Import
—
Disk
—
Pass rate
0/ 6
Env Coverage0 / 6
glibc
18–22
musl
18–22
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18–226 runs
build_error
glibc
node 18–226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

xFrameOptions
✓ import xFrameOptions from 'x-frame-options';
✗ const xFrameOptions = require('x-frame-options');
The original package uses CommonJS `require`. While modern Node.js supports ESM, this package might not be explicitly set up for direct ESM imports without a transpiler or a default import workaround for older ESM environments.

Demonstrates how to integrate the `x-frame-options` middleware into an Express application, showing both default ('DENY') and 'SAMEORIGIN' configurations, and how to verify the header is set.

const express = require('express'); const xFrameOptions = require('x-frame-options'); const app = express(); // Use the middleware to add X-Frame-Options header (defaults to 'DENY') app.use(xFrameOptions()); // Or configure it with 'SAMEORIGIN' // app.use(xFrameOptions('SAMEORIGIN')); app.get('/', (req, res) => { res.send('Hello World! This page has X-Frame-Options set.'); }); app.get('/test-header', (req, res) => { const xfoHeader = res.get('X-Frame-Options'); res.send(`X-Frame-Options header value: ${xfoHeader || 'Not Set'}`); }); const port = 3000; app.listen(port, () => { console.log(`Express app listening at http://localhost:${port}`); });
Debug
Known issues
deprecatedThe `X-Frame-Options` header itself is considered a legacy security header. Modern web applications should primarily rely on the `frame-ancestors` directive within the Content Security Policy (CSP) for comprehensive clickjacking protection, as it offers more granular control and is the current best practice.
fix
Prioritize `Content-Security-Policy` with the `frame-ancestors` directive. Consider using `X-Frame-Options` only as a fallback for very old browsers, and ensure consistent policies across both headers. For Express, use a more comprehensive security middleware like `helmet` which includes `frameguard` for managing `X-Frame-Options` alongside other headers.
affects: >=1.0.0
breakingThe `ALLOW-FROM` directive for `X-Frame-Options` is deprecated and has inconsistent browser support across modern browsers. Browsers that do not recognize `ALLOW-FROM` will silently ignore the entire `X-Frame-Options` header, leaving your site unprotected.
fix
Avoid using `ALLOW-FROM`. If you need to allow framing from specific external origins, use the `frame-ancestors` directive in your Content Security Policy (CSP) instead, which supports multiple origins and wildcards.
affects: >=1.0.0
gotchaThe `X-Frame-Options` header cannot be set via `<meta>` tags in HTML; it must be delivered as an HTTP response header by the server. Attempts to set it via meta tags will be ignored by browsers.
fix
Always configure `X-Frame-Options` (or `Content-Security-Policy`) as an HTTP response header on your server (e.g., using this middleware in Express, or server configurations in Nginx/Apache).
affects: >=1.0.0
gotchaIf both `X-Frame-Options` and `Content-Security-Policy` with `frame-ancestors` are present, modern browsers will prioritize the `frame-ancestors` directive. Ensure that the policies defined by both headers are consistent to avoid unexpected blocking or reduced protection.
fix
Always set matching policies for `X-Frame-Options` and `CSP frame-ancestors` if you choose to implement both. For example, `X-Frame-Options: DENY` should correspond to `Content-Security-Policy: frame-ancestors 'none'`.
affects: >=1.0.0
Errors
Common errors & fixes
Refused to display 'https://example.com/sensitive-page' in a frame because it set 'X-Frame-Options' to 'DENY'.
The `x-frame-options` middleware (or another mechanism) has set the `X-Frame-Options` header to 'DENY', explicitly preventing the page from being embedded in any iframe.
fix
If the embedding is intentional and secure, modify the `x-frame-options` middleware to use `SAMEORIGIN` (if the embedding page is on the same origin) or, preferably, migrate to `Content-Security-Policy: frame-ancestors 'self'` or specify trusted origins for `frame-ancestors`.
Refused to display 'https://example.com/page' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
The page is attempting to be embedded in an iframe from a different origin, but the `X-Frame-Options` header is set to 'SAMEORIGIN'.
fix
Ensure the embedding page is served from the exact same origin (protocol, domain, port). If cross-origin embedding is required, you must move to `Content-Security-Policy` with a flexible `frame-ancestors` directive to whitelist allowed origins, as `X-Frame-Options` 'ALLOW-FROM' is deprecated and unreliable.
Upgrade
Version history
1.0.0latest on npm
Audit
Dependencies
expressrequiredThis is an Express middleware; it integrates with and requires an Express application.
Agent activity
34 hits · last 30 days
node
28
OpenAI (training)
1
Resources
packagehttps://www.npmjs.com/package/x-frame-options ↗
x-frame-options — npm install x-frame-options · libregistry