使用换行符显示用户输入 html答案

【问题标题】：Displaying user input html with newlines使用换行符显示用户输入 html
【发布时间】：2017-06-09 05:06:59
【问题描述】：

我的应用程序中有 cmets 部分，用户可以在其中输入文本区域。我想防止他们输入的换行符，但也将 html 显示为字符串。例如，如果comment.body 是

Hello, this is the code: <a href='foo'>foo</a>

Bye

我希望它像上面一样显示。其他任何东西都一样，包括iframe 标签。

我得到的最接近的是：

= simple_format(comment.body)

但它会清理 html 代码并且不会显示。示例：foo <iframe>biz</iframe> bar 显示为：

foo biz bar

我应该怎么做才能达到我想要的？

【问题讨论】：

【解决方案1】：

不用任何方法直接使用，会呈现为纯文本：

= comment.body

使用您的第二个示例，输出将是：

foo <iframe>biz</iframe> bar

要使\n 表现得像<br>，您可以使用CSS：

.add-line {
  white-space: pre-wrap;
}

并在你的视图中使用它：

.add-line = comment.body

使用你的第一个例子：

comment.body = "Hello, this is the code: <a href='foo'>foo</a>\n\nBye"

输出将是：

Hello, this is the code: <a href='foo'>foo</a>

Bye

【讨论】：

【解决方案2】：

在过去做过类似的事情，我认为您必须首先了解为什么 HTML 会从用户输入中清除。

假设我将以下内容写入一个接受 HTML 并将其显示到首页的字段中。

<script>alert('Hello')</script>

该代码将为访问首页的任何人执行，并且烦人地为每个访问者触发一个 JS 警报。

也许还不是什么大问题，但想象一下我写了一些 AJAX 请求，将用户会话 ID 发送到我自己的服务器。现在这是一个问题......因为人们的会话被劫持了。

此外，还有一个完整的基于 JavaScript 的漏洞利用框架，称为 BeEF，它依赖于这种称为跨站点脚本 (XSS) 的网站漏洞利用。

BeEF 做了一些非常可怕的事情，在考虑用户生成的 HTML 时值得一看。

那该怎么办？好吧，如果您签入数据库，您会看到标签实际上正在被存储，但就像您指出的那样没有显示。

您可以.html_safe 内容，但我再次强烈建议不要这样做。

也许您应该自己编写一个替代的.html_safe 方法，例如html_safe_whitelisted_tags。

至于删除换行符，您说要按原样显示。因此，正如 Michael 所指出的，将 /n 替换为 <br> 将是您的解决方案。

comment.body.gsub('\n', '<br />').html_safe_whitelisted_tags

【讨论】：

【解决方案3】：

HTML safe 允许将注释中的 html 用作 html，但会跳过换行符，因此将 \n 快速替换为 <br /> 将覆盖新行

comment.body.gsub("\n", "<br />").html_safe

如果您希望显示 html 而不是渲染，则检查 CGI::escapeHTML()，然后执行 gsub 以使 <br /> 不会被转义。

CGI::escapeHTML(comment.body).gsub("\n", "<br />")

【讨论】：

仔细检查你的输出，CGI::escapeHTML 不会渲染&lt;/>，因为它会转义它们并显示&lt;/&gt，所以你会得到类似的东西：@ 987654332@.
@Gerry 是的，当打印到控制台中的屏幕时。因为那是 html 转义的内容，所以当在视图中呈现时，它将显示为 <iframe>biz</iframe>，而不是实际创建带有单词 biz 的 <iframe> 标记
你测试了吗？您需要添加 raw()（即 raw(CGI::escapeHTML(comment.body).gsub("\n", "<br />")) 以获得正确的输出。