自建博客后端：PostgreSQL存储的HTML博客内容无法渲染如何解决？

• 前端直接渲染HTML（注意XSS风险）
  主流前端框架都提供了直接渲染HTML内容的方式：

  • React：用dangerouslySetInnerHTML属性，写法是<div dangerouslySetInnerHTML={{ __html: 你的博客内容变量 }} />，但一定要先过滤掉恶意代码，避免XSS攻击。
  • Vue：使用v-html指令，比如<div v-html="你的博客内容变量"></div>，同样要做好内容安全校验。
  • 原生JS：直接给DOM元素赋值innerHTML，比如document.getElementById('blog-content').innerHTML = 你的博客内容变量，安全风险同上，必须过滤危险内容。

• 做HTML内容的安全过滤
  直接渲染裸HTML有被注入恶意代码的风险，建议用专业工具过滤危险标签和属性：

  • 后端可以用DOMPurify（支持Node.js、Python等多语言），把用户输入的HTML里的<script>、onclick这类危险内容清理掉，再存储或传给前端。比如Node.js里先安装依赖，然后执行const cleanContent = DOMPurify.sanitize(rawBlogContent);。
  • 前端也可以直接用DOMPurify先处理内容，再渲染。

• 改用Markdown编写博客（更安全易上手）
  很多个人博客不会让用户直接写HTML，而是用Markdown语法，流程更简单安全：

  • 用户在仪表盘用Markdown写博客，后端把Markdown文本存在数据库里；
  • 前端获取后，用marked、CommonMark这类解析库把Markdown转换成HTML，再渲染到页面上。如果担心安全，同样可以结合DOMPurify做过滤。

• 后端预处理HTML（可选）
  如果一定要存HTML格式，建议在后端存储前就完成预处理：

  • 过滤掉所有危险代码，确保存储的是安全合规的HTML片段；
  • 也可以把HTML转换成更轻量化的格式，再传递给前端渲染。

内容的提问来源于stack exchange，提问作者Hau Khua Lian