JavaScript: 找不到音频时重新加载页面

Question

所以，我有这个非常基本的脚本，可以在音频流服务器关闭时重新加载整个页面。要播放音频，我使用 HTML5 音频元素。

<script type="text/javascript">
    document.getElementById('audio').addEventListener("ended",function() {
        location.reload();
    });
</script>

我想做的是每次元素中没有源时刷新页面并保持刷新，直到源重新打开。

我尝试在页面第一次刷新后使用 HTML5 error 事件，由于 ended 事件被触发，音频源仍然丢失导致一个错误。我想"grab"这个错误，让浏览器重新刷新，直到音频没有错误为止

<script type="text/javascript">
    document.getElementById('audio').addEventListener("error",function() {
        location.reload();
    });
</script>

感谢您的宝贵时间。

Answer 1

与其重新加载整个页面，IMO 最好重试源代码：

var audio = document.getElementById('audio'),
    url = "path/to/audio.mp3";

audio.onerror = audio.onabort = function() {
  // show message to user about server being down/audio unavailable
  // retry -
  setTimeout(function() {
    audio.src = url;  // invokes new loading attempt
  }, 5000);           // attempts to reload every 5 seconds
};

audio.oncanplay = function() {
   // all OK
};

audio.src = url;

JavaScript: 找不到音频时重新加载页面

JavaScript: Reload the page when no audio is found

javascript

html5-audio