Jérémy Munsch
108e26f9c0
- Introduced DOMPurify for sanitizing HTML inputs. - Added `sanitizeRichHtml` and `toSanitizedHtml` functions for safe HTML rendering. - Updated various components to use the new sanitization methods to prevent XSS attacks.
92 lines
1.3 KiB
TypeScript
92 lines
1.3 KiB
TypeScript
import DOMPurify from "dompurify";
|
|
|
|
const TIPTAP_ALLOWED_TAGS = [
|
|
"a",
|
|
"article",
|
|
"aside",
|
|
"blockquote",
|
|
"br",
|
|
"div",
|
|
"em",
|
|
"figcaption",
|
|
"figure",
|
|
"footer",
|
|
"h1",
|
|
"h2",
|
|
"h3",
|
|
"h4",
|
|
"h5",
|
|
"h6",
|
|
"header",
|
|
"hr",
|
|
"i",
|
|
"iframe",
|
|
"img",
|
|
"li",
|
|
"mark",
|
|
"nav",
|
|
"oembed",
|
|
"ol",
|
|
"p",
|
|
"section",
|
|
"span",
|
|
"strong",
|
|
"sub",
|
|
"sup",
|
|
"table",
|
|
"tbody",
|
|
"td",
|
|
"th",
|
|
"thead",
|
|
"tr",
|
|
"u",
|
|
"ul",
|
|
"var",
|
|
"video",
|
|
"source",
|
|
] as const;
|
|
|
|
const TIPTAP_ALLOWED_ATTR = [
|
|
"align",
|
|
"alt",
|
|
"allowfullscreen",
|
|
"border",
|
|
"cellpadding",
|
|
"cellspacing",
|
|
"class",
|
|
"colspan",
|
|
"controls",
|
|
"data-model",
|
|
"data-type",
|
|
"datetime",
|
|
"frameborder",
|
|
"height",
|
|
"href",
|
|
"poster",
|
|
"preload",
|
|
"rel",
|
|
"rowspan",
|
|
"scope",
|
|
"src",
|
|
"style",
|
|
"target",
|
|
"title",
|
|
"type",
|
|
"url",
|
|
"valign",
|
|
"width",
|
|
] as const;
|
|
|
|
const SANITIZE_OPTIONS = {
|
|
ALLOWED_TAGS: [...TIPTAP_ALLOWED_TAGS],
|
|
ALLOWED_ATTR: [...TIPTAP_ALLOWED_ATTR],
|
|
FORBID_TAGS: ["script", "style"],
|
|
ALLOW_UNKNOWN_PROTOCOLS: false,
|
|
};
|
|
|
|
export const sanitizeRichHtml = (html: string): string =>
|
|
DOMPurify.sanitize(html, SANITIZE_OPTIONS);
|
|
|
|
export const toSanitizedHtml = (html: string): { __html: string } => ({
|
|
__html: sanitizeRichHtml(html),
|
|
});
|