Arhn - архитектура программирования

Потоковое аудио в реальном времени с WebRTC и WebAudio (WebSockets)

Я пытаюсь настроить систему потоковой передачи звука в реальном времени, в которой клиент будет транслировать звук со своего микрофона (доступ к которому осуществляется с помощью getUserMedia) одному или нескольким одноранговым узлам. Для этого фрагменты аудиопотока отправляются через WebSocket на сервер, который затем передает эту информацию всем одноранговым узлам, подключенным к WebSocket.

Моя основная проблема связана с тем, как воспроизводить фрагменты данных, полученных одноранговыми узлами на веб-сайте.

Во-первых, вот как я отправляю фрагменты аудиоданных на свой клиент, транслирующий JS-скрипт:

var context = new AudioContext();
var audioStream = context.createMediaStreamSource(stream);
// Create a processor node of buffer size, with one input channel, and one output channel
var node = context.createScriptProcessor(2048, 1, 1);
// listen to the audio data, and record into the buffer
node.onaudioprocess = function(e){
        var inputData = e.inputBuffer.getChannelData(0);
        ws.send(JSON.stringify({sound: _arrayBufferToBase64(convertoFloat32ToInt16(inputData))}));
}
audioStream.connect(node);
node.connect(context.destination);

arrayBufferToBase64 и convertoFloat32ToInt16 — это методы, которые я использую для отправки соответственно потока в формате base64 и для преобразования inputData в Int16 вместо этого причудливого представления Float32 (я использовал методы, найденные в SO, которые должны были работать).

Затем, после того как данные прошли через WebSocket, я собираю данные в другом скрипте, который будет выполняться на сайте каждого пира:

var audioCtx = new AudioContext();
var arrayBuffer = _base64ToArrayBuffer(mediaJSON.sound);
audioCtx.decodeAudioData(arrayBuffer, function(buffer) {
     playSound(buffer);
});

Мне также нужно преобразовать полученные данные base64 в ArrayBuffer, которые затем будут декодированы с помощью decodedAudioData для создания audioBuffer типа AudioBuffer. Функция playSound проста:

function playSound(arrBuff) {
    var src = audioCtx.createBufferSource();
    src.buffer = arrBuff;
    src.looping = false;
    src.connect(audioCtx.destination);
    src.start();
}

Но по некоторым причинам я не могу воспроизвести звук в этом сценарии. Я почти уверен, что сценарий вещания правильный, но не сценарий «слушателя». Может ли кто-нибудь помочь мне в этом?

Спасибо !


  • Почему бы не использовать WebRTC и позволить браузеру сделать всю работу за вас? Сколько сверстников? См. также: stackoverflow.com/a/20850467/362536 09.10.2014
  • @Brad Текущая архитектура, которую я использую, основана на WebSocket для всей связи между сервером и клиентами, и я не могу изменить ее на одноранговую WebRTC. Одновременно может быть подключено много пиров. Я уже проверил эту ссылку, но моя проблема связана со способом воспроизведения звука на веб-сайте клиента при получении новых фрагментов данных. 09.10.2014
  • Вы уверены, что область audioBuffer верна? Если это не глобальная область, я не уверен, что это было бы. 09.10.2014
  • @cwilso Вы имеете в виду, что audioBuffer не следует объявлять внутри функции? Разве область действия не будет правильной, если она будет объявлена ​​до decodeData ? 09.10.2014
  • @Hawknight Не используйте base64, используйте двоичные данные. Это намного эффективнее. Затем вам нужно будет самостоятельно буферизовать данные и воспроизвести их с помощью узла сценария. Вы не можете просто воспроизвести буфер по мере его поступления. Это будет вырезано и будет непредсказуемым, поскольку время всегда будет меняться. 09.10.2014
  • @Brad Итак, вы предлагаете отправлять данные без преобразования в base64 (необработанные данные)? Но я действительно не понимаю, как я должен действовать на стороне слушателя, чтобы затем воспроизводить аудиоданные, которые я получил от WebSocket. 09.10.2014
  • @Hawknight Да, пропуск кодировки base64 намного эффективнее. Для воспроизведения вам необходимо настроить свои собственные буферы и создать узел сценария с API веб-аудио и контролировать его вывод на основе данных, которые вы буферизировали. Другими словами, вам придется заново изобретать все колесо потоковой передачи с управлением буфером, декодированием и всем прочим. 09.10.2014
  • @Brad Я начал писать код воспроизведения, но не понимаю, зачем мне заново изобретать колесо потоковой передачи. У вас есть пример воспроизведения аудиобуфера? Из того, что я видел, мне в основном нужно использовать AudioBuffer, который я отправляю через WebSocket. Разве функции playSound недостаточно? 12.10.2014
  • @Hawknight Нет, playSound абсолютно недостаточно. Подумайте об этом... как вы будете управлять синхронизацией воспроизведения? Вы должны быть точны в образце, и единственный способ сделать это — использовать скриптовый узел. Вы не можете просто воспроизвести материал по мере его поступления. Вы можете отставать на секунду или больше, и это в обычных случаях. Вы должны буферизовать звук самостоятельно. Вы должны воспроизвести его самостоятельно. Вы создаете свой собственный транспорт для аудио, поэтому вы не можете использовать ничего встроенного для управления воспроизведением. 12.10.2014
  • @Hawknight Я бы хотел сделать то же самое. Я буду передавать звуки стетоскопа, и мне нужно, чтобы это было без потерь. Просто интересно узнать, получилось ли у вас? Если да, не могли бы вы опубликовать свое решение здесь? Спасибо! 12.02.2015
  • @RandyFindley Я бы хотел вам помочь, но мы решили не продолжать разработку звуковой обратной связи в реальном времени, это действительно сложно реализовать, как вы можете видеть из комментариев. 13.02.2015
  • Я знаю, что это старый вопрос, но я могу заметить ошибку... playSound вызывается до установки audioBuffer. Вам нужно будет вызвать его из обратного вызова, чтобы убедиться, что он установлен перед его использованием. Вам даже не нужно audioBuffer. Вы можете просто использовать playSound(buffer). 16.08.2015
  • Действительно, это может быть потенциальной ошибкой, я обновил код с вашим исправлением! Спасибо. 17.08.2015

Новые материалы

Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..