safe_join和content_tag方法来取代html_safe?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (153)

我正在使用Rails的content_tag助手构建一段HTML代码。我现在面临的挑战是从一个数组中加入HTML字符串,其中包含由HTML生成的HTML元素content_tag

例如:

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>
提问于
用户回答回答于

问题在于你将输出与来自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>&lt;li&gt;Two&lt;/li&gt;"

# nothing has been escaped, since everything is safe
"<li>One</li>".html_safe + "<li>Two</li>".html_safe # => "<li>One</li><li>Two</li>"

所以,为了获得预期的结果必须满足两个条件:

  1. safe_join方法必须采用html_safe字符串数组。如果它们不是html_safe,则所有的html标签都会被转义。
  2. 不要将不安全的字符串连接到安全的字符串,否则第一个字符将被转义。

正如你所看到的,你没有完成第二个条件。

关于新方法的建议

.join("")方法使结果字符串不安全,即使数组包含安全字符串。使用safe_join

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

扫码关注云+社区

领取腾讯云代金券