Markdown-Darstellungsproblem mit Bild, das von HTML umgeben ist

Ja, ich denke, das ist wahrscheinlich die beste Option. Ich habe im Juni 2020 bereits damit begonnen, aber es erwies sich als sehr aufwendig, und ich musste mich anderen Projekten zuwenden. Ich hatte zwei Ansätze, um upload://-URLs in <img>-Tags zu ermöglichen – keiner davon ist perfekt. Aus meinen Notizen:


Implementierung 1:

Im Markdown-Pipeline die Inhalte jedes html_block analysieren (durch eine leichte Umgehung der xss.js-Bibliothek) und alle Bild-Tag mit upload://-src-Attributen verarbeiten.

Vorteile: Alles in der Markdown-Pipeline, erfolgt nur bei html_block-Tokens.

Nachteile: Die xss.js-Sanitizer wird gewissermaßen missbraucht. Sie ist möglicherweise kein perfekter HTML5-Parser.

Diese Option ließe sich verbessern, indem eine standardskonforme JavaScript-DOM-Implementierung (z. B. jsdom) auf dem Server verwendet wird, doch das scheint recht aufwendig zu sein.

Implementierung 2:

Erlaube upload://-src-Attribute durchgehend in der Markdown-Pipeline und ersetze sie später. Auf der Client-Seite ist dies tatsächlich recht einfach – wir ersetzen upload://-URLs bereits asynchron nach dem „Cooking“. Auf der Server-Seite wird dabei ein zusätzlicher Verarbeitungsschritt mit Nokogiri durchgeführt.

Vorteile: Der Parser ist HTML5-konform.

Nachteile: Unterschiedliche Implementierung auf Client- und Server-Seite, macht die Pipeline etwas komplexer.


Ich denke, Option 2 ist wahrscheinlich der richtige Weg. Anschließend müssen wir den pull_hotlinked_images-Job aktualisieren, um <img>-Tags beizubehalten, ohne sie durch Markdown zu ersetzen. Ich hoffe, ich finde bald wieder Zeit, mich diesem Thema wieder zu widmen :crossed_fingers:

4 „Gefällt mir“