图片资源可用于 CSS 文件但不可用于 JS 文件——为什么？答案

【问题标题】：Image assets available to CSS files but not JS files -- why?图片资源可用于 CSS 文件但不可用于 JS 文件——为什么？
【发布时间】：2015-11-12 16:23:18
【问题描述】：

我正在尝试通过 js 文件访问资产管道中的图像，但是我收到一个 404 错误，表明该图像不存在。我的理解是 Rails 指纹并将图像/资产预编译/预加载到浏览器上，因此文件路径“imageName.png”变成了“imageName-uniqueFingerprint.png”的效果，从而使原始路径不再有效。（如有误解请指正）

我不明白为什么我可以在 CSS 文件中使用原始路径，例如：background: url('nebula_small.png') 并且图像检索得很好，但是如果我尝试在 JS 文件中使用相同的路径，我会得到404。我认为 Assets 目录中的所有内容都是由 Rails 预编译的，因此我假设对各自的资产具有平等的访问权限。

我可以编写一个辅助方法（根据 this StackOverflow suggestion) 将 digest_path 与原始路径相关联，但是我想知道是否有某种方法可以简单地为 JS 文件提供与 CSS 文件相同的对图像的访问权限。

对 Rails 还是新手，所以如果您需要澄清或者我措辞不当，我深表歉意。感谢您的宝贵时间。

【问题讨论】：

JS文件中图片的路径是否需要使用main HTML file location as root，而CSS文件中的路径是relative to that CSS file？ IE。如果您使用绝对路径，您的问题仍然存在吗？
您实际上不能在 css 中使用原始路径。当您使用 background: image-url('image.png') 之类的东西时，sprockets 会将指纹添加到其中（仅在生产中）
@ghybs 我刚试过，没用，不过是个好主意。
@YuryLebedev 啊！那么有没有办法让链轮对路径进行指纹识别或链接到 JS 文件中的指纹路径？
@DanKlos 我会写一个简短的答案，其中包含已知的选项

标签： javascript css ruby-on-rails

【解决方案1】：

我想最简单的方法是将.erb 扩展名添加到您的.js 文件，并使用asset_path rails 助手：

$('#logo').attr({ src: "<%= asset_path('logo.png') %>" });

第二种方法有点复杂，它是解析您的.sprockets-manifest-md5hash.json 文件，该文件编译到您的公共文件夹中，其中包含您图像的所有网址。您可以在此处阅读更多信息：

http://edgeguides.rubyonrails.org/asset_pipeline.html#precompiling-assets

https://github.com/rails/sprockets/blob/master/UPGRADING.md#publicassetsmanifest-abc123json-location

【讨论】：