可搜索的html5音频未捕获错误:IndexSizeError:DOM异常1

时间:2013-06-19 04:41:14

标签: javascript html5 flask html5-audio soundmanager2

我在尝试使用HTML5 API(也使用SoundManager2)时遇到了问题。当试图找到一首歌的持续时间,以便我可以在歌曲播放时制作进度条。我一直在控制台中遇到以下错误:

Uncaught Error: IndexSizeError: DOM Exception 1

这里使用的代码取得了进展:

<a href="/uploads/song_71.mp3" class="song" id="song_71"></a>
<audio id="song" preload="auto" src=""></audio>

<script>

  var song = document.getElementById("song");
  song.addEventListener("timeupdate", function(){
    var end = this.seekable.end(0),
        curr = this.currentTime,
        prog = (curr / end) * 100;

    console.log(this.currentTime, this.duration)
  })

  song.play()

  document.getElementById("play_song").addEventListener("click", function(e){    
    var song_file = this.href;
    song.src = song_file
    song.play()

    if(e){ e.preventDefault(); }
    return false;
  })

</script>

1 个答案:

答案 0 :(得分:0)

这令人难以置信地令人沮丧,因为我在网上找不到任何帮助我决定发布我的答案。我确信这可能是我遇到的一个非常具体的问题,但如果其他人遇到这个问题也不会感到惊讶。我正在使用Flask开发服务器,它没有发送适当的标题/ mimetypes MP3。看到我正在使用这个shortcut function

@app.route('/uploads/<path:filename>')
def download_file(filename):
    return send_from_directory(app.config['UPLOAD_FOLDER'], filename)

一旦我将文件移动到实时服务器(我将Apache直接提供静态文件),错误就被消除了。希望这有助于其他一些可怜的灵魂: - )