Ошибка: больше запланированных задач было запланировано. Использование XMLHttpRequest.open в Angular 2

Question

В угловом2 необходимо создать глобальный запрос на перехват http, чтобы захватить в том числе запросы страницы через templateUrl в @Component декоратор.

Тогда я реализовал следующим образом:

(function (open) { 

    XMLHttpRequest.prototype.open = function (method, url, async, user, pass) { 

     this.addEventListener("readystatechange", function (data) { 
      if (data.target.readyState === 4) { 
       console.log(data); 
       console.log(data.target.responseURL); 
      } 
     }, false); 
     open.call(this, method, url, async, user, pass); 
    }; 

})(XMLHttpRequest.prototype.open); 

Но эта реализация работает, но в конечном итоге вызывает повторяющуюся ошибку на консоли, при создании запроса на сервер через объект Http, несмотря на реализацию, кажется, продолжают работу должным образом.

Ошибка заключается в следующем:

core.umd.js:3370 EXCEPTION: More tasks executed then were scheduled. 
core.umd.js:3375 ORIGINAL STACKTRACE: 
core.umd.js:3376 Error: More tasks executed then were scheduled. 
    at ZoneDelegate._updateTaskCount (zone.js:269) 
    at ZoneDelegate.invokeTask (zone.js:240) 
    at Zone.runTask (zone.js:136) 
    at ZoneTask.invoke (zone.js:304) 
    at XMLHttpRequest.<anonymous> (zone.js:1266) 
    at ZoneDelegate.invokeTask (zone.js:236) 
    at Object.onInvokeTask (core.umd.js:6149) 
    at ZoneDelegate.invokeTask (zone.js:235) 
    at Zone.runTask (zone.js:136) 
    at XMLHttpRequest.ZoneTask.invoke (zone.js:304) 

И до того, как ошибка появляется следующее warnnig:

Synchronous XMLHttpRequest on the main thread is deprecated 
because of its detrimental effects to the end user's experience. 
For more help, check https://xhr.spec.whatwg.org/. 

я увидел zone.js конспекты и управляет асинхронных запросов, и я считаю, что линия open.call(this, method, url, async, user, pass); является причиной проблемы. Поэтому я думаю, что я должен сделать этот блок кода также управляемым zone.js, так как похоже, что я делаю запрос из этого с этим перехватчиком. Это верно? Как мне это сделать?

Окружающая среда:

• Угловой: 2.0.2;
• zone.js: 0.6.25

Answer 1

Возможная альтернатива решения:

Я изменил способ, которым я перехваченное XMLHttpRequest запросы. Поскольку способ, которым это делалось, закончил создание нового запроса XMLHttpRequest полностью вне контекста zone.js, что, возможно, привело к возникновению проблемы.

Альтернатива, которую я пробовала, и я использую, - это перехват и продолжение того же запроса без потери исходного контекста. Вот альтернатива кода вопроса:

(function (_that) { 
    // Stores the current instance 
    var proxied = XMLHttpRequest.prototype.open; 
    // Override the current instance 
    XMLHttpRequest.prototype.open = function() { 
     this.addEventListener("readystatechange", function (data) { 
      if (data.target.readyState === 4) { 
       console.log(data); 
       console.log(data.target.responseURL); 
      } 
     }, false); 

     // Continuous request for current instance 
     return proxied.apply(this, [].slice.call(arguments)); 
    }; 
})(this); 

Решение на основе этого ответа: https://stackoverflow.com/a/7778218/2290538

Note: This is working for my specific case, I have no guarantee that this is a comprehensive solution. Please let me know of possible alternatives or improvements to the solution.