天天看點

捕獲未處理的Promise錯誤

譯者按: 通過監聽unhandledrejection事件,可以捕獲未處理的Promise錯誤。

為了保證可讀性,本文采用意譯而非直譯,并且對源代碼進行了大量修改。另外,本文版權歸原作者所有,翻譯僅用于學習。

使用Promise編寫異步代碼時,使用reject來處理錯誤。有時,開發者通常會忽略這一點,導緻一些錯誤沒有得到處理。例如:

function main() {
    asyncFunc()
    .then(···)
    .then(() => console.log('Done!'));
}
           

由于沒有使用catch方法捕獲錯誤,當asyncFunc()函數reject時,抛出的錯誤則沒有被處理。

這篇部落格将分别介紹在浏覽器與Node.js中,如何捕獲那些未處理的Promise錯誤。

浏覽器中未處理的Promise錯誤

一些浏覽器(例如Chrome)能夠捕獲未處理的Promise錯誤。

unhandledrejection

監聽unhandledrejection事件,即可捕獲到未處理的Promise錯誤:

window.addEventListener('unhandledrejection', event => ···);
           

這個事件是PromiseRejectionEvent執行個體,它有2個最重要的屬性:

  • promise

    : reject的Promise
  • reason

    : Promise的reject值

示例代碼:

window.addEventListener('unhandledrejection', event =>
{
    console.log(event.reason); // 列印"Hello, Fundebug!"
});

function foo()
{
    Promise.reject('Hello, Fundebug!');
}

foo();
           

JavaScript

錯誤監控插件監聽了unhandledrejection事件,是以可以自動捕獲未處理Promise錯誤。

rejectionhandled

當一個Promise錯誤最初未被處理,但是稍後又得到了處理,則會觸發rejectionhandled事件:

window.addEventListener('rejectionhandled', event => ···);
           

這個事件是PromiseRejectionEvent執行個體。

window.addEventListener('unhandledrejection', event =>
{
    console.log(event.reason); // 列印"Hello, Fundebug!"
});

window.addEventListener('rejectionhandled', event =>
{
    console.log('rejection handled'); // 1秒後列印"rejection handled"
});

function foo()
{
    return Promise.reject('Hello, Fundebug!');
}

var r = foo();

setTimeout(() =>
{
    r.catch(e =>{});
}, 1000);
           

Node.js中未處理的Promise錯誤

監聽unhandledRejection事件,即可捕獲到未處理的Promise錯誤:

process.on('unhandledRejection', (reason, promise) => ···);
           
process.on('unhandledRejection', reason =>
{
    console.log(reason); // 列印"Hello, Fundebug!"
});

function foo()
{
    Promise.reject('Hello, Fundebug!');
}

foo();
           

注: Node.js v6.6.0+ 預設會報告未處理的Promise錯誤,是以不去監聽unhandledrejection事件也沒問題。

Node.js

錯誤監控插件監聽了unhandledRejection事件,是以可以自動捕獲未處理Promise錯誤。

參考

繼續閱讀