Jade/Mongo 输出中的换行符

Question

我已经阅读了关于这个问题的所有关于 stackoverflow 的问题，但没有一个能满足我的需求。

我有一个简单的留言板，用户可以在其中通过 textarea 发布 cmets。 这些存储在Mongo中并通过jade显示

但是所有的换行符都丢失了。

它们在数据库中存储为\r\n，但在渲染时不显示。

用<br />s 替换它们也无济于事，因为它们只是呈现为字符串。

用 <pre> 包裹 cmets 确实有帮助...但它会阻止文本在嵌入的图片周围浮动。

有没有简单的方法可以直接输出存储的文本？

这是<span> 和<div> 而不是<pre>： 这就是我希望它浮动的方式，但不呈现换行符

翡翠模板：

  if (user)
    p You are logged in as #{user.username}  
      a(href='/logout') [Log Out]
  else
    a(href='/login') Log In

 .threadWrapper
   each post, i in posts
    .thread.col-md-12
      a(href="/thread/#{post._id}")
        span#postTitle #{post.postTitle}
      |  
      span#commentCount (#{post.comments.length})
      |  created at 
      span#createdAt #{post.createdAt}
      |  by 
      span#op #{post.op}
      if (user)
        button.close.deleteThreadButton(type='submit', aria-label='Close')
          span(aria-hidden='true') ×
      //button.deleteThreadButton(type="submit") X
      .ThreadContent
        if post.postFileLink
          case post.postFileType
            when "image/png"
            when "image/gif"
            when "image/jpeg"
              img(src="/files/#{post.postFileLink}")
            when "video/mp4"
            when "video/webm"
              video(width="200", height="150", controls)
                source(src="/files/#{post.postFileLink}", type="#{post.postFileType}")
                | Sorry, your browser does not support the video tag. No Videos for you!
      span#threadContent #{post.postContent}
      .clearfix

Answer 1

您的数据库确实包含存储的文本，但 textarea 的处理换行符不同于“常规”HTML 元素（如<div>、<p> 等），其中连续的空格序列被折叠成一个空格。

您可能可以使用CSS 解决它。

例如：

- var text = 'foo\r\nbar\r\nxxx';

p(style = 'white-space: pre-wrap')= text

或者，您可以将换行符替换为 <br> 并让 Jade 不会转义输出：

- var text = 'foo\r\nbar\r\nxxx'.replace(/\r\n/g, '<br>');

p !{text}

但是，如果您的用户在 cmets 中输入恶意的 <script> 块（除非您以某种方式将它们过滤掉，否则最终会在您的页面上未转义），这可能会给您带来潜在的安全问题。