Markdown vers HTML

Collez du Markdown et obtenez du HTML conforme aux normes instantanément, avec des bascules pour la liaison automatique, la typographie intelligente, les sauts de ligne durs et le passage du HTML brut.

Markdown en entrée, HTML conforme aux normes en sortie. Tout se convertit pendant que vous tapez. Les quatre bascules modifient le comportement de l'analyseur, et l'aperçu ci-dessous montre le résultat rendu pour vérifier le balisage et la sortie en même temps.

Options de l'analyseur

Aperçu

Markdown, CommonMark et les variantes intermédiaires

Pourquoi deux analyseurs ne sont pas d'accord sur votre document

Markdown a été publié en 2004 sous la forme d'un script Perl et d'une page de prose, sans grammaire formelle. C'est cette informalité qui l'a fait se répandre, et aussi la raison pour laquelle le même document est rendu différemment selon les outils. L'implémentation d'origine a laissé des dizaines de cas indéfinis : ce qu'un marqueur de liste fait lorsqu'il est indenté de trois espaces, comment l'emphase s'imbrique dans un mot, si un titre a besoin d'une ligne vide avant lui. Chaque implémenteur a comblé ces manques en devinant, et ils ont deviné différemment.

CommonMark existe pour combler cet écart. C'est une spécification précise avec plusieurs centaines de tests de conformité couvrant exactement les cas ambigus que l'original a laissés ouverts. Ce convertisseur utilise markdown-it, qui passe la suite CommonMark complète, si bien que la sortie correspond à ce que produisent GitHub, Reddit, Discourse et la plupart des outils modernes. Si un document est rendu ici, il le sera de la même façon là-bas.

GitHub Flavored Markdown est un sur-ensemble superposé : tableaux, barré, listes de tâches et URL à liaison automatique. Les tableaux et les listes de tâches fonctionnent dans cet outil, voilà pourquoi le document d'exemple les inclut tous les deux. La distinction compte lorsque vous écrivez pour une cible que vous ne contrôlez pas, car un tableau ne fait pas partie du CommonMark proprement dit et un analyseur strict le fera passer en texte brut.

Ce que changent réellement les quatre bascules

La liaison automatique transforme une URL nue en ancre. C'est pratique pour les notes de version et les notes, mais c'est un écart par rapport au CommonMark, qui exige des crochets autour d'un lien nu. Désactivez-la si la sortie doit être portable vers un analyseur strict.

La typographie intelligente réécrit les guillemets droits en guillemets courbes et convertit -- en tiret demi-cadratin. C'est approprié pour la prose et inapproprié pour tout ce qui contient des fragments de code hors d'un bloc de code, car elle s'attaquera volontiers à un drapeau de ligne de commande. Les spans de code et les blocs clôturés sont toujours laissés intacts.

Les sauts de ligne durs changent le sens d'un saut de ligne unique. Par défaut, Markdown joint les lignes consécutives en un seul paragraphe, ce que suppose la plupart des documents. Une saisie de style discussion où l'on appuie sur Entrée pour une nouvelle ligne a besoin de cette option, sinon sa mise en forme s'effondre.

Le passage du HTML brut est celui qui a des conséquences pour la sécurité. Désactivé, un <img onerror=...> de la source est échappé et affiché comme du texte. Activé, il est émis comme balisage vivant. Laissez-le désactivé pour tout ce qui est soumis par un utilisateur.

L'assainissement est un travail distinct

L'erreur la plus courante avec tout pipeline Markdown est de supposer que le convertisseur vous protège. Il ne le fait pas, et il n'est pas censé le faire. Même avec le HTML brut désactivé, une cible de lien reste contrôlée par l'attaquant, si bien que [click](javascript:alert(1)) produit une ancre qu'un navigateur peut honorer. La syntaxe Markdown à elle seule suffit à construire une attaque fonctionnelle.

Le bon modèle est convertir, puis assainir, puis insérer. Faites passer le HTML par un assainisseur dédié comme DOMPurify avec une liste autorisée de balises et d'attributs, et seulement alors placez-le dans la page. Faites-le sur le serveur si le contenu doit être montré à quelqu'un d'autre que son auteur, car un assainissement côté client peut être contourné par quiconque peut parler directement à votre API. Cet outil rend son aperçu localement dans votre propre navigateur avec votre propre saisie, ce qui est un modèle de menace différent de la publication du Markdown de quelqu'un d'autre.

Note open-source : le rendu est propulsé par markdown-it, publié sous licence MIT.

FAQ

Quel dialecte Markdown cet outil suit-il ?
CommonMark, plus les extensions GitHub que markdown-it active par défaut comme les tableaux et les listes de tâches. Il passe la suite de conformité CommonMark complète, si bien que la sortie correspond à GitHub, Discourse et à la plupart des moteurs de rendu modernes.
Le HTML généré est-il sûr à publier directement ?
Non. Faites-le toujours passer par un assainisseur comme DOMPurify avant de l'insérer dans une page, surtout pour un contenu que vous n'avez pas écrit. Même avec le HTML brut désactivé, les cibles de lien restent contrôlées par l'attaquant et une URL javascript: peut passer.
Pourquoi mes sauts de ligne simples ont-ils disparu ?
Le Markdown standard joint les lignes consécutives en un seul paragraphe ; un saut de ligne dur exige deux espaces de fin ou une ligne vide. Activez la bascule du saut de ligne unique si votre source est un texte de style discussion où chaque Entrée doit devenir un saut de ligne.
Puis-je coller du HTML dans le côté Markdown ?
Oui, si vous activez l'option de HTML brut. Sinon les balises sont échappées et affichées comme du texte littéral, ce qui est le comportement par défaut sûr. Mélanger du HTML brut dans du Markdown est valide, mais les blocs doivent être séparés par des lignes vides pour être analysés comme prévu.
Mon contenu est-il téléversé quelque part ?
Non. markdown-it s'exécute entièrement dans votre navigateur et la page n'effectue aucune requête réseau avec votre texte. Vous pouvez charger la page, passer hors ligne et continuer à convertir.
Pourquoi la typographie intelligente casse-t-elle mon code ?
Elle réécrit les guillemets et les tirets dans la prose, si bien qu'un drapeau comme --dry-run écrit hors d'un span de code devient un tiret demi-cadratin. Entourez les fragments de code d'accents graves ; l'analyseur n'applique jamais de substitution typographique à l'intérieur des spans de code ou des blocs clôturés.