0

我目前有一个奇怪的问题,我正在寻找有关如何处理这个问题的任何见解。

我目前正在使用Basecamp Trix 编辑器接受 HTML 输入。

当我将输入发送到我的 Laravel 应用程序时,它会保存到我的数据库中:

<div>&lt;script&gt;alert('test');&lt;/script&gt;</div>

然而,问题在于,当我使用 Laravel 的刀片将其插入 Vue 属性时,它实际上以某种方式将其转换回有效的 HTML:

<reply :data-reply="{{ $reply }}"></reply>

结果:

在此处输入图像描述

似乎 Laravel 使用刀片回显语句将脚本标签转换为有效的 HTML?

我的观点:

{{ $reply }}

结果:

{"id":63,"created_at":"2017-09-07 13:30:53","updated_at":"2017-09-07 13:35:05","user_id":1,"body":"<div><script>alert('test');<\/script><\/div>","options":null}

问题是,我无法对此进行清理,因为 HTML 数据实际上在我的数据库中进行了转义,但是当 Laravel 将我的回复转换为 JSON 时,它实际上取消了脚本标签,并且在使用v-html指令时它实际上是在 Vue 中运行的。

我知道在使用指令时我不应该接受用户输入v-html,但我需要 HTML 支持来回复,而且我无法在我的 Laravel 应用程序中清理已经转义的 HTML。

有谁知道如何以某种方式对 Trix 的内容进行消毒?

4

1 回答 1

0

好的,我已经放了

<div>&lt;script&gt;alert('test');&lt;/script&gt;</div>

进入用户的电子邮件字段。

在 Laravel 我只是使用:

return view('welcome', ['user' => App\User::find(1)]);

模型没什么特别的。

我的观点是这样的:

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<div id="el">{{ $user }}</div>
<script>
    user = JSON.parse(document.getElementById("el").innerHTML);
    console.log(user.name);
</script>
</body>
</html>    

在 JS 控制台中我得到:

&lt;div&gt;&lt;script&gt;alert('test');&lt;/script&gt;&lt;/div&gt;

所以它与数据库中的不同,但它看起来也不像你展示的那样。

于 2017-09-07T17:13:03.150 回答