如何在 Javascript 中捕獲 404 錯誤？

Question

我有一個 HTML 音頻元素，我正在將該元素的“src”屬性動態設置為存儲在我們局域網上的音頻文件。

這是它的工作原理：

function setSource(source) {
   audio.src = source;
}

var audio = new Audio();
var source = "http://localhost/folder/file.mp3";
setSource(source);

有時，我指向的源音頻文件的鏈接已損壞，這會導致生成 404 錯誤並將其記錄到瀏覽器控制台。

我希望能夠捕獲 404 錯誤，以防止它們被記錄到控制台。

這是我嘗試的方式：

function setSource(source) {
  try {
    audio.src = src;
  }//end try
  catch (e) {
    //do nothing
  }//end catch
}//end setSource

var audio = new Audio();
var source = "http://localhost/folder/file.mp3";
setSource(source);

不幸的是，我的 try/catch 語句完全沒有做任何事情，錯誤仍然記錄到控制台。 我做錯了什么嗎？

由於我的應用程序的性質，會有很多 404 錯誤，這是正常的和預期的，但對用戶來說它看起來非常不穩定和“丑陋”（如果他們碰巧打開控制台）。

僅供參考：我正在使用谷歌瀏覽器。

Answer 1

在這種情況下，在瀏覽器控制台中記錄 HTTP 錯誤是瀏覽器獨有的功能，而不是 Javascript 或任何其他網站代碼。

這是無法阻止的。

Answer 2

audio.onload = function() {
    console.log('success');
};
audio.onerror = function() {
    console.log('fail');
};
audio.src = 'http://localhost/folder/file.mp3';

Answer 3

是的。 通過最近的更新，這是可能的。 您可以在此處啟用它：DevTools->Settings->General->Console->Hide network messages。

如何在 Javascript 中捕獲 404 錯誤？