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

URL of images in JavaScript code using Rails 3.1 asset pipeline?

本文关键字：JavaScript 代码 图像 URL 管道 Rails 使用      更新时间：2023-09-26

在CSS文件中，您可以使用:

获得图像资源的正确名称(带有指纹)
background-image: url(image-url("rails.png"))

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

我看到你正在使用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资源管道指南是一个关于如何使用这些特性的极好的信息来源。

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

With gon:

app/views/布局/application.html.erb: 

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

app/controllers/application_controller.rb: 

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

app/资产/javascript/file.js.coffee: 

alert gon.path

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

相关文章：