2017-03-28 1 views
-1

ich diesen Code haben:Safari und IE Ajax Probleme mit nachfolgenden Aufrufen (.then)

var request1 = this.add(prod_id, pack_id_combination, button, pack_qty).then(function(rdata1){ 
    // this always works 
    this.add(prod_id, case_id_combination, button, case_qty).then(function(rdata2){  
    // this sometimes (random) doesn't work 
    }.bind(this), function(req, status, error){ console.log('case error',req, status, error); }); 
}.bind(this), function(){ console.log('pack error'); }); 

ich den Rest des Codes weggelassen, weil es eine große Klasse und es ist auch unmöglich, eine jsfiddle zu bauen, zu viele Dinge.

Aber hier ist die Fakten:

  • meine js verweist auf eine PHP-Datei zurückgegebenen Daten. Es funktioniert Ajax Anrufe über die add() Funktion (siehe unten)

  • es funktioniert immer für den ersten Anruf, es funktioniert manchmal nicht für den zweiten Anruf.

  • auf dem Protokoll, Status = ‚Fehler‘, Fehler = ‚‘ (leer, so dass keine Informationen hier)

  • ich sicher weiß auch, dass die zweite add(), wenn sie allein mit derselben genannt Params, wird immer funktionieren.

  • Darüber hinaus hat es diese Probleme nur in Safari und IE, nicht in Chrom, ff, android

  • Darüber hinaus hat es diese Probleme nur, wenn Online getestet, während in meiner lokalen Umgebung immer einwandfrei funktioniert.

  • Safari sagt, es verliert die Verbindung. Dies ist die einzige Information, die ich

die add() Funktion ist ziemlich trivial bekommen:

add:function(idProduct, idCombination, callerElement, quantity){ 
    return $.ajax({ 
     type: 'POST' 
     ,headers: { "cache-control": "no-cache" } 
     ,url: baseUri + '?rand=' + new Date().getTime() 
     ,cache: false 
     ,dataType : "json" 
     ,data: 'controller=cart&add=1&ajax=true&qty=' + ((quantity && quantity != null) ? quantity : '1') + '&id_product=' + idProduct + '&token=' + static_token + ((parseInt(idCombination) && idCombination != null) ? '&ipa=' + parseInt(idCombination): '') 
     ,success:function(data, status, req){ 
      console.log('ok'); 
     } 
     ,error:function(jqXHR, textStatus, errorThrown){ 
      console.log(jqXHR.responseText, textStatus, errorThrown); 
     } 
    }); 
},//end add() 

Also, meine Frage: Gibt es eine Möglichkeit, dieses Problem zu vermeiden? Ist es eine häufige Falle? Gibt es gängige Praktiken, um diese Art von Problemen zu vermeiden?

+0

Wie geschrieben, es wird definitiv nicht funktionieren. Im Ausdruck 'this.a.then (function() {this.b()})' wird das zweite 'this'-Objekt der globale Bereich sein, der mit ziemlicher Sicherheit nicht das ist, was Sie wollen. In "this.a.then (() => {this.b()})" zeigen beide auf dasselbe Objekt. – Malvolio

+0

Mmm bist du sicher? Ich bin alles bindend. Auch, wie geschrieben, in der Tat funktioniert es nicht nur auf Remote-Umgebung und nur in Safari und IE. – Stratboy

+0

ziemlich sicher. Es ist der Hauptunterschied zwischen Fettpfeil und diesem. – Malvolio

Antwort

0

Ok, mein Problem wurde gelöst, indem Sie eine GET Anfrage anstelle eines POST eins.

Wahrscheinlich sind sowohl Safari als auch IE nicht in der Lage, 2 nachfolgende ajax POST-Anfragen korrekt zu verwalten, zumindest unter bestimmten Umständen. Oder die jquery 2.1.3 (version used here) Implementierung hat einige subtile Probleme/Bugs.

Aber da ich oft zufällig css/js Probleme sowohl mit IE (Überraschung ...) und Safari (ja ...) habe, denke ich, es ist sie und nicht jquery.