2013-02-18 11 views
8

So supposedly starting at Firefox > 4, Bindung des Fensters jQuery-Objekt an beforeunload funktioniert nicht mehr.Senden Sie AJAX an Server vorunload

Was würde ich tun wollen, ist ein AJAX Beitrag, um die Memcache-Daten meines Servers zu löschen.

Wenn ich die einzige offene Registerkarte aktualisieren, kann ich sehen, dass das Ereignis beforeunload in Firefox und Chrome mit dem folgenden Code aufgerufen wird, wie durch die console.log Nachricht "firefox/NON-firefox delete" belegt. Das Problem ist, dass ich nie die console.log Nachricht "Memcache löschen" sehe, die anzeigt, dass mein Server die $.ajax Anfrage nie gesehen hat.

Ich weiß, es ist schlecht, Browser Sniffing zu tun, und es gibt keinen Unterschied zwischen dem, was in den if und else-Anweisungen enthalten ist. Ich zeige nur Code für das, was ich erfolglos in Firefox versucht habe.

Wer hat irgendwelche Ideen?

$(window).bind('beforeunload', function(){ 
    if(/Firefox[\/\s](\d+)/.test(navigator.userAgent) && new Number(RegExp.$1) >= 4) { 
    console.log('firefox delete'); 
    memcacheDelete(); 
    return null; 
    } 
    else { 
    console.log('NON-firefox delete'); 
    memcacheDelete(); 
    return null; 
    } 
}); 

function memcacheDelete() { 
    $.ajax({ 
     url: "/memcache/delete", 
     type: "post", 
     data:{}, 
     success:function(){ 
      console.log('memcache deleted'); 
     }//success 
    }); //ajax 
} 

Antwort

11

Ajax ist asynchron.

Wenn Sie Ihren Browser aktualisieren (oder schließen), wird beforeunload aufgerufen. Und das bedeutet, sobald beforeunload fertig ausgeführt ist, wird die Seite aktualisiert (oder geschlossen).

Wenn Sie tun, um eine Ajax-Anforderung, (seit seinem asynchron) JavaScript-Interpreter für Ajax nicht success Ereignis wartet ausgeführt werden und nach unten bewegt, um die Ausführung von beforeunload beenden.

success von Ajax soll nach ein paar Sekunden aufgerufen werden, aber Sie sehen es nicht als Seite wurde aktualisiert/geschlossen.

Randbemerkung:

.success() Methode ist veraltet und wird durch die .done() Methode ersetzt

Reference

+0

ja ... die Art, wie ich verstehen asynch dies nennt, ist, was ich dachte ... + 1 – cliffbarnes

+1

@Jashwant, danke für die explanation.Though Ich habe Beweise, dass das Löschen von Memcache erfolgreich war, wenn Chrome nach dem Schließen/erneuten Öffnen des Browsers verwendet wurde, aber es löscht ** immer noch ** nicht mit Firefox. Es scheint etwas anderes hier zu geschehen .. würde die '$ .ajax' in synchrone,' async: false' umwandeln, Hilfe? –

+4

Es sieht so aus, als ob [die '$ .ajax' Option' async' in 'false' geändert wird] (http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings), um das Problem zu beheben. Gibt es einen Grund, warum man das nicht möchte? –

7

Nur aus Gründen der Fertigstellung, hier ist was ich getan habe, dank @Jashwant für die Anleitung: Ich bemerkte, dass this other SO Q&A suggested the same solution. Der Schlüssel ist die async:true(false) im $.ajax Anruf unter:

$(window).bind('beforeunload', function(){ 
    if(/Firefox[\/\s](\d+)/.test(navigator.userAgent) && new Number(RegExp.$1) >= 4) { 
    console.log('firefox delete'); 
    var data={async:false}; 
    memcacheDelete(data); 
    return null; 
    } 
    else { 
    console.log('NON-firefox delete'); 
    var data={async:true}; 
    memcacheDelete(data); 
    return null; 
    } 
}); 

function memcacheDelete(data) { 
    $.ajax({ 
    url: "/memcache/delete", 
    type: "post", 
    data:{}, 
    async:data.async, 
    success:function(){ 
     console.log('memcache deleted'); 
    }//success 
    }); //ajax 
} 
+1

Nur um meine Neugier zu füttern. Was ist die Bedeutung (Verwendung) von '&& new Number (RegExp. $ 1)> = 4' in Ihrer Firefox-Erkennungsroutine (wenn)? Nur sicherstellen, dass Firefox in der Version 4 oder neuer ist? – trejder

+0

ja würde ich mir so vorstellen –

Verwandte Themen