Rails 应用程序未加载 mp3 文件以在 HTML 5 播放器中播放答案

【问题标题】：Rails app not loading mp3 file to play in HTML 5 playerRails 应用程序未加载 mp3 文件以在 HTML 5 播放器中播放
【发布时间】：2015-04-21 21:14:47
【问题描述】：

我有一个 mp3 文件保存在我的 assets/audio 文件夹中，并想使用 html 5 播放器播放它。但是，当我加载我的页面时，我总是收到该资源的 404 not found 错误。想知道我是不是做错了。

在 view.html.erb 中

<audio src="app/assets/audio/bensound-acousticbreeze.mp3" type="audio/mpeg" controls>
    Your browser does not support the audio element.
</audio>

我已多次验证完整路径是正确的。任何帮助将不胜感激

【问题讨论】：

您是否查看过浏览器调试器中的网络选项卡？它告诉你关于请求的什么？它是否请求您告诉它的路径？
我确实查看了网络选项卡，但我突然将路径与正在加载的一些资产的路径进行比较，我能够找出问题所在。显然，所有 rails 资产都被折叠到资产目录中，即使它们位于子目录中。正确的路径只是 assets/bensound-acousticbreeze.mp3
太棒了。好资料。不过，您确实应该使用内置的路径提供程序来避免这种事情。如果资产管道在未来发生变化，这也将做一些面向未来的验证。请参阅我的回答，了解使用audio_tag 的更好方法

标签： ruby-on-rails ruby html asset-pipeline html5-audio

【解决方案1】：

更新： 在查找一些内容以回答问题时发现了这一点。这里比任何其他解决方案更好的是使用内置的audio_tag。不过，这确实删除了替代文本选项，所以就是这样。不过，这里是doc page。

你试过audio_path或asset_path吗？

看起来像这样：

<audio src="<%= audio_path 'audio/bensound-acousticbreeze.mp3'%>" type="audio/mpeg" controls>
    Your browser does not support the audio element.
</audio>

或

<audio src="<%= asset_path 'audio/bensound-acousticbreeze.mp3'%>" type="audio/mpeg" controls>
    Your browser does not support the audio element.
</audio>

您应该通过将音频保存在audios 目录中来简化操作，如the docs 所示。那么它就是：

audio_path "bensound-acousticbreeze.mp3"

全部与html一起：

<audio src="<%= audio_path 'bensound-acousticbreeze.mp3'%>" type="audio/mpeg" controls>
    Your browser does not support the audio element.
</audio>

【讨论】：

我确实使用了asset_path 标签，虽然你提到的路径不太正确（结果是 assets/bensound-acousticbreeze.mp3 ），但我终于可以让它工作了。

【解决方案2】：

显然，所有 rails 资产都被折叠到资产目录中，即使它们位于子目录中。正确的路径是“assets/bensound-acousticbreeze.mp3”。

对于遇到此类问题的任何人，它帮助我将丢失资产的路径与我想要加载的路径进行比较，看看有什么区别。

【讨论】：