2

我正在使用raygun来跟踪我的前端错误。Raygun 通过挂钩属性来利用 EventError window.onerror。到目前为止,一切都很好。

我的应用程序是用 ES6 编写的,它使用生成器。我使用babel编写符合 ES6 Web 浏览器的代码并使用 webpack来捆绑它。由于我正在使用generators,我还在我的 HTML 中导入 Babelpolyfill以及我的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:
runApp@webpack:///../index.js?:86:11
initSteps$@webpack:///../index.js?:161:21
tryCatch@http://172.16.0.2/container/lib/polyfill.js:6151:37
invoke@http://172.16.0.2/container/lib/polyfill.js:6442:22
defineIteratorMethods/</prototype[method]@http://172.16.0.2/container/lib/polyfill.js:6203:16
resume@webpack:////Users/matteo/Documents/em3/container/web_src/lib/utils.js?:25:9
initSteps$/<@webpack:///../index.js?:148:25
run@http://172.16.0.2/container/lib/polyfill.js:3911:22
notify/<@http://172.16.0.2/container/lib/polyfill.js:3924:28
flush@http://172.16.0.2/container/lib/polyfill.js:1209:9
MutationCallback*[64]</module.exports@http://172.16.0.2/container/lib/polyfill.js:1228:5
[198]<@http://172.16.0.2/container/lib/polyfill.js:3837:26
s@http://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
s@http://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
s@http://172.16.0.2/container/lib/polyfill.js:1:246
e@http://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');的生成器功能移到外面,我会收到预期的警报。我怎样才能避免这种行为?

4

1 回答 1

1

似乎在您的生成器中抛出的错误是从承诺上下文发生的,并且未处理的承诺拒绝与未捕获的同步错误的处理方式不同。

要捕获未捕获的 Promise 拒绝,您可以使用以下命令,例如:

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

对于一些较旧的 polyfill 或较旧的原生 Promise,您可能需要执行以下操作:

window.onunhandledrejection = function(event) { ...};
于 2017-01-31T16:04:43.370 回答