Question

所以，要做的是在下载音频文件时播放音频文件，面临的问题是音频播放器播放音频，但是只有在完成下载后，这是我的代码：

音频标签

<audio controls preload="all" muted="muted" > </audio>

这是我的JS

var audio = document.querySelector('audio');
var assetURL = 'url/audios/file';
var token = 'Bearer token'
var mimeCodec = 'audio/wav';

var mediaSource = new MediaSource; 
audio.src = URL.createObjectURL(mediaSource);
mediaSource.addEventListener('sourceopen', sourceOpen);
function sourceOpen(_) {
    const playPromise = audio.play();
    console.log(this.readyState); 
    var mediaSource = this;
    var sourceBuffer = mediaSource.addSourceBuffer(mimeCodec);
    fetchAB(assetURL, function (buf) {
        sourceBuffer.addEventListener('updateend', function (_) {
            mediaSource.endOfStream();
            audio.play();
            console.log(mediaSource.readyState); // ended
        });
        sourceBuffer.appendBuffer(buf);
    });
};
function fetchAB(url, cb) {
    console.log(url);
    var xhr = new XMLHttpRequest;
    xhr.open('get', url);
    xhr.setRequestHeader('Authorization', token);
    xhr.responseType = 'arraybuffer';
    xhr.onload = function () {
        cb(xhr.response);
    };
    xhr.send();
};

我不太确定该怎么做，对您有所帮助

Answer 1

您不能使用Web Audio API部分播放音频文件。您应该创建一个string Key = (string)apikey.GetValue("API", "").ToString(); Console.WriteLine(Key);元素并设置其src属性以加载文件，这种方法可以让您流式传输文件。

<audio>

但是，您的示例显示，您在加载文件时设置了标头，但上述方法无法使用，因此您应该摆脱该方法（尽管这似乎是规避它的一种方法：{{3} }）

Answer 2

我认为您可以简化代码：

var audio = new Audio('file.wav');

var promise = audio.play();

// Older browsers may not return promise
if (promise)
    promise.catch(function() { 
        // Couldn't play audio for some reason
    });

内置的Audio类支持缓冲，播放将尽快开始，而无需等待整个文件被下载。

在Audio Web API中下载音频文件时播放音频文件

2 个答案: