Question

我正在使用Rails'content_tag帮助程序构建一个HTML代码块。我现在面临的挑战是使用content_tag生成的HTML元素加入数组中的HTML字符串。

例如：

options = ["<li>Three</li>", "<li>Four</li>", "<li>Five</li>"]

# This is code to generate blocks of HTML
out = []
out << content_tag(:ul,  
   content_tag(:li, "One") + 
   content_tag(:li, "Two") + 
   options.join(''),
:class => ["class_1", "class_2"])
safe_join(out)

# Expect result should be like
<ul class="class_1 class_2">
   <li>One</li>
   <li>Two</li>
   <li>Three</li>
   <li>Four</li>
   <li>Five</li>
</ul>

# Actual result
<ul class="class_1 class_2">
   <li>One</li>
   <li>Two</li>
   "<li>Three</li><li>Four</li><li>Five</li>"
</ul>

但是，如果我使用如下所示的html_safe方法，它将起作用。

%{<ul>
   <li>One</li>
   <li>Two</li>
   #{options.join('')}
 </ul>
}.html_safe

关于我应该改变什么的任何建议？

# New apporach
options = ["Three", "Four", "Five"]
out = []
out << content_tag(:ul,  
   content_tag(:li, "One") + 
   content_tag(:li, "Two") + 
   options.collect do |option|
      content_tag(:li, "#{option[0]}")
   end.join(""),
:class => ["class_1", "class_2"])
safe_join(out)

# New approach result
<ul class="class_1 class_2">
   <li>One</li>
   <li>Two</li>
   "<li>Three</li><li>Four</li><li>Five</li>"
</ul>

Answer 1

问题是您将输出与来自options数组的不安全字符串连接起来。这是唯一一个使用html_safe方法使整个输出安全的地方：

out << content_tag(:ul,  
   content_tag(:li, "One") + 
   content_tag(:li, "Two") + 
   options.join('').html_safe,
:class => ["class_1", "class_2"])

修改

首先safe_join方法不像html_safe方法那样工作，它不仅使连接字符串html_safe。如果连接的字符串不是html_safe，它还会使html转义，以避免有害内容。

https://apidock.com/rails/ActionView/Helpers/OutputSafetyHelper/safe_join

在你的情况下，safe_join方法对out数组中的字符串没有任何作用，因为它们已经是html_safe。

result = content_tag(:ul, content_tag(:li, "One") + content_tag(:li, "Two") + options.join(''), :class => ["class_1", "class_2"]) result.html_safe? # => true

问题的原因是您将安全字符串与不安全字符串连接起来：

content_tag(:li, "Two") + options.join('') content_tag(:li, "Two").html_safe? # => true options.join('').html_safe? # => false

当时options.join('')被html转义，因为它不安全。参见示例：

# html tags in the second string are escaped, since it is not safe "<li>One</li>".html_safe + "<li>Two</li>" # => "<li>One</li><li>Two</li>" # nothing has been escaped, since everything is safe "<li>One</li>".html_safe + "<li>Two</li>".html_safe # => "<li>One</li><li>Two</li>"

因此，为了获得预期结果，必须满足2个条件：

safe_join方法必须使用html_safe字符串数组。如果它们不是html_safe，则所有html标签都将被转义。

不要将安全字符串与不安全字符串连接起来，否则将转义不安全字符串。

如你所见，你没有达到第二个条件。

有关新方法的建议
即使数组包含安全字符串，
.join("")方法也会使结果字符串不安全。使用safe_join：

content_tag(:li, "One") + content_tag(:li, "Two") + safe_join( options.collect do |option| content_tag(:li, option) end )

safe_join和content_tag方法替换html_safe

1 个答案: