Play MP3 file stored as blob

Question

Put simply, I\'d like to play a blob MP3 file in Firefox.

I have access to both the blob itself: blob (sliced with mime type audio/mpeg3),

Answer 1

This seems to work fine for me, although I'm using audio/mpeg as the MIME Type:

$scope.player = new window.Audio();

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        $scope.player.src = window.URL.createObjectURL(this.response);
        $scope.player.play();
    }
};
xhr.open('GET', url);
xhr.responseType = 'blob';
xhr.send();

Answer 2

I realize this question has been answered already and that my findings are for a different browser (Chrome), but I thought I'd leave this here just in case someone in the future is having the same problem I did. I was having trouble playing a blob file through the audio player, but found that removing the source tag fixed things. So this wouldn't work:

<audio controls="controls">
    <source src="[blobURL]" type="audio/mp3">
</audio>

But this worked fine:

<audio controls="controls" src="[blobURL]" type="audio/mp3" />

I'm not sure why one would work and the other would not, but there it is. Hopefully this is useful to someone else down the line.