如何发送控制台消息和错误以提醒？

Question

我想将错误传递给警报,以警告用户他们在代码中犯了错误,即使他们没有打开控制台.

    var doc=(frame.contentWindow.document || obj.contentDocument|| obj.contentWindow);
    var head = doc.getElementsByTagName('head')[0];
    var scriptElement = doc.createElement('script');
    scriptElement.setAttribute('type', 'text/javascript');
    scriptElement.text = scripts;

    try{
        head.appendChild(scriptElement);
    }
     catch(e){ alert("error:"+e.message +"  linenumber:"+e.lineNumber);}

当脚本包含错误时,appendChild会抛出错误.它直接进入控制台,我希望它显示在警报中,因为它适用于孩子,他们可能不会检查控制台.try catch块不会捕获错误.我用eval(脚本)试了一下.

   try{
   eval(scripts);} catch(e){ alert("error:"+e.message +"  linenumber:"+e.lineNumber);}

这确实有效,但这意味着代码执行了两次,这在某些情况下非常不方便.

我试过猴子修补console.error:

       console.log=function(){alert("taking over the log");}
       console.error=function(){alert("taking over the log");}

但这只有在我真正使用console.error时才有效.不是在抛出实际错误时.如果不是console.error,在真正的错误情况下,什么函数将错误发送到控制台？我可以访问并更改它吗？有任何想法吗？帮助将非常感激.谢谢Jenita

Answer 1

虽然try ... catch可以处理脚本最初运行的代码,但Jenita表示它不会捕获语法错误,并且它也不会捕获稍后执行的回调函数抛出的错误(在try-catch完成后很久).这意味着任何传递给setTimeout或的函数都没有错误addEventListener.

但是,您可以尝试不同的方法.在窗口上注册一个错误监听器.

window.addEventListener("error", handleError, true);

function handleError(evt) {
    if (evt.message) { // Chrome sometimes provides this
      alert("error: "+evt.message +" at linenumber: "+evt.lineno+" of file: "+evt.filename);
    } else {
      alert("error: "+evt.type+" from element: "+(evt.srcElement || evt.target));
    }
}

当从回调函数抛出异常时,将调用此方法.但它也会触发一般的DOM错误,例如图像无法加载,您可能对此不感兴趣.

它也应该触发语法错误,但前提是它能够先运行,所以你应该将它放在一个可能包含错别字的单独脚本中!(稍后脚本中的语法错误将阻止同一脚本顶部的有效行运行.)

不幸的是,我从未找到过evt在Firefox中获取行号的方法. (编辑:逛逛,我想现在可能就在那里.)

我在尝试编写FastJSLogger时发现了这一点,FastJSLogger是一个页面记录器,当浏览器devtools有点慢时我用它.

我不顾一切地想要获取行数,我开始尝试使用包装器setTimeout,addEventListener这将重新引入围绕这些调用的try-catch.例如:

var realAddEventListener = HTMLElement.prototype.addEventListener;

HTMLElement.prototype.addEventListener = function(type,handler,capture,other){
    var newHandler = function(evt) {
        try {
            return handler.apply(this,arguments);
        } catch (e) {
            alert("error handling "+type+" event:"+e.message +"  linenumber:"+e.lineNumber);
        }
    };

    realAddEventListener.call(this,type,newHandler,capture,other);
};

显然,这应该在任何事件监听器注册之前完成,甚至可能在加载jQuery之类的库之前完成,以防止它们addEventListener在我们能够替换它之前获取对实际的引用.