Back to Snippets

encodeHTML*()

Functions to encode untrusted strings using HTML entities, for insertion in some HTML contexts under certain circumstances.

Warning: Failing to encode untrusted strings, or encoding them with a function that's inappropriate or insufficient for a given output context, can introduce a cross-site scripting (XSS) vulnerability in the web page. Managing untrusted data by hand requires vigilance, supplemented by automated checks.

Before using these functions, familiarize yourself with the contexts in which using them is sufficient protection. At a minimum, go through OWASP's Cross Site Scripting Prevention Cheat Sheet and DOM based XSS prevention cheat sheet to learn the nuances of outputting to HTML content, HTML attributes, and any attributes requiring additional handling (<a href='…'>, <img src='…'>, and others).

/*
Converts characters relevant to HTML content
into their equivalent HTML entities.
*/

function encodeHTMLContent(str) {
const replacements = {
'&': '&amp;',
'<': '&lt;',
'>': '&gt;',
'"': '&quot;',
"'": '&#x27;',
'/': '&#x2F;'
};
return str.replace(/[&<>"'/]/g, ch => replacements[ch]);
}

/*
Converts any ASCII character that's not alphanumeric
into its equivalent HTML entity of the form `&#xHH;`.
*/

function encodeHTMLAttribute(str) {
return str.replace(
/[\x00-\x2F\x3A-\x40\x5B-\x60\x7B-\xFF]/g,
ch => `&#x${ch.charCodeAt(0).toString(16)};`
);
}