Sanitize

Sanitize est un assainisseur HTML et CSS basé sur une liste d'autorisation. Il supprime tout le HTML et/ou le CSS d'une chaîne, à l'exception des éléments, attributs et propriétés que vous choisissez d'autoriser.

Grâce à une syntaxe de configuration simple, vous pouvez indiquer à Sanitize d'autoriser certains éléments HTML, certains attributs au sein de ces éléments, et même certains protocoles d'URL dans les attributs contenant des URL. Vous pouvez également autoriser des propriétés CSS spécifiques, des règles @ et des protocoles d'URL dans les éléments ou attributs contenant du CSS. Tout HTML ou CSS que vous n'autorisez pas explicitement sera supprimé.

Sanitize s'appuie sur le parseur HTML5 Nokogiri, qui analyse le HTML de la même manière que les navigateurs modernes, et sur Crass, qui analyse le CSS de la même manière que les navigateurs modernes. Tant que votre configuration de liste d'autorisation n'autorise que du balisage et du CSS sûrs, même l'entrée la plus malformée ou malveillante sera transformée en sortie sûre.

[!WARNING]

Sanitize ne peut pas assainir complètement le contenu des éléments <math> ou <svg>. Les éléments MathML et SVG sont des éléments étrangers qui ne suivent pas les règles d'analyse HTML normales.

Par défaut, Sanitize supprime tous les éléments MathML et SVG. Si vous ajoutez des éléments MathML ou SVG à une liste d'autorisation d'éléments personnalisée, vous risquez de créer une vulnérabilité de sécurité dans votre application.

Liens

Installation

gem install sanitize

Démarrage rapide

require 'sanitize'

# Clean up an HTML fragment using Sanitize's permissive but safe Relaxed config.
# This also sanitizes any CSS in `<style>` elements or `style` attributes.
Sanitize.fragment(html, Sanitize::Config::RELAXED)

# Clean up an HTML document using the Relaxed config.
Sanitize.document(html, Sanitize::Config::RELAXED)

# Clean up a standalone CSS stylesheet using the Relaxed config.
Sanitize::CSS.stylesheet(css, Sanitize::Config::RELAXED)

# Clean up some CSS properties using the Relaxed config.
Sanitize::CSS.properties(css, Sanitize::Config::RELAXED)

Utilisation

Sanitize peut assainir les types d'entrée suivants :

Fragments HTML
Documents HTML
Feuilles de style CSS à l'intérieur d'éléments HTML <style>
Propriétés CSS à l'intérieur d'attributs HTML style
Feuilles de style CSS autonomes
Propriétés CSS autonomes

[!WARNING]

Sanitize ne peut pas assainir complètement le contenu des éléments <math> ou <svg>. Les éléments MathML et SVG sont des éléments étrangers qui ne suivent pas les règles d'analyse HTML normales.

Par défaut, Sanitize supprimera tous les éléments MathML et SVG. Si vous ajoutez des éléments MathML ou SVG à une liste d'autorisation d'éléments personnalisée, vous risquez de créer une vulnérabilité de sécurité dans votre application.

Fragments HTML

Un fragment est un extrait de HTML qui ne contient pas d'élément <html> au niveau racine.

Si vous ne spécifiez aucune option de configuration, Sanitize utilisera ses paramètres les plus stricts par défaut, ce qui signifie qu'il supprimera tout le HTML et ne laissera que du texte sûr.

html = '<b><a href="http://foo.com/">foo</a></b><img src="https://raw.githubusercontent.com/rgrove/sanitize/main/bar.jpg">'
Sanitize.fragment(html)
# => "foo"

Pour conserver certains éléments, ajoutez-les à la liste d'autorisation des éléments.

Sanitize.fragment(html, elements: ['b'])
# => "<b>foo</b>"

Documents HTML

Lors de la désinfection d'un document, l'élément <html> doit figurer dans la liste autorisée. Vous pouvez également définir :allow_doctype sur true pour autoriser les définitions de type de document bien formées.

html = %[
  <!DOCTYPE html>
  <html>
    <b><a href="http://foo.com/">foo</a></b><img src="https://raw.githubusercontent.com/rgrove/sanitize/main/bar.jpg">
  </html>
]

Sanitize.document(html,
  allow_doctype: true,
  elements: ['html']
)
# => "<!DOCTYPE html><html>foo\n  \n</html>"

CSS dans HTML

Pour assainir le CSS dans un fragment ou un document HTML, autorisez d'abord l'élément <style> et/ou l'attribut style. Ensuite, autorisez les propriétés CSS, les règles @ et les protocoles d'URL que vous souhaitez autoriser. Vous pouvez également choisir d'autoriser les commentaires CSS ou les contournements de compatibilité des navigateurs.

html = %[
  <style>
    div { color: green; width: 1024px; }
  </style>

  <div style="height: 100px; width: 100px;"></div>
  <p>hello!</p>
]

Sanitize.fragment(html,
  elements: ['div', 'style'],
  attributes: {'div' => ['style']},

  css: {
    properties: ['width']
  }
)
#=> %[
#   <style>
#     div {  width: 1024px; }
#   </style>
#
#   <div style=" width: 100px;"></div>
#   hello!
# ]

CSS autonome

Sanitize nettoiera volontiers une feuille de style CSS autonome ou une chaîne de propriétés sans avoir besoin d'invoquer le parseur HTML.

[!WARNING] Cela ne doit être utilisé que pour assainir du CSS destiné à un fichier CSS autonome. Pour assainir en toute sécurité du CSS destiné à un contexte HTML, comme dans un élément <style> ou un attribut style, vous devez utiliser Sanitize.document() ou Sanitize.fragment() avec une liste d'autorisation appropriée, comme décrit dans les sections précédentes. Le non-respect de cette consigne peut permettre des attaques par injection HTML.

css = %[
  @import url(evil.css);

  a { text-decoration: none; }

  a:hover {
    left: expression(alert('xss!'));
    text-decoration: underline;
  }
]

Sanitize::CSS.stylesheet(css, Sanitize::Config::RELAXED)
# => %[
#
#
#   a { text-decoration: none; }
#
#   a:hover {
#
#     text-decoration: underline;
#   }
# ]

Sanitize::CSS.properties(%[
  left: expression(alert('xss!'));
  text-decoration: underline;
], Sanitize::Config::RELAXED)
# => %[
#
#   text-decoration: underline;
# ]

Configuration

En plus des paramètres par défaut ultra-sûrs, Sanitize est livré avec trois autres configurations intégrées que vous pouvez utiliser telles quelles ou adapter à vos besoins.

Sanitize::Config::RESTRICTED

N'autorise qu'un balisage en ligne très simple. Aucun lien, image ou élément de bloc.

Sanitize.fragment(html, Sanitize::Config::RESTRICTED)
# => "<b>foo</b>"

Sanitize::Config::BASIC

Autorise une variété de balisage, y compris les éléments de mise en forme, les liens et les listes.

Les images et les tableaux ne sont pas autorisés, les liens sont limités aux protocoles FTP, HTTP, HTTPS et mailto, et un attribut rel="nofollow" est ajouté à tous les liens afin d'atténuer le spam SEO.

Sanitize.fragment(html, Sanitize::Config::BASIC)
# => '<b><a href="http://foo.com/" rel="nofollow">foo</a></b>'

Sanitize::Config::RELAXED

Autorise une variété encore plus large de balisage, y compris les images et les tableaux, ainsi que du CSS sûr. Les liens restent limités aux protocoles FTP, HTTP, HTTPS et mailto, tandis que les images sont limitées à HTTP et HTTPS. Dans ce mode, rel="nofollow" n'est pas ajouté aux liens.

sanitize

Populaires