使用HTML5時某些軌道不可搜索使用JavaScript控制的音頻

Question

我正在編寫一個應用程序，它將歌曲加載到html音頻標籤中，並在頂部顯示一個HighCharts圖形，用戶可根據歌曲操作提供反饋。我正在控制音頻標籤的圖表，反之亦然。

通過控制我的意思是，當歌曲開始播放時，圖形開始填充點，當歌曲暫停時，圖形的人口也暫停。當我從音頻標籤中搜索歌曲時，點的添加位置也會改變。我使用來自HighCharts的點擊事件來將歌曲的當前時間設置爲x軸的值，因爲x軸代表歌曲持續時間（以秒爲單位）。請參閱下面的圖片以獲得澄清。

我的問題來自一些歌曲是可搜索的而其他歌曲不是。我在Chrome中運行該應用程序。當我在Firefox中運行它時，問題不存在。所有歌曲都可以搜索。

我設法要注意的是，如果問題存在，並且這首歌的長度，如果這個問題不存在，那

track.seekable.end(0) 

總是返回0。所有曲目長度不超過4分鐘，不超過6兆字節。

要在尋道形成的圖形，我使用

click: function(event) { 
    track.currentTime = parseInt(event.xAxis[0].value/1000); 
} 

Answer 1

我找到了答案。我使用Django作爲後端，我忘了在我的問題中提到。問題出現在django服務器的dev版本中。 django.views.static.serve中不支持字節範圍請求。

這可以通過使用here中的代碼或通過代理服務器運行您的應用程序來解決。第一次修復不太理想，因爲這會更改核心django文件，如果他們沒有相同的代碼，將無法解決其他開發人員在同一個應用程序上工作的問題，所以第二個修復程序是首選。

請記住，該問題僅在開發中存在，而不在生產中。