HTML5获取麦克风音频,输出到扬声器

这篇博客介绍了如何在HTML5中使用AudioContext接口获取麦克风输入的音频,并将其实时输出到扬声器,已在Chrome浏览器上成功测试。

本例子在谷歌浏览器上测试通过!

<!DOCTYPE html>
<html>
  <head>
    <title>HTML5获取麦克风音频,输出到扬声器</title>
	<meta charset="UTF-8">
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript">
		var audioCtx;
		try
		{
			audioCtx=new (window.AudioContext || window.webkitAudioContext)();
		}
		catch(e)
		{
			console.log("Your browser does not support AudioContext!");
		}
    	navigator.getUserMedia=(navigator.getUserMedia || navigator.webkitGetUserMedia || 
								navigator.mozGetUserMedia || navigator.msGetUserMedia);
		if(navigator.getUserMedia) 
		{
			navigator.getUserMedia(
      		{
      			audio:true
      		},
      		function(stream)
      		{
      			var source=audioCtx.createMediaStreamSource(stream);
          		var biquadFilter=audioCtx.createBiquadFilter();
          		biquadFilter.type="lowshelf";
          		biquadFilter.frequency.value=1000;
          		biquadFilter.gain.value=25;
          		source.connect(biquadFilter);
          		biquadFilter.connect(audioCtx.destination);
         	},
      		function(err)
      		{
      			console.log("The following gUM error occured: "+err);
      		});
      	}
      	else 
      	{
      		console.log("getUserMedia not supported on your browser!");
      	}
    </script>
  </head>
  <body>
    This is my HTML page. <br>
  </body>
</html>


评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值