可以从 html 编辑器中解析文本，而不是在 VueJS 中使用 v-html？

Question

我的项目有管理面板和主页。 在管理面板上，我可以使用 HTML 编辑器（本例中为 VueEditor）创建帖子，数据库中的帖子如下所示：

<p>Here is some test text from VueEditor</p>

然后，我想在主页上解析它，但是，当然，没有<p>标签，所以我使用这个：

<p v-html='item.plot'></p>

这是一个问题，IDE 告诉：

ESLint: 'v-html' directive can lead to XSS attack.(vue/no-v-html)

这真的有那么危险吗？ 我应该以其他方式解析它吗？

Answer 1

是的，这真的很危险。

考虑一下我创建帖子时会发生什么。

Hi I'm Dave this is my <script>alert('pwned,' + document.cookie)</script> post!

我现在可以在您的网站上运行任意 JS 代码，并窃取您提供此代码的每个用户的登录信息。

我对 vue 不是特别熟悉，但大多数框架都有一个简单的方法来 output 清理 html。 我认为这是 vue 中的{{ itme.plot }} 。 这不会呈现实际（或任何其他标签），而是呈现转义版本<script> 浏览器不会将其解释为实际代码。

如果您让我在您的网站中注入我自己的 HTML，那么还有一百万种其他方法可以进行 XSS。