Нет метаданных при записи аудио webm с MediaRecorder - PullRequest
Новая
       18

Нет метаданных при записи аудио webm с MediaRecorder

0 голосов
/ 05 сентября 2018

Для моего проекта я записываю пользовательское аудио с помощью MediaRecorder, и оно почти нормально работает. Моя проблема возникает, когда я хочу отобразить форму волны пользовательской записи, используя Wavesurfer.js, который не загружает мою запись. Тем не менее, воспроизведение записи с использованием элемента Audio работает нормально.

После попытки использовать разные источники, кажется, что в конечном файле .webm нет большого количества метаданных, даже продолжительности или битрейта (даже если я установил его в параметрах MediaRecorder). Вот вывод из ffprobe с одним из файлов:

Ввод # 0, matroska, webm, из '206_3.webm':
Метаданные:
кодировщик: Chrome
Продолжительность: N / A, начало: 0,000000, битрейт: N / A
Поток № 0: 0 (англ): аудио: opus, 48000 Гц, моно, fltp (по умолчанию)

Итак, мой вопрос: я делаю что-то не так для записи звука? Вот как я начинаю запись: 

// Somewhere in the code...
this._handleUserMedia(await navigator.mediaDevices.getUserMedia({ audio: true }));

// ... and elsewhere
_handleUserMedia(stream) {
    this._mediaRecorder = new MediaRecorder(stream, { audioBitsPerSecond : 64000 });

    this._mediaRecorder.ondataavailable = event => {
      this._mediaBuffer.push(event.data);
    };

    this._mediaRecorder.onstop = () => {
      // Ajoute le buffer et une URL vers le buffer dans les résultats pour la sauvegarde et le playback
      let blob = new Blob(this._mediaBuffer, { type: "audio/webm" });
      this.state.results[this.state.currentWordIdx].recordingBlob = blob;
      this.state.results[this.state.currentWordIdx].recordingUrl = URL.createObjectURL(blob);

      // Réinitialise le buffer pour l'enregistrement suivant
      this._mediaBuffer = [];

      this._gotoNextWord();
    };

    this._gotoNextWord();
  }

Как вы видите, я создаю BLOB-объект, который позже сохраняю с помощью fs.writeFile NodeJS. Затем, когда мне нужно отобразить форму сигнала, я загружаю файл, используя fs.readFile, например: 

fs.readFile(`${this.getAppData()}/${filePath}`, (err, buffer) => {
    if (err) { reject(err); }
    const blob = new Blob([buffer], {type : 'audio/webm'});
    resolve(URL.createObjectURL(blob)); // Si besoin d'un ArrayBuffer => toArrayBuffer(buffer)
});
...