Как получить данные микрофона из AudioContext

Итак, я только что узнал, что вы можете записывать звук с помощью JavaScript. Это просто потрясающе!

Я мгновенно создал новый проект, чтобы сделать что-то самостоятельно. Однако, как только я открыл исходный код скрипта-примера, то обнаружил, что поясняющих комментариев нет вообще.

Я начал гуглить и нашел длинную и интересную статью об AudioContext, которая не t вообще не знать о записи (в ней упоминаются только звуки ремиксов) и Статья MDN, которая содержит всю информацию — успешно скрывая ту, которая мне нужна.

Я также знаю о существующих фреймворках, которые имеют дело с этим (как-то, может быть). Но если бы я хотел иметь диктофон, я бы его скачал, но мне действительно любопытно, как эта штука работает.

Теперь я не только не знаком с частью кодирования, мне также любопытно, как все это будет работать — получу ли я интенсивность в определенное время? Как в любом осциллографе? Или я уже могу получить спектральный анализ образца?

Итак, просто чтобы избежать ошибок: пожалуйста, кто-нибудь может объяснить самый простой и прямой способ получить входные данные с помощью вышеупомянутого API и в конечном итоге предоставить код с пояснительными комментариями?


javascript html audiocontext
person Tomáš Zato - Reinstate Monica    schedule 21.05.2014    source источник
comment
Добро пожаловать в плохо документированный и плохо поддерживаемый мир Web Audio API! К сожалению, это не лучший формат для SO-вопроса, но я направлю вас к хорошей пояснительной статье: codeartists.com/post/36746402258/   -  person CodingIntrigue    schedule 21.05.2014
comment
WebAudio API предназначен только для микширования звуков. Чтобы получить данные микрофона, вы хотите использовать navigator.getUserMedia   -  person Bergi    schedule 21.05.2014
comment
@RGraham Прошу прощения, но разве плохо задокументированная вещь не является хорошим предметом для вопроса? Я могу читать документацию для хорошо документированных, не так ли? :) Но спасибо за ссылку   -  person Tomáš Zato - Reinstate Monica    schedule 21.05.2014
comment
@TomášZato Это хорошая тема, но этот вопрос кажется немного широким. Вы в основном спрашиваете, как это работает, с примерами, и это хорошая тема для книги, но не для переполнения стека.... на мой взгляд...   -  person CodingIntrigue    schedule 21.05.2014
comment
Ну, я не ожидал, что это может быть настолько сложно. Я прочитал статью, на которую вы ссылались. Он использует recorder.js, о котором я уже говорил, и мне больше нужны необработанные данные для визуализации звука, чем фактическая запись звука.   -  person Tomáš Zato - Reinstate Monica    schedule 21.05.2014

Ответы (1)


arrow_upward
1
arrow_downward

Если вы просто хотите использовать микрофонный вход в качестве источника в WebAudio API, у меня сработал следующий код. Он основан на: https://gist.github.com/jarlg/250decbbc50ce091f79e.

navigator.getUserMedia = navigator.getUserMedia
                      || navigator.webkitGetUserMedia
                      || navigator.mozGetUserMedia;
navigator.getUserMedia({video:false,audio:true},callback,console.log);

function callback(stream){
  ctx = new AudioContext();
  mic = ctx.createMediaStreamSource(stream);
  spe = ctx.createAnalyser();
  spe.fftSize = 256;
  bufferLength = spe.frequencyBinCount;
  dataArray = new Uint8Array(bufferLength);
  spe.getByteTimeDomainData(dataArray);
  mic.connect(spe);
  spe.connect(ctx.destination);
  draw();
}

person Ivo Tebexreni    schedule 05.04.2020