Problema de renderizado de Markdown con imagen rodeada por HTML

Sí, si te adentraras totalmente en esa dirección, tendrías que renunciar a la capacidad de editar contenido en Discourse a cambio de una integridad HTML completa.

Estaba pensando que podría haber algún punto intermedio donde solo apliques este enfoque a las etiquetas img en publicaciones HTML importadas.

Pero ahora estoy dudando. Hacer esto de forma selectiva requeriría cambios en muchas partes del procesamiento de publicaciones.

2 Me gusta

Sí, creo que esta es probablemente la mejor opción. Empecé a trabajar en esto en junio de 2020, pero terminó siendo mucho trabajo y tuve que pasar a otros proyectos. Tenía un par de enfoques para permitir URLs upload:// en las etiquetas <img… ninguno es perfecto. Según mis notas:


Implementación 1:

En la tubería de markdown, analizar el contenido de cada html_block (abusando ligeramente de la librería xss.js) y procesar cualquier etiqueta de imagen con atributos src upload://.

Pros: todo está en la tubería de markdown, solo realiza este procesamiento en los tokens html_block

Contras: es un uso un tanto incorrecto del sanitizador xss.js. Podría no ser un analizador HTML5 perfecto

Esta opción podría mejorarse utilizando una implementación de DOM en JavaScript compatible con los estándares (por ejemplo, jsdom) en el servidor, pero eso parece bastante pesado.

Implementación 2:

Permitir atributos src upload:// a lo largo de toda la tubería de markdown y luego reemplazarlos más tarde. En el cliente, esto es realmente bastante simple: ya estábamos reemplazando las URLs upload:// de forma asíncrona después de la cocción. En el servidor, esto realiza un paso de procesamiento adicional usando Nokogiri.

Pros: el analizador es compatible con los estándares HTML5

Contras: implementación diferente en cliente/servidor, hace que la tubería sea ligeramente más compleja


Creo que la opción 2 es probablemente la mejor. Luego tendremos que actualizar el trabajo pull_hotlinked_images para mantener las etiquetas <img, sin reemplazarlas con Markdown. Espero poder encontrar tiempo para volver a esto pronto :crossed_fingers:

4 Me gusta

Realmente no entiendo la complicación aquí. Claramente, la etiqueta HTML de imagen se está reemplazando por markdown, por ejemplo: ![](upload://6zqK52dO23i1JsYH2oyMU12U2ro.jpeg). ¿Por qué no simplemente hacer que incluya dos saltos de línea antes del !? Eso haría que se renderice correctamente y permitiría que la función de carga de imágenes funcione para evitar imágenes rotas y problemas entre sitios.

¿Existe una situación real, no teórica, donde ese espacio en blanco podría causar un problema? ¿Ese problema es peor que el estado actual del plugin, donde “las imágenes simplemente están rotas todo el tiempo”?

@david, señalas que “la solución del salto de línea probablemente no se implementará” porque “lo clave para nosotros es mantener la integridad del contenido”. Pero el contenido ya se modifica al insertar las etiquetas en primer lugar. No… realmente no entiendo cómo esto podría ser de alguna manera mejor.

En este momento, cada vez que alguien incluye una imagen en su publicación de WordPress, las imágenes vuelven rotas, y con frecuencia tengo que lidiar con comentarios de “las imágenes están rotas”, a los que ahora a menudo siguen respuestas como “sí, es porque Discourse es terrible”. Me gustaría evitar ambas cosas.

Entiendo que la configuración de “no descargar imágenes” podría ser una solución temporal, pero en realidad quiero que las imágenes se descarguen, así que espero que eso pueda ser solo una solución provisional.

1 me gusta

Esto debería resolverse con:

Probemos aquí en Meta.

<div>
Imagen en un bloque HTML:
<img src="..." width=100 height=100>
</div>
Imagen en un bloque HTML:
6 Me gusta

Este tema se cerró automáticamente después de 5 días. Ya no se permiten nuevas respuestas.