2013-04-11 125 views
7

有人可以帮助我如何使用HTML5从默认麦克风捕获音频吗? 有很多样品可用,但他们都没有工作。 我已经试过Audio capturing with HTML5 因为它只适用于启用了标记的chrome。但它得到了NavigatorUserMediaError。地址栏上的视频图标有红色十字标记,其工具提示“此页面已被阻止访问您的摄像头和麦克风”HTML5从默认麦克风捕获音频

回答

8

HTML5 Rocks上有一些很棒的文章。这只是我拉的一个。 http://updates.html5rocks.com/2012/09/Live-Web-Audio-Input-Enabled

// success callback when requesting audio input stream 
function successCallback(stream) { 
    var audioContext = new (window.webkitAudioContext)(); 

    // Create an AudioNode from the stream. 
    var mediaStreamSource = audioContext.createMediaStreamSource(stream); 

    // Connect it to the destination to hear yourself (or any other node for processing!) 
    mediaStreamSource.connect(audioContext.destination); 
} 

function errorCallback() { 
    console.log("The following error occurred: " + err); 
} 

navigator.webkitGetUserMedia({audio:true}, successCallback, errorCallback); 
+1

感谢您的回复。我也是这样。但似乎不工作。从链接我们可以得到两个样本的实时演示。 [One](http://webaudiodemos.appspot.com/pitchdetect/index.html)和[Two](http://chromium.googlecode.com/svn/trunk/samples/audio/visualizer-live.html),但似乎没有工作。都要求我允许使用麦克风,但之后没有任何反应。唯一的变化是标题图标上缓缓闪烁着一个红色的球。我的Chrome是最新的,我也启用了'网络音频输入'。任何人都可以提供工作示例。 – abduIntegral 2013-04-23 06:16:31

+0

上的任何更新? – 2013-05-25 19:04:50

+1

当这些API是新的时,HTML5 Rocks创建了一些网络音频演示,但他们从未更新API演进的演示。可悲的是,他们的一些网络音频演示不再有效。 – 2014-11-02 22:09:22

3

确保您从网络服务器开始演示 - 简单地复制/粘贴文件系统&启动将无法正常工作 - 在Chrome中你永远不会进入话筒这种方式。

2

最近(不知道什么时候)Chrome添加了通过SSL访问页面以启用getUserMedia的要求。