Implementation:FlowiseAI Flowise SafeHTML

Knowledge Sources	FlowiseAI Flowise
Domains	UI Components, Security
Last Updated	2026-02-12 07:00 GMT

Overview

The SafeHTML component sanitizes untrusted HTML content using DOMPurify before rendering it, preventing XSS attacks while preserving safe formatting elements.

Description

SafeHTML accepts an HTML string and passes it through DOMPurify.sanitize with a configurable allowlist of tags and attributes. By default, it permits common formatting tags (p, br, strong, em, headings, lists, blockquote, pre, code, a, img, table elements, div, span) and safe attributes (href, title, alt, src, class, id, style). It explicitly forbids dangerous elements (script, object, embed, form, input) and event handler attributes (onerror, onload, onclick, onmouseover), and disables data attributes. The sanitized output is rendered via React's dangerouslySetInnerHTML. Both the allowed tags and allowed attributes lists can be overridden via props.

Usage

Use this component whenever user-generated or AI-generated HTML content needs to be rendered in the UI safely, such as in chat responses, rich text previews, or content displays.

Code Reference

Source Location

• Repository: FlowiseAI Flowise
• File: packages/ui/src/ui-component/safe/SafeHTML.jsx
• Lines: 1-58

Signature

export const SafeHTML = ({ html, allowedTags, allowedAttributes, ...props }) => {
    // ...
}

Import

import { SafeHTML } from '@/ui-component/safe/SafeHTML'

I/O Contract

Inputs

Name	Type	Required	Description
html	string	Yes	The raw HTML string to sanitize and render
allowedTags	array of strings	No	Override the default list of permitted HTML tags
allowedAttributes	array of strings	No	Override the default list of permitted HTML attributes
...props	any	No	Additional props spread onto the wrapping div element

Outputs

Name	Type	Description
Rendered JSX	React element	A div containing the DOMPurify-sanitized HTML content

Usage Examples

Basic Usage

<SafeHTML
    html='<p>Hello <strong>world</strong>!</p><script>alert("xss")</script>'
    style={{ padding: '16px' }}
/>
// Renders: <div><p>Hello <strong>world</strong>!</p></div>
// The <script> tag is stripped by DOMPurify

Related Pages

• Principle:FlowiseAI_Flowise_Chatflow_Security_Configuration