Security News
The Unpaid Backbone of Open Source: Solo Maintainers Face Increasing Security Demands
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
rehype-sanitize
Advanced tools
The rehype-sanitize package is a plugin for the rehype ecosystem that allows you to sanitize HTML. It is used to clean up and secure HTML content by removing potentially harmful elements and attributes, making it safe to use in web applications.
Basic Sanitization
This feature allows you to sanitize basic HTML content by removing potentially harmful elements like <script> tags. The example code demonstrates how to use rehype-sanitize to clean up an HTML string.
const rehype = require('rehype');
const rehypeSanitize = require('rehype-sanitize');
const html = '<div><script>alert("XSS")</script><p>Hello World</p></div>';
rehype()
.use(rehypeSanitize)
.process(html)
.then((file) => {
console.log(String(file));
});
Custom Schema
This feature allows you to use a custom schema for sanitization. The example code demonstrates how to use a GitHub-flavored schema to sanitize HTML content.
const rehype = require('rehype');
const rehypeSanitize = require('rehype-sanitize');
const schema = require('hast-util-sanitize/lib/github');
const html = '<div><script>alert("XSS")</script><p>Hello World</p></div>';
rehype()
.use(rehypeSanitize, schema)
.process(html)
.then((file) => {
console.log(String(file));
});
Customizing Allowed Elements
This feature allows you to customize the allowed elements and attributes in the HTML content. The example code demonstrates how to allow only <p>, <b>, and <i> tags and the 'className' attribute.
const rehype = require('rehype');
const rehypeSanitize = require('rehype-sanitize');
const schema = {
tagNames: ['p', 'b', 'i'],
attributes: {
'*': ['className']
}
};
const html = '<div class="container"><p class="text">Hello <b>World</b></p></div>';
rehype()
.use(rehypeSanitize, schema)
.process(html)
.then((file) => {
console.log(String(file));
});
sanitize-html is a library for cleaning up user-submitted HTML, preserving whitelisted elements and attributes while removing potentially harmful content. It offers a high degree of customization and is widely used for sanitizing HTML in web applications. Compared to rehype-sanitize, sanitize-html provides more granular control over the sanitization process and is not tied to the rehype ecosystem.
DOMPurify is a fast, tolerant, and secure client-side HTML, MathML, and SVG sanitizer. It works in all modern browsers and can be used to clean up HTML content before rendering it in the DOM. DOMPurify is known for its performance and security features, making it a popular choice for client-side sanitization. Unlike rehype-sanitize, which is a plugin for the rehype ecosystem, DOMPurify is a standalone library.
xss is a module used to filter input from users to prevent XSS attacks. It provides a set of default rules for sanitizing HTML and allows for customization of these rules. The xss library is designed to be simple and effective, making it a good choice for server-side sanitization. Compared to rehype-sanitize, xss is more focused on preventing XSS attacks and is not part of the rehype ecosystem.
rehype plugin to sanitize HTML.
This package is ESM only:
Node 12+ is needed to use it and it must be import
ed instead of require
d.
npm:
npm install rehype-sanitize
Say we have the following file, index.html
:
<div onmouseover="alert('alpha')">
<a href="jAva script:alert('bravo')">delta</a>
<img src="x" onerror="alert('charlie')">
<iframe src="javascript:alert('delta')"></iframe>
<math>
<mi xlink:href="data:x,<script>alert('echo')</script>"></mi>
</math>
</div>
<script>
require('child_process').spawn('rm', ['-r', '-f', process.env.HOME]);
</script>
And our module, example.js
, looks as follows:
import fs from 'node:fs'
import {rehype} from 'rehype'
import deepmerge from 'deepmerge'
import rehypeSanitize, {defaultSchema} from 'rehype-sanitize'
const schema = deepmerge(defaultSchema, {tagNames: ['math', 'mi']})
const buf = fs.readFileSync('index.html')
rehype()
.data('settings', {fragment: true})
.use(rehypeSanitize, schema)
.process(buf)
.then((file) => {
console.log(String(file))
})
Now, running node example
yields:
<div>
<a>delta</a>
<img src="x">
<math>
<mi></mi>
</math>
</div>
This package exports the following identifiers: defaultSchema
.
The default export is rehypeSanitize
.
unified().use(rehypeSanitize[, schema])
Remove potentially dangerous things from HTML, or more correct: keep only the safe things in a document.
schema
The sanitation schema defines how and if nodes and properties should be cleaned.
The schema is documented in hast-util-sanitize
.
The default schema is exported as defaultSchema
.
Improper use of rehype-sanitize
can open you up to a
cross-site scripting (XSS) attack.
The defaults are safe, but deviating from them is likely unsafe.
Use rehype-sanitize
after all other plugins, as other plugins are likely
also unsafe.
hast-util-sanitize
— Core utility that does the sanitationSee contributing.md
in rehypejs/.github
for ways
to get started.
See support.md
for ways to get help.
This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.
FAQs
rehype plugin to sanitize HTML
The npm package rehype-sanitize receives a total of 234,310 weekly downloads. As such, rehype-sanitize popularity was classified as popular.
We found that rehype-sanitize demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
Security News
License exceptions modify the terms of open source licenses, impacting how software can be used, modified, and distributed. Developers should be aware of the legal implications of these exceptions.
Security News
A developer is accusing Tencent of violating the GPL by modifying a Python utility and changing its license to BSD, highlighting the importance of copyleft compliance.