从 JavaScript 获取资产路径答案

【问题标题】：Acquire Asset Path from JavaScript从 JavaScript 获取资产路径
【发布时间】：2012-11-15 15:55:52
【问题描述】：

我需要在 Rails 资产管道中的 HTML5 画布上显示图像，但我需要知道来自 JavaScript 的资产路径。我在应用程序的其他部分使用js-routes，但它似乎没有提供一种方法来获取资产管道中的某些内容。

从 JavaScript 获取 Rails 资产（例如图像）路径的正确方法是什么？

【问题讨论】：

【解决方案1】：

在 Rails Asset Pipeline guide 中，他们通过使用 ERB 预处理样式表，提供了在样式表中编码资产的示例。您可以在 JavaScript 中使用相同的技术，假设您在文件名末尾添加了 .erb：

var someAssetPath = "<%= asset_path('some_image.png') %>";

【讨论】：

感谢您的快速响应....我想过这样做，但可能有许多不同的资产我想要路径，所以这可能会变得很麻烦并变成维护的噩梦随着资产的添加或删除。我还考虑创建自己的操作方法来返回所提供资产名称的 URL，但我希望找到更好的替代方法。
我个人认为这是一个糟糕的建议，尽管它是可行的。 Rails 不打算成为 JavaScript 预编译器。
@ArxPoetica，那他们为什么要采用可编译为 JavaScript 的 CoffeeScript？

【解决方案2】：

查看js_assets(Javascript helper in rails projects) gem。我认为这正是您所需要的。

来自文档：

在javascript中获取模板app/assets/javascripts/rubrics/views/index.html的路径： var path = asset_path('rubrics/views/index.html')

【讨论】：

【解决方案3】：

为什么不在 .erb 文件中的元素内为路径添加数据属性，然后使用 JQuery 检索它？

在 some_template.html.erb 中

<%= content_tag(:div, "", id: 'some-id', data:{path_to_asset: asset_path("some_image.png")}) %>

然后在 some_javascript.js 中

var assetPath = $("#some-id").data("pathToAsset");

【讨论】：

【解决方案4】：

对于那些使用 HAML 的人，您可以这样做：

:javascript
   var assetPath = "#{asset_path('some_image.jpg')}";

【讨论】：

【解决方案5】：

我在 Rails 4.1 中遇到了同样的问题，并使用referencing rails assets in coffeescript 处理图像。不需要额外的库。

【讨论】：

【解决方案6】：

在我的例子中，我想获取样式表路径和 rails 为缓存破坏生成的哈希值，因此无法进行硬编码。

对我来说效果很好的是为 html（布局）中的主要样式表链接元素分配一个 ID，然后使用 javascript 提取 href。如果您想要基本资产路径，也许可以创建一个通用元素，其中包含您需要的数据作为属性。

渲染的 HTML

<link rel="stylesheet" href="mypath/main.css" type="text/css" id="main-css">

JS

$("#main-css").attr("href"); // "mypath/main.css"

【讨论】：