2017-01-31 63 views
2

我使用raygun來跟蹤我的前端錯誤。 Raygun通過掛鉤window.onerror屬性來利用EventError。到現在爲止還挺好。babel polyfill捕獲我的錯誤代替讓它們冒泡

我的應用程序是用ES6編寫的,它使用了生成器。我使用babel來編寫符合ES6網頁瀏覽器的代碼和webpack來捆綁它。由於我使用的是generators,我還在我的HTML中導入了Babel polyfill以及我的entry chunk。我不會將它導入到我的應用程序中,因爲HTML頁面可能會加載其他應用程序,而這些應用程序又可能會嘗試運行polyfill。這樣,只運行一個polyfill實例。

<script src="/container/lib/polyfill.js"></script> 
<script src="/container/vendor.bundle.js"></script> 
<script src="/container/myApp.js"></script> 

爲了確保window.onerror作品,我第一次寫我自己的錯誤處理程序(當然,我已經從MDN複製它):

window.onerror = function (msg, url, lineNo, columnNo, error) { 
    var string = msg.toLowerCase(); 
    var substring = "script error"; 
    if (string.indexOf(substring) > -1){ 
     alert('Script Error: See Browser Console for Detail'); 
    } else { 
     var message = [ 
      'Message: ' + msg, 
      'URL: ' + url, 
      'Line: ' + lineNo, 
      'Column: ' + columnNo, 
      'Error object: ' + JSON.stringify(error) 
     ].join(' - '); 

     alert(message); 
    } 

    return false; 
}; 

因此,運行我的代碼,我希望一個美妙的老式警報。

不幸的是,我得到的是我的錯誤日誌中的消息,但window.onerror鉤不抓住它:

Unhandled promise rejection Error: test 
Analisi dello stack: 
[email protected]:///../index.js?:86:11 
[email protected]:///../index.js?:161:21 
[email protected]://172.16.0.2/container/lib/polyfill.js:6151:37 
[email protected]://172.16.0.2/container/lib/polyfill.js:6442:22 
defineIteratorMethods/</prototype[method]@http://172.16.0.2/container/lib/polyfill.js:6203:16 
[email protected]:////Users/matteo/Documents/em3/container/web_src/lib/utils.js?:25:9 
initSteps$/<@webpack:///../index.js?:148:25 
[email protected]://172.16.0.2/container/lib/polyfill.js:3911:22 
notify/<@http://172.16.0.2/container/lib/polyfill.js:3924:28 
[email protected]://172.16.0.2/container/lib/polyfill.js:1209:9 
MutationCallback*[64]</[email protected]://172.16.0.2/container/lib/polyfill.js:1228:5 
[198]<@http://172.16.0.2/container/lib/polyfill.js:3837:26 
[email protected]://172.16.0.2/container/lib/polyfill.js:1:246 
s/<@http://172.16.0.2/container/lib/polyfill.js:1:305 
[295]<@http://172.16.0.2/container/lib/polyfill.js:6017:1 
[email protected]://172.16.0.2/container/lib/polyfill.js:1:246 
s/<@http://172.16.0.2/container/lib/polyfill.js:1:305 
[1]</<@http://172.16.0.2/container/lib/polyfill.js:5:1 
[1]<@http://172.16.0.2/container/lib/polyfill.js:2:2 
[email protected]://172.16.0.2/container/lib/polyfill.js:1:246 
[email protected]://172.16.0.2/container/lib/polyfill.js:1:425 
@http://172.16.0.2/container/lib/polyfill.js:1:11 

而如果我將我的throw new Error('test');超出了我的發電機的功能,我得到預期的警報。我怎樣才能避免這種行爲?

回答

1

好像你的發生器內引發的錯誤從一個承諾情境發生,未處理的承諾,拒絕由未捕獲同步錯誤處理方式不同。

爲了趕上一個未捕獲的承諾甩你可以使用下面的,例如:

window.addEventListener("unhandledrejection", function (event) { 
    console.warn("WARNING: Unhandled promise rejection. Reason: " 
       + event.reason); 
}); 

對於某些老式的polyfills以上原生的承諾,你可能需要做的,而不是執行以下操作:

window.onunhandledrejection = function(event) { ...}; 
+0

做你注意到'tryCatch @ http://172.16.0.2/container/lib/polyfill.js:6151:37'這一行?我想polyfill.js抓住了一切 – Bertuz