Rails 3.1资产管道中的客户端动态资产URL

Question

TL;DR

我正在尝试在客户端使用HTML5数据元素动态生成资产URL。这意味着在浏览器运行时，资产名称不可用，这会防止服务器上的ERB进行预处理。

是否有解决此类情况的解决方法或最佳实践？

背景

我正在一个Rails应用程序中使用Fusion Charts图表插件，该插件使用各种SWF文件生成图表。我正在升级应用程序以使用Rails 3.1，并将这些SWF文件放置在/vendor/assets/javascripts/fusion_charts中。

在应用程序中，我使用HTML5数据属性动态指定要绘制的图表类型，如下所示：

<%# ... metric.html.erb ... %>
<div id='chart-container' class='fusion-chart'
  data-chart-type='MSLine'
  data-source-url="<%= @metric.data_url %>">

然后我有一个用CoffeeScript编写的简单jQuery插件，它提取这些数据属性并将其连接到Fusion Charts：

// ... charting_plugin.js.coffee ...
chart = new FusionCharts
  swfUrl: "/assets/fusion_charts/#{data.chartType}.swf"
chart.setJSONUrl data.sourceUrl
chart.render containerId

我遇到的问题是swfUrl参数。要遵循RoR Asset Pipeline guide提供的指导，我应该在ERB中使用asset_path助手，但这样做不起作用，因为data.chartType 在客户端绑定，在运行时，并且不能在服务器端进行预处理。

<# ... charting_plugin.js.coffee.erb: This won't work; data.chartType isn't defined ... %>
chart = new FusionCharts
  swfUrl: "<%= asset_path "fusion_charts/#{data.chartType}.swf" %>"
chart.setJSONUrl data.sourceUrl
chart.render containerId

解决方案

最简单的解决方案（我目前正在使用的）是将SWF文件简单地移回/public/fusion_charts，不必担心管道中资产指纹复杂性。话虽如此，我对管道还很陌生，也许我错过了一些明显的东西。

有更好的处理客户端资产URL的方法吗？

- krohrbaugh

Answer 1

一个解决方案是为不同类型的图表创建一个swf文件查找表，例如：

var chartMap = {
<% 
chart_types.collect do |type|
  "#{type.to_json}: #{asset_path(type + '.swf')}"
end.join(",\n")
%>
};

然后添加一个函数，在运行时获取客户端正确的路径，如下所示：

function chartPath(type) {
  return chartMap[type];
};

接着将您的设置调用更改为：

chart = new FusionCharts
  swfUrl: chartPath(data.chartType)

使用ERB构建一个在资产编译时需要的所有可能路径列表，并在运行时在客户端上进行查找。当然，你需要将上述内容转换为CoffeeScript格式 - 我不是一位咖啡爱好者，我更喜欢拿铁。

- Irongaze.com