Html html5音频直播
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16978301/
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
html5 audio livestreaming
提问by Daniel Garcia Sanchez
I'm creating my own audio, without controls of the browser.
我正在创建自己的音频，无需控制浏览器。
<audio src="http://50.7.98.194:8081/~dl3/cgi-bin/dl.cgi/bqmu5mltxcqy43mxecgo4gnw743qr7fd7io22q5xj4/gl1mwvp6b326.mp3" id="audio">
</audio>
I have these functions, called when clicked some buttons:
我有这些功能，当点击一些按钮时调用：
function play()
{
audio.play();
}
function play()
{
audio.pause
}
function stop()
{
audio.pause();
audio.src = audio.src;
}
But for now, I only can reproduce mp3 or ogg files, but not a live stream radio. I read about some plugins, but I need do it with pure html5.
但就目前而言，我只能复制 mp3 或 ogg 文件，而不能复制直播电台。我读了一些插件，但我需要用纯 html5 来做。
Could you help me, please? Thanks very much,
请问你能帮帮我吗？非常感谢，
采纳答案by kav
Unfortunately, there is still no single video and audio codec, which is supported by all browsers! The programmers have to ensure that there is fallback provided for use-cases where browser A doesn't support codec B and vice versa.
不幸的是，仍然没有所有浏览器都支持的单一视频和音频编解码器！程序员必须确保为浏览器 A 不支持编解码器 B 的用例提供回退，反之亦然。
You can take a look at this compatibility table, for both desktop and mobile browsers.
您可以查看此兼容性表，适用于桌面浏览器和移动浏览器。
Desktop:
桌面：
- Internet Explorer (9.0+) support MP3 and AAC codecs
- Chrome (6.0+) support Ogg Vorbis, MP3, WAV+
- Firefox (3.6+) support Ogg Vorbis, WAV
- Safari (5.0+) support MP3, AAC, WAV
- Opera (10.0+) support Ogg Vorbis, WAV
- Internet Explorer (9.0+) 支持 MP3 和 AAC 编解码器
- Chrome (6.0+) 支持 Ogg Vorbis、MP3、WAV+
- Firefox (3.6+) 支持 Ogg Vorbis、WAV
- Safari (5.0+) 支持 MP3、AAC、WAV
- Opera (10.0+) 支持 Ogg Vorbis、WAV
Mobile:
移动的：
- Opera Mobile (11.0+) supported codecs are device-dependent
- Android (2.3+) supported codecs are device-dependent
- Mobile Safari (iDevices with iOS 3.0+) support MP3, AAC
- Blackberry (6.0+) support MP3, AAC
- Opera Mobile (11.0+) 支持的编解码器取决于设备
- Android (2.3+) 支持的编解码器取决于设备
- Mobile Safari (iDevices with iOS 3.0+) 支持 MP3, AAC
- 黑莓 (6.0+) 支持 MP3、AAC
Since flash is still widespread enough, it's probably the safest fallback.
由于闪存仍然足够广泛，因此它可能是最安全的后备方案。
Also, I want to note that there's nothing worse to use some library, some of them (e.g. jPlayer) provides very powerful interface and this only can help you to produce better code!
另外，我想指出，使用一些库没有什么比这更糟糕的了，其中一些（例如 jPlayer）提供了非常强大的接口，这只能帮助您生成更好的代码！
I think you can find everything you want to know in the following article: HTML5 Audio Radio Player by Opera Devs
我想你可以在下面的文章中找到你想知道的一切：Opera Devs 的 HTML5 Audio Radio Player
回答by rogerdpack
Playing audio from a "live source" seems to be supported by modern browsers. Basically just use the normal HTML 5 audio tags, and input the "live stream" URL as the source, ex:
现代浏览器似乎支持从“实时源”播放音频。基本上只使用普通的 HTML 5 音频标签，并输入“实时流” URL 作为源，例如：
<audio controls>
<source src="http://audio-mp3.ibiblio.org:8000/wcpe.mp3" type="audio/mpeg">
<source src="http://audio-ogg.ibiblio.org:8000/wcpe.ogg" type="audio/ogg">
</audio>
And the stream "just works" as it were, though attempting to seek with the default controls does nothing. So eventually you may want to replace the controls with "custom" ones, in normal HTML 5 media style. For backward compatibility to non HTML 5 browsers, this project may be useful: https://github.com/etianen/html5media/wiki/Embedding-audio(haven't tested it with live streaming but could/should work). Mp3 codec seems to be supported in major browsers (barring possibly firefox on Linux [?]). Opus might be another nicely cross platform option, I'm not sure codec wise what is the "best" choice as it were.
并且该流“正常工作”，尽管尝试使用默认控件进行查找没有任何作用。因此，最终您可能希望用“自定义”控件替换普通 HTML 5 媒体样式中的控件。为了向后兼容非 HTML 5 浏览器，此项目可能有用：https: //github.com/etianen/html5media/wiki/Embedding-audio（尚未使用实时流对其进行测试，但可以/应该可以）。主要浏览器似乎支持 Mp3 编解码器（Linux 上可能不支持 firefox [?]）。Opus 可能是另一个很好的跨平台选项，我不确定编解码器明智的“最佳”选择是什么。
With some streams (shoutcast I presume) I have had to add a closing ';' to the URL, see https://stackoverflow.com/a/3182814/32453for notes there, but that's basically just to get the "right" url.
对于一些流（我认为是shoutcast），我不得不添加一个结束';' 到 URL，请参阅https://stackoverflow.com/a/3182814/32453中的注释，但这基本上只是为了获得“正确”的 url。
