问题 播放存储为blob的MP3文件


简而言之,我想在Firefox中播放blob MP3文件。

我可以访问blob本身: blob (用mime类型切片 audio/mpeg3),及其网址: blobURL = window.URL.createObjectURL(blob)

我尝试过:

  1. 一个HTML5音频播放器:

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

    但我在Firebug中收到警告,告诉我Firefox无法读取类型的文件 audio/mpeg3

  2. 多个音频播放器库(SoundManager类JPlayer,等等,但似乎没有允许blob URL作为输入。

我做错了吗?或者有没有人知道可以从blob播放MP3文件的变通方法或库?


12640
2017-10-22 02:42


起源

谢谢。您知道任何基于您的任何一种解决方案的现有音频播放器吗? - Axel
解决方案是什么? - Tjorriemorrie
这是2014年......你是谁,DenverCoder9!? xkcd.com/979 - Scott
这是很久以前的事了!幸运的是,Firefox现在可以 播放MP3文件 依靠OS的MP3解码器。从那时起我还没有再测试过,但我认为在HTML5源代码元素的src属性中提供blob URL现在可以正常工作(至少在Windows 7上)。 - Axel


答案:


这似乎对我来说很好,虽然我正在使用 audio/mpeg 作为MIME类型:

$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();

11
2018-02-25 11:27



这与使用HTML5音频播放器并将其传递给blob的URL几乎相同。所以它仍然依赖于支持MP3的浏览器/操作系统组合。 - Axel
不过,干净漂亮的Vanilla JavaScript!无论如何,多亏了Firefox 24,我想我的问题已不再适用了。 - Axel
谢谢你这个很好的解决方案,代码中存在小错误。 response => this.response - Jan Míšek