Question

我开始做一些JS / HTML / CSS。从环顾四周看，从后端返回HTML（例如，Ajax响应）并直接显示它（例如通过将其分配给元素的innerHTML）并不罕见。例如，我相信jQuery load（）方法基本上是执行此操作的快捷方式。

采取这种方法让我担心的原因有两个，但我不确定这是否只是因为我不熟悉这些领域的方法和惯用语而且我只是落后于时代或者这些是否是合理的问题。我特别关注的是：

1）直接将HTML分配给元素似乎不安全。或者，至少在有可能存在任何用户内容（甚至是第三方内容）的情况下至少是危险的。

2）直接发送演示信息（HTML）似乎可能导致最好避免的演示/模型混合。当然，可以在后端干净地分离这些并仍然返回HTML，但是在我看过的少数几个项目中并非如此。

所以，我的问题是，在Ajax应用程序中返回HTML是一种合法形式的HTTP响应还是最好避免使用？

Answer 1

我认为这取决于用例是否诚实。如果必须根据某些JSON或XML数据构建大量HTML，则需要在客户端上支付相当大的罚款。

我个人使用两者的混合 - 如果它只是一小部分数据（一个整数或一个小字符串），我将使用JSON甚至只使用原始数据。

如果它是一组复杂的数据（比如一堆用户注释），我将不得不在客户端进行格式化，那么我只需发送html并保存客户端的工作。

就个人而言，我不担心安全性，至少不是用户注入恶意HTML - 无论如何，你应该在处理它时进行处理。

编辑：有一个例外 - 当带宽受到关注时（例如移动网络），然后通过线路发送尽可能少的数据几乎总是最好的。

Answer 2

我没有看到正确或错误的方法，这取决于您发送的数据量和您希望它呈现的速度。直接插入HTML 比从JSON或XML构建元素更快。 XSS应该不是问题，因为无论您发送的格式如何，都应该转义用户数据。

如果你看看Facebook，所有的XHR回复（就我所见，我只是在看到你的问题时才开始看:)是这样的：

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&amp;campaign_id=368901427978&amp;extra_1=auto\">
Create an Ad\u003c\/a>\u003cdiv>\u003ch4 class=\"uiHeaderTitle\">Sponsored
\u003c\/h4> [...]" }

他们的AJAX内容很重，因此发送HTML可能会让他们感到高兴。可能他们的架构处理结构 - 表示分离。

是否最好直接返回HTML以避免Ajax响应？

2 个答案: