İstisna attığımda JavaScript yığın izlemesini nasıl alabilirim?

Bir JavaScript istisnasını kendim atarsam (ör. throw "AArrggg" ), Yığın izlemesini nasıl alabilirim (Firebug'da veya başka bir şekilde)? Şu anda sadece mesajı alıyorum.

edit : Aşağıdaki birçok kişi gönderdiği gibi, bir JavaScript istisnası için bir yığın izleme almak mümkündür ama benim istisnalar için bir yığın izleme almak istiyorum . Örneğin:

function foo() {
    bar(2);
}
function bar(n) {
    if (n < 2)
        throw "Oh no! 'n' is too small!"
    bar(n-1);
}

Zaman foodenir, ı çağrı içeren bir yığın izleme almak istiyor foo, bar, bar.

Düzenleme 2 (2017):

Tüm modern tarayıcılarda şunları arayabilirsiniz: console.trace(); (MDN Referansı)

Düzenleme 1 (2013):

Orijinal sorudaki yorumlarda belirtildiği gibi daha iyi (ve daha basit) bir çözüm stack, bir Errornesnenin özelliğini şu şekilde kullanmaktır :

function stackTrace() {
    var err = new Error();
    return err.stack;
}

Bu, şöyle çıktı üretir:

DBX.Utils.stackTrace@http://localhost:49573/assets/js/scripts.js:44
DBX.Console.Debug@http://localhost:49573/assets/js/scripts.js:9
.success@http://localhost:49573/:462
x.Callbacks/c@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
x.Callbacks/p.fireWith@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
k@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6
.send/r@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6

Arama işlevinin adını URL ile birlikte verme, arama işlevi vb.

Orijinal (2009):

Bu snippet'in değiştirilmiş bir versiyonu biraz yardımcı olabilir:

function stacktrace() { 
  function st2(f) {
    return !f ? [] : 
        st2(f.caller).concat([f.toString().split('(')[0].substring(9) + '(' + f.arguments.join(',') + ')']);
  }
  return st2(arguments.callee.caller);
}

Krom / krom (V8 kullanan diğer tarayıcılar) ve ayrıca Firefox'un , Hata nesnelerindeki bir yığın özelliği üzerinden yığın izlemesi elde etmek için uygun bir arayüze sahip olduğunu unutmayın .

try {
   // Code throwing an exception
} catch(e) {
  console.log(e.stack);
}

Temel istisnalar ve kendiniz attığınız olanlar için geçerlidir. (Yine de iyi bir uygulama olan Error sınıfını kullandığınız düşünülmüştür).

V8 belgelerine ilişkin ayrıntılara bakın

Firefox'ta, istisnayı atmanız gerekmiyor gibi görünüyor. Yapmak yeterli

e = new Error();
console.log(e.stack);

Firebug'ınız varsa, komut dosyası sekmesinde tüm hatalarda bir mola seçeneği vardır. Komut dosyası kesme noktanıza geldiğinde, kundakçı'nın yığın penceresine bakabilirsiniz:

Orijinal soru hakkındaki yorumlarda belirtildiği gibi iyi (ve basit) bir çözüm stack, bir Errornesnenin özelliğini şöyle kullanmaktır :

function stackTrace() {
    var err = new Error();
    return err.stack;
}

Bu, şöyle çıktı üretir:

DBX.Utils.stackTrace@http://localhost:49573/assets/js/scripts.js:44
DBX.Console.Debug@http://localhost:49573/assets/js/scripts.js:9
.success@http://localhost:49573/:462
x.Callbacks/c@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
x.Callbacks/p.fireWith@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
k@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6
.send/r@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6

Arama işlevinin adını URL ve hat numarası, arama işlevi vb. İle birlikte verme.

Şu anda üzerinde çalıştığım bir proje için oluşturduğum gerçekten ayrıntılı ve güzel bir çözümüm var ve genelleştirilmek için biraz çıkarttım ve yeniden çalıştım. İşte burada:

(function(context){
    // Only global namespace.
    var Console = {
        //Settings
        settings: {
            debug: {
                alwaysShowURL: false,
                enabled: true,
                showInfo: true
            },
            stackTrace: {
                enabled: true,
                collapsed: true,
                ignoreDebugFuncs: true,
                spacing: false
            }
        }
    };

    // String formatting prototype function.
    if (!String.prototype.format) {
        String.prototype.format = function () {
            var s = this.toString(),
                args = typeof arguments[0],
                args = (("string" == args || "number" == args) ? arguments : arguments[0]);
            if (!arguments.length)
                return s;
            for (arg in args)
                s = s.replace(RegExp("\\{" + arg + "\\}", "gi"), args[arg]);
            return s;
        }
    }

    // String repeating prototype function.
    if (!String.prototype.times) {
        String.prototype.times = function () {
            var s = this.toString(),
                tempStr = "",
                times = arguments[0];
            if (!arguments.length)
                return s;
            for (var i = 0; i < times; i++)
                tempStr += s;
            return tempStr;
        }
    }

    // Commonly used functions
    Console.debug = function () {
        if (Console.settings.debug.enabled) {
            var args = ((typeof arguments !== 'undefined') ? Array.prototype.slice.call(arguments, 0) : []),
                sUA = navigator.userAgent,
                currentBrowser = {
                    firefox: /firefox/gi.test(sUA),
                    webkit: /webkit/gi.test(sUA),
                },
                aLines = Console.stackTrace().split("\n"),
                aCurrentLine,
                iCurrIndex = ((currentBrowser.webkit) ? 3 : 2),
                sCssBlack = "color:black;",
                sCssFormat = "color:{0}; font-weight:bold;",
                sLines = "";

            if (currentBrowser.firefox)
                aCurrentLine = aLines[iCurrIndex].replace(/(.*):/, "$1@").split("@");
            else if (currentBrowser.webkit)
                aCurrentLine = aLines[iCurrIndex].replace("at ", "").replace(")", "").replace(/( \()/gi, "@").replace(/(.*):(\d*):(\d*)/, "$1@$2@$3").split("@");

            // Show info if the setting is true and there's no extra trace (would be kind of pointless).
            if (Console.settings.debug.showInfo && !Console.settings.stackTrace.enabled) {
                var sFunc = aCurrentLine[0].trim(),
                    sURL = aCurrentLine[1].trim(),
                    sURL = ((!Console.settings.debug.alwaysShowURL && context.location.href == sURL) ? "this page" : sURL),
                    sLine = aCurrentLine[2].trim(),
                    sCol;

                if (currentBrowser.webkit)
                    sCol = aCurrentLine[3].trim();

                console.info("%cOn line %c{0}%c{1}%c{2}%c of %c{3}%c inside the %c{4}%c function:".format(sLine, ((currentBrowser.webkit) ? ", column " : ""), ((currentBrowser.webkit) ? sCol : ""), sURL, sFunc),
                             sCssBlack, sCssFormat.format("red"),
                             sCssBlack, sCssFormat.format("purple"),
                             sCssBlack, sCssFormat.format("green"),
                             sCssBlack, sCssFormat.format("blue"),
                             sCssBlack);
            }

            // If the setting permits, get rid of the two obvious debug functions (Console.debug and Console.stackTrace).
            if (Console.settings.stackTrace.ignoreDebugFuncs) {
                // In WebKit (Chrome at least), there's an extra line at the top that says "Error" so adjust for this.
                if (currentBrowser.webkit)
                    aLines.shift();
                aLines.shift();
                aLines.shift();
            }

            sLines = aLines.join(((Console.settings.stackTrace.spacing) ? "\n\n" : "\n")).trim();

            trace = typeof trace !== 'undefined' ? trace : true;
            if (typeof console !== "undefined") {
                for (var arg in args)
                    console.debug(args[arg]);

                if (Console.settings.stackTrace.enabled) {
                    var sCss = "color:red; font-weight: bold;",
                        sTitle = "%c Stack Trace" + " ".times(70);

                    if (Console.settings.stackTrace.collapsed)
                        console.groupCollapsed(sTitle, sCss);
                    else
                        console.group(sTitle, sCss);

                    console.debug("%c" + sLines, "color: #666666; font-style: italic;");

                    console.groupEnd();
                }
            }
        }
    }
    Console.stackTrace = function () {
        var err = new Error();
        return err.stack;
    }

    context.Console = Console;
})(window);

Bunu göz atın GitHub'dan (şu anda v1.2)! Bunu gibi kullanabilirsiniz Console.debug("Whatever");ve ayarlara bağlı olarak Consoleçıktıyı ve yığın izlemesini (veya yalnızca basit bilgi / ekstra hiçbir şey) yazdırmaz. İşte bir örnek:

ConsoleNesnedeki ayarlarla oynadığınızdan emin olun ! İz çizgileri arasına boşluk ekleyebilir ve tamamen kapatabilirsiniz. İşte için Console.traceayarlanmış false:

Hatta gösterilen bilgi ilk bit (set kapatabilirsiniz Console.settings.debug.showInfoiçin false) ya da tamamen devre dışı hata ayıklama (set Console.settings.debug.enablediçin falsetekrar bir ayıklama deyimi yorum var asla)! Sadece onları bırakın ve bu hiçbir şey yapmaz.

Kullanabileceğiniz bir şey olduğunu düşünmüyorum, ancak kendi insanlarını yuvarlayan birçok örnek buldum.

• DIY javascript yığın izleme
• Herhangi bir tarayıcıda bir Javascript yığın izlemesi

Bir örneği atmış olsanız bile stack( stacktraceOpera'da) özelliklerine erişebilirsiniz Error. Şey emin kullandığınız yapmak gerekir, olduğunu throw new Error(string)(unutma yeni yerinethrow string .

Misal:

try {
    0++;
} catch (e) {
    var myStackTrace = e.stack || e.stacktrace || "";
}

Chrome tarayıcı ile şu console.traceyöntemi kullanabilirsiniz : https://developer.chrome.com/devtools/docs/console-api#consoletraceobject

Bu, modern Chrome, Opera, Firefox ve IE10 + için yığın izlemesi (dize dizisi olarak) verecektir

function getStackTrace () {

  var stack;

  try {
    throw new Error('');
  }
  catch (error) {
    stack = error.stack || '';
  }

  stack = stack.split('\n').map(function (line) { return line.trim(); });
  return stack.splice(stack[0] == 'Error' ? 2 : 1);
}

Kullanımı:

console.log(getStackTrace().join('\n'));

Kendi çağrısının yanı sıra Chrome ve Firefox tarafından kullanılan "Hata" başlığını (IE değil) hariç tutar.

Eski tarayıcılarda çökmemeli, sadece boş dizi döndürmelidir. Daha evrensel bir çözüme ihtiyacınız varsa stacktrace.js'ye bakın . Desteklenen tarayıcılar listesi gerçekten etkileyici ama bence bu küçük görev için çok büyük: Tüm bağımlılıkları içeren 37Kb küçültülmüş metin.

Eugene'nin yanıtı için bir güncelleme: IE'nin (belirli sürümler?) stackÖzelliği doldurması için hata nesnesi atılmalıdır . Aşağıdakiler mevcut örneğinden daha iyi çalışmalı ve undefinedIE'de geri dönmekten kaçınmalıdır .

function stackTrace() {
  try {
    var err = new Error();
    throw err;
  } catch (err) {
    return err.stack;
  }
}

Not 1: Bu tür şeyler yalnızca hata ayıklama sırasında yapılmalıdır ve özellikle sık arandığında, canlıyken devre dışı bırakılmalıdır. Not 2: Bu, tüm tarayıcılarda çalışmayabilir, ancak FF ve IE 11'de çalışıyor gibi görünüyor, ki bu benim ihtiyaçlarıma uygun.

Firebug'da gerçek yığın izini almanın bir yolu, tanımlanmamış bir işlevi çağırmak gibi gerçek bir hata oluşturmaktır:

function foo(b){
  if (typeof b !== 'string'){
    // undefined Error type to get the call stack
    throw new ChuckNorrisError("Chuck Norris catches you.");
  }
}

function bar(a){
  foo(a);
}

foo(123);

Veya yığın izini gösterdiğinden beri console.error()bir throwdeyim kullanın console.error().

Modern (2017) tarayıcılarda çalışan bu çoklu doldurma kodu (IE11, Opera, Chrome, FireFox, Yandex):

printStackTrace: function () {
    var err = new Error();
    var stack = err.stack || /*old opera*/ err.stacktrace || ( /*IE11*/ console.trace ? console.trace() : "no stack info");
    return stack;
}

Diğer cevaplar:

function stackTrace() {
  var err = new Error();
  return err.stack;
}

IE 11'de çalışmıyor!

Kullanılması arguments.callee.caller - herhangi bir tarayıcıda katı modda çalışmıyor!

Google Chrome'da (sürüm 19.0 ve sonrası), sadece bir istisna atmak mükemmel bir şekilde çalışır. Örneğin:

/* file: code.js, line numbers shown */

188: function fa() {
189:    console.log('executing fa...');
190:    fb();
191: }
192:
193: function fb() {
194:    console.log('executing fb...');
195:    fc()
196: }
197:
198: function fc() {
199:    console.log('executing fc...');
200:    throw 'error in fc...'
201: }
202:
203: fa();

tarayıcının konsol çıkışında yığın izlemesini gösterir:

executing fa...                         code.js:189
executing fb...                         code.js:194
executing fc...                         cdoe.js:199
/* this is your stack trace */
Uncaught error in fc...                 code.js:200
    fc                                  code.js:200
    fb                                  code.js:195
    fa                                  code.js:190
    (anonymous function)                code.js:203

Umarım bu yardım.

fonksiyon:

function print_call_stack(err) {
    var stack = err.stack;
    console.error(stack);
}

kullanım durumu:

     try{
         aaa.bbb;//error throw here
     }
     catch (err){
         print_call_stack(err); 
     }

<script type="text/javascript"
src="https://rawgithub.com/stacktracejs/stacktrace.js/master/stacktrace.js"></script>
<script type="text/javascript">
    try {
        // error producing code
    } catch(e) {
        var trace = printStackTrace({e: e});
        alert('Error!\n' + 'Message: ' + e.message + '\nStack trace:\n' + trace.join('\n'));
        // do something else with error
    }
</script>

bu komut dosyası hatayı gösterecek

function stacktrace(){
  return (new Error()).stack.split('\n').reverse().slice(0,-2).reverse().join('\n');
}

Partiye biraz geç, ama burada otomatik olarak tespit eden başka bir çözüm var arguments.callee olup olmadığını yoksa yeni Error (). Yığınını kullanan . Chrome, safari ve firefox'ta test edildi.

2 varyant - stackFN (n) size anında arayandan uzakta n fonksiyonunun adını verir ve stackArray () size anında arayan olan stackArray () [0] dizisini verir.

Http://jsfiddle.net/qcP9y/6/ adresinden deneyin.

// returns the name of the function at caller-N
// stackFN()  = the immediate caller to stackFN
// stackFN(0) = the immediate caller to stackFN
// stackFN(1) = the caller to stackFN's caller
// stackFN(2) = and so on
// eg console.log(stackFN(),JSON.stringify(arguments),"called by",stackFN(1),"returns",retval);
function stackFN(n) {
    var r = n ? n : 0, f = arguments.callee,avail=typeof f === "function",
        s2,s = avail ? false : new Error().stack;
    if (s) {
        var tl=function(x) { s = s.substr(s.indexOf(x) + x.length);},
        tr = function (x) {s = s.substr(0, s.indexOf(x) - x.length);};
        while (r-- >= 0) {
            tl(")");
        }
        tl(" at ");
        tr("(");
        return s;
    } else {
        if (!avail) return null;
        s = "f = arguments.callee"
        while (r>=0) {
            s+=".caller";
            r--;   
        }
        eval(s);
        return f.toString().split("(")[0].trim().split(" ")[1];
    }
}
// same as stackFN() but returns an array so you can work iterate or whatever.
function stackArray() {
    var res=[],f = arguments.callee,avail=typeof f === "function",
        s2,s = avail ? false : new Error().stack;
    if (s) {
        var tl=function(x) { s = s.substr(s.indexOf(x) + x.length);},
        tr = function (x) {s = s.substr(0, s.indexOf(x) - x.length);};
        while (s.indexOf(")")>=0) {
            tl(")");
            s2= ""+s;
            tl(" at ");
            tr("(");
            res.push(s);
            s=""+s2;
        }
    } else {
        if (!avail) return null;
        s = "f = arguments.callee.caller"
        eval(s);
        while (f) {
            res.push(f.toString().split("(")[0].trim().split(" ")[1]);
            s+=".caller";
            eval(s);
        }
    }
    return res;
}


function apple_makes_stuff() {
    var retval = "iPhones";
    var stk = stackArray();

    console.log("function ",stk[0]+"() was called by",stk[1]+"()");
    console.log(stk);
    console.log(stackFN(),JSON.stringify(arguments),"called by",stackFN(1),"returns",retval);
    return retval;
}



function apple_makes (){
    return apple_makes_stuff("really nice stuff");
}

function apple () {
    return apple_makes();
}

   apple();

Bu kütüphaneyi http://www.stacktracejs.com/ kullanabilirsiniz . Çok iyi

Belgelerden

IE veya Safari 5'te bulunmayan bir yığın izlemesi almak için kendi Hatanızı da iletebilirsiniz.

<script type="text/javascript" src="https://rawgithub.com/stacktracejs/stacktrace.js/master/stacktrace.js"></script>
<script type="text/javascript">
    try {
        // error producing code
    } catch(e) {
        var trace = printStackTrace({e: e});
        alert('Error!\n' + 'Message: ' + e.message + '\nStack trace:\n' + trace.join('\n'));
        // do something else with error
    }
</script>

İşte size maksimum performans (IE 6+) ve maksimum uyumluluk sağlayan bir cevap. IE 6 ile uyumlu!

    function stacktrace( log_result ) {
    	var trace_result;
    // IE 6 through 9 compatibility
    // this is NOT an all-around solution because
    // the callee property of arguments is depredicated
    /*@cc_on
    	// theese fancy conditinals make this code only run in IE
    	trace_result = (function st2(fTmp) {
    		// credit to Eugene for this part of the code
    		return !fTmp ? [] :
    			st2(fTmp.caller).concat([fTmp.toString().split('(')[0].substring(9) + '(' + fTmp.arguments.join(',') + ')']);
    	})(arguments.callee.caller);
    	if (log_result) // the ancient way to log to the console
    		Debug.write( trace_result );
    	return trace_result;
    @*/
    	console = console || Console;	// just in case
    	if (!(console && console.trace) || !log_result){
    		// for better performance in IE 10
    		var STerror=new Error();
    		var unformated=(STerror.stack || STerror.stacktrace);
    		trace_result = "\u25BC console.trace" + unformated.substring(unformated.indexOf('\n',unformated.indexOf('\n'))); 
    	} else {
    		// IE 11+ and everyone else compatibility
    		trace_result = console.trace();
    	}
    	if (log_result)
    		console.log( trace_result );
    	
    	return trace_result;
    }
// test code
(function testfunc(){
	document.write( "<pre>" + stacktrace( false ) + "</pre>" );
})();

Firefox'ta bir yığın izini IE'de olduğundan daha kolaydır, ancak temelde yapmak istediğiniz şey:

"Sorunlu" kod parçasını bir dene / yakala bloğuna sar:

try {
    // some code that doesn't work
    var t = null;
    var n = t.not_a_value;
}
    catch(e) {
}

"Hata" nesnesinin içeriğini inceleyecekseniz, aşağıdaki alanları içerir:

e.fileName: Sorunun e.lineNumber kaynağından geldiği kaynak dosya / sayfa. hata oluşması durumunda, yukarıdaki örnekte 'TypeError' olmalıdır. e.stack: İstisnaya neden olan yığın izini içerir

Umarım bu sana yardımcı olur.

IE11 ile smartgwt'ta sonsuz bir özyinelemeyi araştırmak zorunda kaldım, bu yüzden daha derinlemesine araştırmak için yığın izine ihtiyacım vardı. Sorun şu ki, dev konsolunu kullanamadım çünkü reprodüksiyon bu şekilde daha zordu.
Javascript yönteminde aşağıdakileri kullanın:

try{ null.toString(); } catch(e) { alert(e.stack); }

Vay canına - 6 yıl içinde tek bir kişi görmüyorum stack. Bir hata işleyicide yapabileceğiniz en kötü şey, var olmayan bir şeyi çağırmaktan dolayı bir hata atmaktır.

Diğerlerinin söylediği gibi stack, çoğunlukla kullanımı güvenlidir, ancak IE9 veya önceki sürümlerde desteklenmemektedir.

Beklenmedik hatalarımı günlüğe kaydediyorum ve yığın izlemesi oldukça önemli. Maksimum destek için önce Error.prototype.stackvar olup olmadığını ve bir işlev olup olmadığını kontrol ediyorum . Eğer öyleyse kullanmak güvenlidir error.stack.

        window.onerror = function (message: string, filename?: string, line?: number, 
                                   col?: number, error?: Error)
        {
            // always wrap error handling in a try catch
            try 
            {
                // get the stack trace, and if not supported make our own the best we can
                var msg = (typeof Error.prototype.stack == 'function') ? error.stack : 
                          "NO-STACK " + filename + ' ' + line + ':' + col + ' + message;

                // log errors here or whatever you're planning on doing
                alert(msg);
            }
            catch (err)
            {

            }
        };

Edit: Görünüşe göre stackbir özellik değil, bir özellik olduğundan eski tarayıcılarda bile güvenle çağırabilirsiniz. Hala kafam karıştı çünkü Error.prototypedaha önce benim için çalıştığından emin oldum ve şimdi işe yaramadı - bu yüzden neler olup bittiğinden emin değilim.

console.error(e.stack)Firefox kullanmak yalnızca günlüklerdeki yığın izini gösterir, Chrome da mesajı gösterir. Mesaj hayati bilgiler içeriyorsa, bu kötü bir sürpriz olabilir. Her zaman ikisini de günlüğe kaydet.

Sadece dene

throw new Error('some error here')

Bu, krom için oldukça iyi çalışır: