问题描述
所以我使用 quillJS(所见即所得编辑器)生成了一些用户定义的 HTML。就在编辑器中显示/编辑文本而言,它工作正常,但是当我尝试在我的 pug 页面上使用 !{var} 在页面上显示相同的数据时,它显示为字符串“....my HTML代码在这里...."
-----这是我从 DB 中获取它时的样子----
"<h1 class=\"ql-align-center\">Essential things to think about before starting a blog</h1><p><br></p><h2 class=\"ql-align-center\">It takes several ingredients to create a delicIoUs blog&l
t;/h2><p><br></p><p class=\"ql-align-justify\">It has been exactly 3 years since I wrote my first blog series entitled “Flavorful Tuscany”,but starting it was definitely not easy. Back then,I didn’t kNow much about blogging,let alone think that one day it Could become <strong>my full-time job</strong>. Even though I had many recipes and food-related stories to tell,it never crossed my mind that I Could be sharing them with the whole world.</p><p class=\"ql-align-justify\">I am Now a <strong>full-time blogger</strong> and the curator of the <a href=\"https://ckeditor.com/ckeditor-4/#\" target=\"_blank\">Simply delicIoUs newsletter</a>,sharing stories about traveling and cooking,as well as tips on how to run a successful blog.</p><p class=\"ql-align-justify\">If you are tempted by the idea of creating your own blog,please think about the
following:</p><ul><li class=\"ql-align-justify\">Your story
(what do you want to tell your audience)</li><li class=\"ql-align-justify\">Your audience (who do you write for)</li><li class=\"ql-align-justify\">Your blog name and design</li></ul>"
---------这里是在 chrome DevTools 中的外观----
<div class="text-justify" id="description">
<h1 class="ql-align-center">Essential things to think about before starting a blog</h1><p><br></p><h2 class="ql-align-center">It takes several ingredients to create a delicIoUs blog</h2><p><br></p><p class="ql-align-justify">It has been exactly 3 years since I wrote my first blog series entitled “Flavorful Tuscany”,let alone think that one day it Could become <strong>my full-time job</strong>. Even though I had many recipes and food-related stories to tell,it never crossed my mind that I Could be sharing them with the whole world.</p><p class="ql-align-justify">I am Now a <strong>full-time blogger</strong> and the curator of the <a href="https://ckeditor.com/ckeditor-4/#" target="_blank">Simply delicIoUs newsletter</a>,as well as tips on how to run a successful blog.</p><p class="ql-align-justify">If you are tempted by the idea of creating your own blog,please think about the following:</p><ul><li class="ql-align-justify">Your story (what do you want to tell your audience)</li><li class="ql-align-justify">Your audience (who do you write for)</li><li class="ql-align-justify">Your blog name and design</li></ul>
</div>
我做错了什么..
解决方法
@sean 是对的,代码正在转义,但不在数据库中,但在它进入数据库之前,显然一个插件“xss-clean”正在将 HTML 标签 转换为 HTML实体。
这是该值的示例,甚至可以在问题中看到:
<h1 class=\"ql-align-center\">
禁用该插件后,转义开始工作..
我强烈建议其他可能面临同样问题的人检查这些小异常并将其作为调试过程中的步骤之一进行处理。
PS:我从 Xss-Clean 切换到 Helmet 以及 Xss-clean 的替代品。