Holen Sie sich den vollständigen call stack-trace der $http-Aufrufe

So, sehen Sie, das Problem ist vor allem, weil eckig s $http saugt. Tut mir Leid, dass.

Lassen Sie uns versuchen, die bluebird Bibliothek, denn es bietet langen stack traces.

Promise.longStackTraces();
Promise.resolve($http.get('...'));

Erhalten Sie die folgende Stapelüberwachung:

Possibly unhandled Error: [object Object]
    at Promise$_rejectFromThenable (http://cdn.jsdelivr.net/bluebird/1.2.4/bluebird.js:4736:52)
    at wrappedErrback (https://code.angularjs.org/1.3.0-beta.5/angular.js:11334:78)
    at wrappedErrback (https://code.angularjs.org/1.3.0-beta.5/angular.js:11334:78)
    at wrappedErrback (https://code.angularjs.org/1.3.0-beta.5/angular.js:11334:78)
    at https://code.angularjs.org/1.3.0-beta.5/angular.js:11467:76
    at Scope.$eval (https://code.angularjs.org/1.3.0-beta.5/angular.js:12418:28)
    at Scope.$digest (https://code.angularjs.org/1.3.0-beta.5/angular.js:12230:31)
    at Scope.$apply (https://code.angularjs.org/1.3.0-beta.5/angular.js:12522:24)
    at done (https://code.angularjs.org/1.3.0-beta.5/angular.js:8207:45)
    at completeRequest (https://code.angularjs.org/1.3.0-beta.5/angular.js:8412:7) 

(Plunker hier.)

Die wichtigste Linie ist die erste: Possibly unhandled Error: [object Object].

Yep. Ein Objekt geworfen wird, ist nicht eine Reale Error Objekt, mit dem stack - Eigenschaft angefügt. Für die Referenz, hier ist, wie zu werfen einen Fehler und halten Sie Ihren stack, zusammen mit: https://github.com/Ralt/newerror/blob/master/index.js

So, wie man dieses Problem beheben? Es hängt von mehreren Entscheidungen:

• Tun, die Sie hinzufügen möchten, ein richtiges Versprechen lib, die es ermöglicht, langen stack traces?
• Möchten Sie verwenden eine andere xhr-lib, wirft Fehler korrigieren?

Wenn Sie hinzufügen möchten ein echtes Versprechen lib verwenden bluebird. AFAIK, es ist einer der wenigen, die für langen stack traces, und es ist die Schnellste, die es gibt.

Für eine ordnungsgemäße xhr-lib, wirft echte Fehler, ich fürchte, du bist aus Glück gibt. Schreiben einer benutzerdefinierten mit der Unterstützung für Browser, die Sie wollen, ist nicht wirklich schwer aber. Ohne IE8-Unterstützung, diese funktioniert (mit bluebird):

function xhr(url) {
    return new Promise(function(resolve, reject) {
        var xhr = new XMLHttpRequest();
        xhr.onload = function() {
            resolve(xhr.responseText);
        };
        xhr.onerror = reject;
        xhr.open('GET', url);
        xhr.send();
    });
}

(Plunker hier.)

Wie Sie sehen können, ist der stack trace ist informativ:

Einer option, die kam in mein Geist ist zu erstellen, ein Modul für den $http-debugging, die Sie hinzufügen können es als Abhängigkeit in deinem main-Modul, wenn Sie brauchen, um debug $http calls. Gibt es einen decorator für den $http-Dienst registriert werden kann, wird melden Sie sich einfach, die Argumente des Aufrufs eine Weiterleitung an den $http-service. Dort ein breakpoint gesetzt werden kann, auch.

Habe ich eine einfache Beispiel arbeiten hier. Ich hoffe, es wird helfen.

Beispiel $http-logger decorator-Implementierung:

var httpDebugging = angular.module('http-debugging', []);

httpDebugging.decorator('$http', function ($delegate) {
  var debugAware = function (fnCallback) {
    return function () {
        var result = fnCallback.apply(this, arguments);    
        console.log('$http decorator: ', arguments);
        return result;
    };   
  }; 

  for(var prop in $delegate) {
    if (angular.isFunction($delegate[prop])) {
        $delegate[prop] = debugAware($delegate[prop]);
    }
  }

  return $delegate;
});