javascript 不使用 Flash 嵌入音频 mp3
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5330573/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Embed audio mp3 without using Flash
提问by Francesco
what is a nice way to embed audio mp3 in html page without using flash but with a custom skin? also it should work, partially, also in older browsers
什么是在 html 页面中嵌入音频 mp3 而不使用 flash 但使用自定义皮肤的好方法？它也应该在较旧的浏览器中部分工作
采纳答案by rsp
If you want it in older browser then you have to provide a Flash fallback. You can do it with jPlayerfor example. jPlayer supports:
如果您希望在较旧的浏览器中使用它，则必须提供 Flash 回退。例如，您可以使用jPlayer来完成。jPlayer 支持：
- HTML5: mp3, m4a (AAC), m4v (H.264), ogv, oga, wav, webm
- Flash: mp3, m4a (AAC), m4v (H.264)
- HTML5：mp3、m4a (AAC)、m4v (H.264)、ogv、oga、wav、webm
- 闪存：mp3、m4a (AAC)、m4v (H.264)
Keep in mind that Firefox doesn't have a native MP3 support so if you use HTML5 audio you have to also provide Ogg Vorbis for Firefox and some other browsers.
请记住，Firefox 没有本地 MP3 支持，因此如果您使用 HTML5 音频，您还必须为 Firefox 和其他一些浏览器提供 Ogg Vorbis。
回答by jessegavin
You should look at SoundManager 2.
你应该看看SoundManager 2。
It uses HTML5 if the browser supports it, but will degrade to using flash if it has to. The brilliant thing is that it has one API that works the same either way. I have used this tool on a few projects and it is amazing.
如果浏览器支持，它会使用 HTML5，但如果必须，它会降级为使用 Flash。最棒的是它有一个 API，无论哪种方式都一样。我已经在几个项目中使用过这个工具，真是太棒了。
Here's a description from their How it works page
这是他们的工作原理页面的描述
Problem:Browsers lack good, consistent native audio support. (HTML 5's Audio() is the future, but is still in development.)
Solution:Javascript API using HTML5 Audio() + headless Flash via ExternalInterface, works almost everywhere. If HTML5 is supported but "non-free" MP3/MP4 formats are not, flash is used as a fallback.
SoundManager 2 wraps and extends both the Flash and HTML Audio Sound APIs, providing a single, unified sound API to Javascript; the API is the same, whether HTML or Flash is ultimately used to play sound. (The flash portion is hidden, transparent to both developers and end users.)
问题：浏览器缺乏良好、一致的原生音频支持。（HTML 5 的 Audio() 是未来，但仍在开发中。）
解决方案：Javascript API 使用 HTML5 Audio() + Headless Flash 通过 ExternalInterface，几乎适用于所有地方。如果支持 HTML5 但不支持“非自由” MP3/MP4 格式，则使用 Flash 作为后备。
SoundManager 2 包装并扩展了 Flash 和 HTML 音频声音 API，为 Javascript 提供了单一、统一的声音 API；API 是一样的，无论最终是使用 HTML 还是 Flash 来播放声音。（闪存部分是隐藏的，对开发人员和最终用户都是透明的。）
回答by jessegavin
I just ran across this article from Thomas Fuchsthat covers several ways to play audio via Javascript without relying on a flash fall back.
我刚刚从 Thomas Fuchs那里看到了这篇文章，其中介绍了通过 Javascript 播放音频而不依赖 Flash 回退的几种方法。
Here are the main points of the article.
以下是文章的要点。
Mobile browsers
No solution for now unless the sound is to be played as direct result of user action (click)
移动浏览器 目前
没有解决方案，除非声音是作为用户操作（点击）的直接结果播放的
Browers with support for HTML5 <audio>element.
Requires that you provide the audio in three different formats.
支持 HTML5<audio>元素的浏览器。
要求您提供三种不同格式的音频。
if("Audio" in window){
var a = new Audio();
if(!!(a.canPlayType && a.canPlayType('audio/ogg; codecs="vorbis"').replace(/no/, '')))
a.src = "/sounds/ping.ogg";
else if(!!(a.canPlayType && a.canPlayType('audio/mpeg;').replace(/no/, '')))
a.src = "/sounds/ping.mp3";
else if(!!(a.canPlayType && a.canPlayType('audio/mp4; codecs="mp4a.40.2"').replace(/no/, '')))
a.src = "/sounds/ping.m4a";
else
a.src = "/sounds/ping.mp3";
a.autoplay = true;
return;
}
If you're dealing with IE <9
如果您正在处理 IE <9
<bgsound src="/sounds/ping.mp3" loop="1" autostart="autostart">
Otherwise test support for QuickTime, RealPlayer and Windows Media
Following code is written with Prototype.js
否则测试对 QuickTime、RealPlayer 和 Windows Media 的支持
以下代码是用 Prototype.js 编写的
// this code uses Prototype.js
if(navigator.plugins && $A(navigator.plugins).detect(function(p){ return p.name.indexOf('QuickTime') != -1 }))
Sound.template = new Template('<object id="sound_#{track}_#{id}" width="0" height="0" type="audio/mpeg" data="#{url}"/>');
else if(navigator.plugins && $A(navigator.plugins).detect(function(p){ return p.name.indexOf('Windows Media') != -1 }))
Sound.template = new Template('<object id="sound_#{track}_#{id}" type="application/x-mplayer2" data="#{url}"></object>');
else if(navigator.plugins && $A(navigator.plugins).detect(function(p){ return p.name.indexOf('RealPlayer') != -1 }))
Sound.template = new Template('<embed type="audio/x-pn-realaudio-plugin" style="height:0" id="sound_#{track}_#{id}" src="#{url}" loop="false" autostart="true" hidden="true"/>');
回答by TheBentArrow
I have created a JQuery Sound Plugin which is based on Thomas Fuchs article mentioned above by jessegavin. You can find it at https://github.com/thebentarrow/JQuery-Sound-Plugin
我创建了一个 JQuery 声音插件，它基于 jessegavin 上面提到的 Thomas Fuchs 文章。你可以在https://github.com/thebentarrow/JQuery-Sound-Plugin找到它
Please use, abuse and contribute!
请使用，滥用和贡献！
