javascript HTML5 中的音频数据流
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6593738/
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
Audio data streaming in HTML5
提问by Kartik Rustagi
I am receiving PCM audio data from the server in small chunks and having them stored in an Array. Now I would like to play these audio chunks sequentially without gaps using some HTML5 capability. Two options which I am looking at as 'possible' solutions are:
我正在以小块的形式从服务器接收 PCM 音频数据,并将它们存储在一个数组中。现在我想使用一些 HTML5 功能按顺序播放这些音频块而没有间隙。我认为“可能”解决方案的两个选项是:
- HTML5 Audio tag with Data URI
- Web audio API
While I am investigating these options, please suggest me any other option or views on the two options I am looking at. Though a cross platform solution will be the best but I can settle for Chrome only solution as
在我调查这些选项时,请向我建议任何其他选项或对我正在查看的两个选项的看法。虽然跨平台解决方案将是最好的,但我可以满足于 Chrome 唯一的解决方案
回答by ebidel
Scheduling audio is something the Web Audio API was designed for. If you have the decoded PCM audio chunks as typed arrays (AUDIO_CHUNKS
), you can create audio buffers for each chunk, and schedule them at an exact time (one after the other) using noteOn()
. Something like:
安排音频是 Web Audio API 的设计目标。如果您将解码的 PCM 音频块作为类型化数组 ( AUDIO_CHUNKS
),您可以为每个块创建音频缓冲区,并使用noteOn()
. 就像是:
var startTime = 0;
for (var i = 0, audioChunk; audioChunk = AUDIO_CHUNKS[i]; ++i) {
// Create/set audio buffer for each chunk
var audioBuffer = audioCtx.createBuffer(NUM_CHANNELS, NUM_SAMPLES, SAMPLE_RATE);
audioBuffer.getChannelData(0).set(audioChunk);
var source = audioCtx.createBufferSource();
source.buffer = audioBuffer;
source.noteOn(startTime);
source.connect(audioCtx.destination);
startTime += audioBuffer.duration;
}
回答by Oskar Eriksson
Option 1 will probably not work because the audio tag doesn't play raw audio data (which I assume is what you mean by PCM audio data, or am I wrong?). Every browser needs specific codecs. To top it of the audio tag is not reliable at all to play things without gaps.
选项 1 可能不起作用,因为音频标签不播放原始音频数据(我认为这就是您所说的 PCM 音频数据,还是我错了?)。每个浏览器都需要特定的编解码器。最重要的是,音频标签根本不可靠地播放没有间隙的东西。
Option 2 might work. The web audio api contains buffers which probably could be filled with raw data and played, but I've never tried doing so. The big drawback right now is that; a. Chrome only b. the user needs to configure chrome by typing about:flags and enable Web Audio which might be scary to some.
选项 2 可能有效。网络音频 api 包含可能填充原始数据并播放的缓冲区,但我从未尝试过这样做。现在最大的缺点是;一个。仅铬 B. 用户需要通过输入 about:flags 来配置 chrome 并启用网络音频,这可能会让某些人感到害怕。
A third option would be the Audio Data API which is something of a middle ground. I've never tried it myself, but from the spec it looks like exactly what you're looking for. I dunno about implementations though, so you'd have to do some research on your own :) https://wiki.mozilla.org/Audio_Data_API#Writing_Audio
第三种选择是音频数据 API,它是一种中间立场。我自己从未尝试过,但从规范来看,它看起来正是您要找的。我不知道实现,所以你必须自己做一些研究:) https://wiki.mozilla.org/Audio_Data_API#Writing_Audio
Please not that I'm giving these answers on top of my head, and I'm still pretty new to HTML5 audio.
请注意,我是在脑子里给出这些答案,而且我对 HTML5 音频还是很陌生。