javascript - 使用 Rails 3.1 资产管道的 JavaScript 代码中图像的 URL？

Question

在 CSS 文件中，您可以使用以下方法获取图像资产（带有指纹）的正确名称：

background-image: url(image-url("rails.png"))

但是你如何从 JavaScript 文件中做同样的事情呢？

score 49 · Accepted Answer

我看到您正在使用 sass 辅助方法。

在标准（非 Sass）CSS 中，您可以执行以下操作：

.class { background-image: url(<%= asset_path 'image.png' %>) }

CSS 文件需要将 erb 添加到扩展中：

file_name.css.erb

对于 javascript，同样的规则适用：

file_name.js.erb

并在文件中：

var image_path = '<%= asset_path 'image.png' %>'

Rails资产管道指南是有关如何使用这些功能的绝佳信息来源。

score 2 · Accepted Answer

js.erb在 Rails 4 中，我建议您不要使用视图，而是坚持使用资产管道，并使用变量将 URL 传递给它，而不是使用 gon 或在以下部分讨论的其他技术： Ruby on Rails - 从控制器发送 JavaScript 变量到外部 Javascript资产文件

与gon：

应用程序/视图/布局/application.html.erb：

<head>
  <meta charset="utf-8"/>
  <%= include_gon %>

应用程序/控制器/application_controller.rb：

before_filter { gon.path = asset_path 'image.png' }

应用程序/资产/javascripts/file.js.coffee：

alert gon.path

这种方法更快，因为文件仅在启动时预编译一次，由服务器而不是通过 Rails 提供服务，并且与其余 Js 使用相同的 HTTP 请求。

2 回答 2