request.xhr undefined in Ext JS

Question

Meine Website wird mit Ext JS 4.1 Framework und ASP .Net MVC v3 erstellt. Wenn ein neuer Frame gerendert wird, gibt es 19 separate AJAX-Anfragen zum Abrufen von Daten im JSON-Format. Alle Anfragen sind vertraut und wurden von Ext.Ajax.request() gemacht. Beispiel:

Ext.Ajax.request({ 
    url: getOrderLink, 
    method: "GET", 
    params: { recId: orderRecId }, 
    headers: { 
     'Accept': 'application/json' 
    }, 
    success: function (response) { 
     var order = Ext.decode(response.responseText); 
     ... 
    } 
}); 

In einigen Fällen gibt es Fehler in ext-all.js in

onStateChange : function(request) { 
    if (request.xhr.readyState == 4) { 
     this.clearTimeout(request); 
     this.onComplete(request); 
     this.cleanup(request); 
    } 
}, 

wo Anfrage kein Eigentum xhr hat, so dass request.xhr.readyState Ausnahme auslöst „Eigenschaft nicht lesen kann‚Readstate 'von undefiniert'. Diese Fehler werden nicht für alle Anfragen angezeigt und wirken sich nicht auf die Site aus (Antworten werden erfolgreich abgerufen). Manchmal erscheinen diese Fehler gar nicht. Timeout für alle Anfragen ist standardmäßig auf 30s eingestellt und sie dauern jeweils etwa 1,5-2 Sekunden. Ich benutze Google Chrome 21. Könnten Sie mir bitte eine Idee geben, warum es passiert.

Answer 1

Das Problem scheint genau dann aufzutreten, wenn Sie einen Haltepunkt oder einen "Debugger" haben. Linie in irgendetwas mit AJAX verwandt. Bei mir ist es in Chrome passiert, habe noch keine anderen Browser ausprobiert.

In meinem Fall passierte es, wenn ich einen Haltepunkt in einem Load-Event-Handler für ein Geschäft wie Codebeispiel unten gesetzt hatte.

Der Fehler tritt jedoch auf, wenn Sie einen Haltepunkt innerhalb der Funktion Ext onStateChange auch im Framework selbst setzen.

Wenn Sie Ihre Breakpoints deaktivieren und debugger; aufrufen, können Sie den Fehler ignorieren.

There is a similar thread on ExtJS forums. Sencha might add a fix.

Ext.define('MyApp.controller.MyController', { 
    extend: 'Ext.app.Controller', 

    stores: ['Projects'], 

    init: function() { 
     this.getProjectsStore().addListener(
      "load", 
      this.onProjectsStoreLoaded, 
      this 
     ); 
    }, 

    onProjectsStoreLoaded: function() { 
     console.log('MyController: onProjectsStoreLoaded'); 

     debugger; // <- this causes the errors to appear in the console 

     SomeOtherThingsIWantedToDebug(); 
    } 
}