前端audio填坑chrome

前段时间公司项目要用audio自定义播放器，需求倒是挺简单的只要设置一个播放器的界面就可以的，如下:

播放器

但是遇到audio的duration获取有问题，代码如下：

function getDuration(previewURL, audioInstance, successFunc, errorFunc) {
    var audioControl = new Audio(previewURL);
    audioControl.addEventListener('durationchange', function (e) {
        if (e.target.duration !== Infinity && !isNaN(e.target.duration)) {
            successFunc(audioInstance, e.target);
        }
    }, false);
    audioControl.addEventListener('error', function (e) {
        errorFunc(e.target);
    });
}

按照上面的方法，获取的时长需要差不多播放完才可以获取，这真是一个坑爹的问题。

因为需求是在播放的时候显示进度但是播放完才能显示进度怎么搞？难搞哦。

在网上查了那种资料，都没有解决，都说是浏览器chrome的bug，经过测试并不是，因为通过换一个音频的链接就可以，因为项目使用的是后端提供的一个接口，经过对比发现后端返回的音频流response的header没有content-length，content-type等必要字段，加上发现就可以正常获取了