在 HTML5 音频中设置 currentTime 无法正常工作

Question

我在我的项目中构建了一个音乐播放器，一切正常。
但在某些mp3文件中我无法设置音频元素的

currentTime

。
例如这段代码：

src = "music path";
const audioElement = new Audio(src);
let playPromise = audioElement.play();
if (playPromise!==undefined){
    playPromise.then(function() {
        // promised audio started
        audioElement.currentTime = 20;
        console.log(audioElement.currentTime);

        }).catch(function(error) {
        // promised audio failed
    });
}

程序结果 =>

0

当我设置新的当前时间时，音频从头开始，时间变为零。
音频文件是安全的，其时长为 120 秒，所以这个问题不是因为音频时长不足。
我用谷歌搜索了一下这个问题，并意识到应该在Http Headers中进行一些设置。其实我根本不知道这是什么！但我认为我需要正确设置此设置：

accept-ranges: bytes

Content-Length: BYTE_LENGTH_OF_YOUR_FILE

Content-Range: bytes 0-BYTE_LENGTH_OF_YOUR_FILE/BYTE_LENGTH_OF_YOUR_FILE

content-type: audio/mp3

我该如何解决这个问题呢？什么是 HTTP headers 以及如何修改它？
我的后端是Python / Django Framework。

Answer 1

音频文件的标题就像它的序言或简介，它列出了音频文件的长度、格式、编码方法（用于减小文件大小）以及播放它所需的其他数据等信息。

您可以使用音频编辑软件（例如 Audacity）轻松修改音频文件及其关联的标题。

对于您的代码，您可以使用 .addEventListener 将事件添加到您的 audioElement const 中，其中包含 'canplay' 事件，如果音频文件可以在浏览器上播放，则会触发该事件。

例如： audioElement.addEventListener('canplay', function() {[此处为您的代码]}