¿Es mejor devolver HTML directamente para una respuesta Ajax?

Question

Estoy empezando a hacer algunos JS/HTML/CSS. Al mirar a su alrededor, parece que no es inusual devolver HTML desde el back-end (por ejemplo, una respuesta Ajax) y mostrarlo directamente (por ejemplo, asignándolo al innerHTML de un elemento). Por ejemplo, creo que el método jQuery load() básicamente es un atajo para hacer esto.

Tomar el enfoque me preocupa por un par de razones, pero no estoy seguro si es solo que no estoy familiarizado con los enfoques y modismos en estas áreas y estoy detrás de los tiempos o si estos son legítimos preocupaciones Mis preocupaciones específicamente son:

1) Parece inseguro asignar directamente HTML a un elemento. O, como mínimo, peligroso al menos si existe la posibilidad de que haya contenido de usuario (o incluso contenido de terceros).

2) El envío de información de presentación (HTML) parece directamente que podría conducir a una mezcla de presentación/modelo que es mejor evitar. Por supuesto, sería posible tener estos limpiamente separados en el back-end y aún así devolver HTML, pero en los pocos proyectos que he visto, ese no ha sido el caso.

Entonces, mi pregunta es, ¿devolver HTML una forma legítima de respuesta HTTP en una aplicación Ajax o es mejor evitarlo?

Answer 1

Creo que depende del caso de uso para ser honesto. El cliente debe pagar una multa bastante fuerte si tiene que construir una gran cantidad de HTML en base a algunos datos JSON o XML.

Personalmente utilizo una mezcla de ambos: si solo se trata de un pequeño dato (un entero o una cadena pequeña), usaré JSON o incluso solo los datos sin procesar.

Si se trata de un complejo conjunto de datos (por ejemplo, un montón de comentarios de los usuarios) que voy a tener que formatear en el lado del cliente, entonces enviaré el html y guardaré el trabajo del cliente.

Personalmente, no me preocuparía la seguridad, al menos no que los usuarios inyecten HTML malicioso; debería tratar con eso cuando se envíe de todos modos.

Editar: Existe una excepción a esto: cuando el ancho de banda es una preocupación (web móvil, por ejemplo), enviar casi la menor cantidad de datos a través del cable es casi siempre lo mejor.

Answer 2

No veo la manera correcta o incorrecta de hacerlo, depende de la cantidad de datos que está enviando y de la rapidez con que desea que se muestren. Insertar HTML directamente es más rápido que crear elementos de JSON o XML. XSS no debería ser un problema porque debería estar escapando de los datos del usuario independientemente del formato en que lo envíe.

Si echa un vistazo a Facebook, todas las respuestas XHR (por lo que vi, solo comencé a buscar cuando vi tu pregunta :) son algo así como:

for (;;);{"__ar":1,"payload":"\u003cdiv class=\"ego_column\">\u003cdiv 
class=\"ego_section\">\u003cdiv class=\"uiHeader uiHeaderTopAndBottomBorder 
mbs uiSideHeader\">\u003cdiv class=\"clearfix uiHeaderTop\">\u003ca 
class=\"uiHeaderActions rfloat\" href=\"http:\/\/www.facebook.com\/campaign\ 
/landing.php?placement=advf2&campaign_id=368901427978&extra_1=auto\"> 
Create an Ad\u003c\/a>\u003cdiv>\u003ch4 class=\"uiHeaderTitle\">Sponsored 
\u003c\/h4> [...]" } 

su contenido AJAX es pesado, por lo que probablemente vale la pena para ellos para enviar HTML. Probablemente su arquitectura trata con la separación de la presentación de la estructura.