如何在浏览器上使用手机麦克风录音？
Posted
技术标签:
【中文标题】如何在浏览器上使用手机麦克风录音？【英文标题】：How to record using phone microphone on browsers? 【发布时间】：2014-02-05 02:08:06 【问题描述】：我正在尝试从浏览器录制声音，但它仅适用于我的 mac 中的 chrome 浏览器，但在任何其他浏览器中都不起作用。我的目标是通过浏览器记录手机的声音。
我一直在尝试以下示例，但它不适用于移动浏览器。它会打开麦克风，但不会停止录音，也不会播放。
我认为问题出在没有被调用的 recorder.stop() 周围。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
</script>
</head>
<body>
<audio controls autoplay></audio>
<script type="text/javascript" src="recorder.js"> </script>
<input onclick="startRecording()" type="button" value="start recording" />
<input onclick="stopRecording()" type="button" value="stop recording and play" />
<script>
var onFail = function(e)
console.log('Rejected!', e);
;
var onSuccess = function(s)
var context = new webkitAudioContext();
var mediaStreamSource = context.createMediaStreamSource(s);
recorder = new Recorder(mediaStreamSource);
recorder.record();
// audio loopback
// mediaStreamSource.connect(context.destination);
window.URL = window.URL || window.webkitURL;
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
var recorder;
var audio = document.querySelector('audio');
function startRecording()
if (navigator.getUserMedia)
navigator.getUserMedia(audio: true, onSuccess, onFail);
else
console.log('navigator.getUserMedia not present');
function stopRecording()
//alert("hello");
recorder.stop();
recorder.exportWAV(function(blob)
//audio.src = window.URL.createObjectURL(s);
var url = URL.createObjectURL(blob);
audio.src = url;
audio.controls = true;
var hf = document.createElement('a');
hf.href = url;
hf.download = new Date().toISOString() + '.wav';
//upload(blob);
audio.src = url;
);
function upload(blobOrFile)
var xhr = new XMLHttpRequest();
xhr.open('POST', '/upload.aspx', true);
xhr.onload = function (e)
var result = e.target.result;
;
xhr.send(blobOrFile);
</script>
</body>
</html>
【问题讨论】：
对于AudioContext，您使用的是webkit 前缀。这意味着它只能在某些webkit 浏览器中工作。您可能想检查AudioContext、webkitAudioContext、mozAudioContext 等是否存在，然后选择存在的那个（如果有）。然而，对MDN 的快速检查表明 Chrome 是唯一可用的
【参考方案1】：
目前只有 Chrome 支持 AudioContext 接口。 Firefox 也有一个实现，但仅在 Nightly 构建中。
我不确定这些浏览器的移动版本是否支持。
【讨论】：
以上是关于如何在浏览器上使用手机麦克风录音？的主要内容，如果未能解决你的问题，请参考以下文章