如何在EJS中将数据库返回的HTML字符串渲染为正常页面内容

问题原因 #

EJS中<%= %>标签默认会对输出内容做HTML转义处理，会把<、>、引号等特殊字符转换为HTML实体，所以你存入的HTML标签会直接明文展示，不会被浏览器解析为页面元素。

解决方法 #

把需要渲染HTML的变量对应的标签从<%= %>替换为<%- %>即可，后者不会做转义处理，会直接输出原始HTML字符串，和React的dangerouslySetInnerHTML功能一致。

代码修改示例 #

你的EJS模板里对应描述的部分修改为如下即可：

<div class="blogText">
 <!-- 把<%= 替换为 <%- 即可渲染HTML效果 -->
 <p><%- discription %></p>
 <div class="blog-main-image" style="background-image: url('<%= image %>')"></div>
 <p><%- discription2 %></p>
</div>

其他不需要渲染HTML的字段（比如日期、标题、图片地址）保留<%= %>即可，避免不必要的安全风险。

安全注意事项 #

如果discription、discription2的内容是用户可提交的，建议在存入数据库或者渲染前先做XSS过滤，移除<script>、恶意事件属性等危险内容，避免跨站脚本攻击。

内容的提问来源于stack exchange，提问作者private name