Ich verwende Recorder.js, um etwas mit der Audio-API aufzunehmen, und ich möchte dem Benutzer die Möglichkeit geben, seine Aufnahme vor dem Hochladen auf den Server zu hören. Der Aufnahme-Code basiert stark auf der supplied example, aber anstatt in WAV zum Herunterladen zu exportieren, verwende ich einen Blob und setze das src-Attribut eines Audio-Elements für die Wiedergabe. Der verantwortliche Code (genannt nach dem Stoppen der Aufnahme) wie folgt aussieht:Chrome unter Android kann keine aufgezeichneten Audiodateien von der Objekt-URL abspielen
function createAudioPlayer() {
recorder && recorder.exportWAV(function (blob) {
var url = URL.createObjectURL(blob);
var au = document.getElementById('recording');
au.src = url;
});
}
Es ergibt sich in etwa wie folgt: <audio id="recording" src="blob:https%3A//example.com/499ca96f-37b2-4515-bd1b-3c298f201dbd" controls="controls"></audio>
Wiedergabe von Audio in Chrome arbeitet 50 und Firefox 46 auf OS X 10.11, und in Edge 13 auf Windows 10. Chrome 50 auf Android 6.0 Aufzeichnungen und Uploads in Ordnung, aber verweigert die Wiedergabe mit dem folgenden Fehler, wenn play()
auf dem Audio-Element genannt wird:
Uncaught (in promise) DOMException: The element has no supported sources.
Ich habe versucht, type="audio/wav"
hinzuzufügen, aber das hat nicht funktioniert. Wenn ich die Datei von Blob (mit der Datei-API und XHR) hochlade und ein src
-Attribut mit einer 'normalen' URL der WAV-Datei auf dem Server verwende, wird sie ebenfalls wiedergegeben. Was sollte geändert werden, damit Benutzer ihre Aufnahme vor dem Hochladen anhören können?