使用Rails 3.1資產管道的JavaScript代碼中的圖像的URL？

Question

在CSS文件中，您可以使用以下命令獲取圖像資產的正確名稱（帶指紋）：

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

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

Answer 1

我看到你正在使用sass helper方法。

在標准（非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 資產管道指南是有關如何使用這些功能的極好信息來源。

Answer 2

在Rails 4中，我建議您堅持使用js.erb視圖，並使用變量將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' }

應用程序/資產/ Java腳本/ file.js.coffee：

alert gon.path

此方法更快，因為文件在啟動時僅預編譯一次，由服務器而不是通過Rails提供服務，並且與其他Js在相同的HTTP請求上。