Ruby/Rails - 在CSS中使用之前转义URI

Question

Ruby/Rails - 在CSS中使用之前转义URI

8

在我的应用程序中，用户上传一张图片，然后我将其放在S3上。稍后，该图像将作为div的背景使用，并使用以下样式：

div#id { background: url('<%= creative.url %>') no-repeat;}

创意URL看起来像这样：

http://myhost.s3-website-us-east-1.amazonaws.com/27/display/608-(rec'd_021014)_user_image.jpg?1392767029

如上所述，问题在于创意URL可能包含特殊字符（引号、括号等），根据http://www.w3.org/TR/CSS2/syndata.html#value-def-uri的规定，它需要被转义。

我希望有一些方便的Ruby/Rails函数可以为我处理这个问题。

如果没有，那么我可能需要进行某种正则表达式替换-它会是什么样子？

更新：

大家建议使用URI编码函数-我确实尝试过，但是URL字符串直接在ERB模板中使用，因此它会对整个字符串进行编码，无法在CSS URL函数中使用-即，我需要类似于（来自上面）：

div#id {background: url('http%3A%2F%2Fmyhost.s3-website-us-east-1.amazonaws.com%2F27%2Fdisplay%2F608-(rec%27d_021014)_user_image.jpg%3F1392767029') no-repeat;}

- user3072558

5个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Raj · Answer 1

推荐的方法是使用 ERB::Util 中的 url_encode。

在 Rails 中，有一个别名 u 用于 url_encode。

div#id { background: url('<%=u creative.url %>') no-repeat;}

- skozz · Answer 2

您可以尝试以下方法：

URI(url) 或者 URI.encode(url) 或者 URI.decode(url) 或者 URI.parse(url)

根据具体情况而定

在使用前，您可能需要加载 require 'uri'

- jb_314 · Answer 3

我认为Rails没有任何CSS转义助手，但是JS转义助手j总比没有好，因为它可以转义引号、闭合括号和反斜杠。不过可能会有一些特殊的CSS字符不会被处理。

您可以在相关元素上设置一个data-属性，然后使用CSS attr函数来引用它。这样，您就可以在CSS中使用它，而不必担心它会被转义为CSS。

- Dorian · Answer 4

我尝试了一个名为jeux'); background-image: url('nope.jpg的文件。

唯一有效的是：

  def escape_css(string)
    string.gsub("'", "\\\\'")
  end

我尝试了CGI.escape，URI.escape，u和String#dump

完整代码：

  .h-32.bg-cover.bg-no-repeat.bg-center(style="background-image: url('#{escape_css category_image_url(category)}')")

- Konstantinos Bessas · Answer 5

你可以使用dump。

div#id { background: url('<%= creative.url.dump %>') no-repeat;}