es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Cómo escapar etiquetas HTML en NextJS

19 Jul, 2023 Programación

Tengo un backend en Django y un frontend en Nextjs.

Cuando intento renderizar el código content = models.TextField() desde mi backend en Django hacia el frontend en Nextjs <p>{data.content}</p>, obtengo lo siguiente como resultado:

<p>first&nbsp;first&nbs</p>

Utilizo django_summernote como editor. Django tiene un método seguro | safe, que escapa la representación de HTML, pero no sé qué usar para NextJS. Cualquier ayuda es apreciada.

Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para evitar que el código HTML se renderice como texto en NextJS, puedes utilizar la propiedad dangerouslySetInnerHTML en la etiqueta HTML. Esta propiedad se utiliza para establecer directamente HTML como una cadena de texto, y se llama “peligrosamente” porque puede representar un riesgo de ataques de scripting entre sitios (XSS) si la entrada proviene de fuentes no confiables.

    Para usarla en tu caso, puedes modificar tu código de la siguiente manera:

    <div dangerouslysetinnerhtml="{{" __html:="" data.content="" }}=""></div>

    Esto renderizará el código HTML de data.content como HTML, sin escaparlo como texto.

    Ten en cuenta que solo debes usar dangerouslySetInnerHTML si estás seguro de que la fuente HTML es segura y confiable, y que la has desinfectado correctamente para evitar ataques XSS.

Comments are closed.