使用javascript / html5即时生成声音

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (46)

是否有可能用javascript / html生成一个不变的声音流?例如,要产生永久正弦波,我需要一个回调函数,只要输出缓冲区将变为空时就会调用该函数:

function getSampleAt(timestep)
{
    return Math.sin(timestep);
}

(我的想法是使用它来制作一个交互式合成器,我不知道一个键将被按下多久,所以我不能使用固定长度的缓冲器)

提问于
用户回答回答于

使用HTML5音频元素

使用JavaScript和该元素的跨浏览器生成持续音频目前尚不可行,

“没有办法排队合成音频的大块无缝播放”。

使用Web Audio API

该网络音频API的设计,方便的JavaScript音频合成。Mozilla开发者网络有一个基于Web的音频发生器,可以在Firefox 4 + [ demo 1 ]中使用。添加这两行代码,你必须用生成的音频持续按键时工作合成器[ 演示2 -在Firefox 4只作品,首先单击“结果”区域,然后按任何键]:

window.onkeydown = start;  
window.onkeyup = stop;

BBC的Web Audio API页面也值得一读。不幸的是,对Web Audio API的支持尚未扩展到其他浏览器。

可能的解决方法

目前要创建一个跨浏览器的合成器,你可能必须通过以下方式回退预先录制的音频:

  1. 使用长时间预先录制的ogg / mp3采样音调,将它们嵌入单独的audio元素中,并在按键时启动和停止它们。
  2. 嵌入包含音频元素的swf文件并通过JavaScript控制播放。
用户回答回答于

您现在可以在大多数浏览器中使用Web Audio API除了IE和Opera Mini)。

试试这个代码:

// one context per document
var context = new (window.AudioContext || window.webkitAudioContext)();
var osc = context.createOscillator(); // instantiate an oscillator
osc.type = 'sine'; // this is the default - also square, sawtooth, triangle
osc.frequency.value = 440; // Hz
osc.connect(context.destination); // connect it to the destination
osc.start(); // start the oscillator
osc.stop(context.currentTime + 2); // stop 2 seconds after the current time

如果你想降低音量,你可以这样做:

var context = new webkitAudioContext();
var osc = context.createOscillator();
var vol = context.createGain();

vol.gain.value = 0.1; // from 0 to 1, 1 full volume, 0 is muted
osc.connect(vol); // connect osc to vol
vol.connect(context.destination); // connect vol to context destination
osc.start(context.currentTime + 3); // start it three seconds from now

扫码关注云+社区

领取腾讯云代金券