Lowdefy
v3.17.2/display/DangerousHtml/

DangerousHtml

A block to render HTML with the ability to customize the DOMPurify's options.

The DangerousHtml block sanitizes HTML using DOMPurify's with the ability to customize the sanitization options. This comes with some security considerations, please consider DOMPurify's Security Goals and Threat Model for more details regarding the security impact of using the DangerousHtml block.

In short, it is strongly advised to never render any user input DangerousHtml content, only render hardcoded or trusted HTML content.

id: block_id
type: DangerousHtml
properties:
  html: <a href="https://lowdefy.com">Lowdefy Website</a>
properties:
Customize DOMPurify options. Options are only applied when the block is mounted, thus any parsed settings is only applied at first render.
Content to be rendered as Html.
Css style object to apply to Html div.
Basic DangerousHtml

A simple white title box

id: basic_example
type: DangerousHtml
properties:
  html: &gt;
    &lt;div style=&quot;background: #123456; padding: 10px;&quot;&gt;&lt;h1 style=&quot;color: white;&quot;&gt;A
    simple white title box&lt;/h1&gt;&lt;/div&gt;
DangerousHtml with iframes sanitized
The iframe was removed: - title: DangerousHtml with iframes enabled 
id: sanitized_iframes_example
type: DangerousHtml
properties:
  html: &gt;
    The iframe was removed: &lt;iframe style=&quot;max-width: 512px;&quot; width=&quot;100%&quot;
    src=&quot;https://www.youtube.com/embed/7N7GWdlQJlU&quot; frameborder=&quot;0&quot; 
    allow=&quot;accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope;
    picture-in-picture&quot; allowfullscreen&gt;&lt;/iframe&gt;      - title: DangerousHtml
    with iframes enabled
DangerousHtml with iframes not sanitized
The iframe was not removed: 
id: iframes_example
type: DangerousHtml
properties:
  DOMPurifyOptions:
    ADD_TAGS:
      - iframe
  html: &gt;
    The iframe was not removed: &lt;iframe style=&quot;max-width: 512px;&quot; width=&quot;100%&quot;
    src=&quot;https://www.youtube.com/embed/7N7GWdlQJlU&quot; frameborder=&quot;0&quot; 
    allow=&quot;accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope;
    picture-in-picture&quot; allowfullscreen&gt;&lt;/iframe&gt;
DangerousHtml basic sanitization
A little bit of bad html sanitized.
id: sanitized_example
type: DangerousHtml
properties:
  html: &gt;
    &lt;div style=&quot;color: red; border: 2px dashed blue; padding:
    10px;&quot;&gt;&lt;script&gt;alert(&quot;hello world&quot;)&lt;/script&gt;&lt;img src=x onerror=alert(&quot;img&quot;)
    /&gt;A little bit of bad html sanitized.&lt;/div&gt;


type: object
properties:
  properties:
    additionalProperties: false
    properties:
      DOMPurifyOptions:
        description: >-
          Customize DOMPurify options. Options are only applied when the block is
          mounted, thus any parsed settings is only applied at first render.
        type: object
      html:
        description: Content to be rendered as Html.
        type: string
      style:
        description: Css style object to apply to Html div.
        type: object
    type: object