0
Я написал код для записи звука в браузере с MediaStreamRecorder. Он записывает, а затем отправляет звуковой тег с записанным аудио в DOM. В хроме все работает, за исключением того, что приглашение разрешить использование микрофона не исчезнет после нажатия кнопки. В firefox приглашение уходит, но звуковой тег не добавляется к DOM. Может ли кто-нибудь дать мне совет?Доступ к запросу разрешения микрофона с помощью Mediarecorder в Chrome и Firefox
$(document).ready(function() {
var audio = document.createElement('audio');
var mediaConstraints = { audio: true };
var mediaRecorder;
var formData;
var spinner = "<div id='bouncers'><div class='double-bounce1'></div><div class='double-bounce2'></div></div>";
$('#start-recording').on('click', function() {
navigator.getUserMedia(mediaConstraints, onMediaSuccess, onMediaError);
});
$('#stop-recording').on('click', function() {
this.disabled = true;
$('#start-recording').prop('disabled', false);
$('#submit-recording').prop('disabled', false);
$('.spinner').find('#bouncers').remove();
mediaRecorder.stop();
audio.controls = true;
console.log($('audio'));
$('#audiocontainer').append(audio);
});
$('#submit-recording').on('click', function() {
$.ajax({
url: $('#posturl').data('posturl'),
data: formData,
cache: false,
contentType: false,
processData: false,
type: 'POST'
});
});
function onMediaSuccess(stream) {
$('#start-recording').prop('disabled', true);
$('#stop-recording').prop('disabled', false);
mediaRecorder = new MediaStreamRecorder(stream);
mediaRecorder.mimeType = 'audio/ogg';
$('.spinner').prepend(spinner);
mediaRecorder.ondataavailable = function(blob) {
this.stop();
audio.src = URL.createObjectURL(blob);
formData = new FormData();
formData.append('recitation[recording]', blob);
};
var timeInterval = 30 * 1000;
mediaRecorder.start(timeInterval);
$('#stop-recording').disabled = false;
}
function onMediaError(e) {
console.error('media error', e);
}
// below function via: http://goo.gl/B3ae8c
function bytesToSize(bytes) {
var k = 1000;
var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
if (bytes === 0) return '0 Bytes';
var i = parseInt(Math.floor(Math.log(bytes)/Math.log(k)),10);
return (bytes/Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
}
// below function via: http://goo.gl/6QNDcI
function getTimeLength(milliseconds) {
var data = new Date(milliseconds);
return data.getUTCHours()+" hours, "+data.getUTCMinutes()+" minutes and "+data.getUTCSeconds()+" second(s)";
}
window.onbeforeunload = function() {
document.querySelector('#start-recording').disabled = false;
};
});