it-swarm.com.de

$ (Fenster) .Unload warten AJAX Beenden Sie den Vorgang, bevor Sie eine Webseite verlassen

Wenn ein Benutzer eine Webseite in meiner Anwendung verlässt, muss ich grundsätzlich ein PHP -Skript mit AJAX aufrufen, das eine auf der Webseite verbrachte Zeit in die Datenbank einfügt und die Seite dann verlässt.

Es ist wichtig, zu warten, bis die Anforderung AJAX abgeschlossen ist, da Webseiten in meiner Anwendung für Benutzer nicht zugänglich sind, es sei denn, sie haben eine bestimmte Zeit auf einer vorherigen Seite verbracht (beispielsweise zwei Minuten).

Hier ist mein Jquery-Code:

$(document).ready(function() {

    var teid = TEID;
    var startTime = new Date().getTime();

    $(window).unload(function() {
        var timeSpentMilliseconds = new Date().getTime() - startTime;
        var t = timeSpentMilliseconds / 1000 / 60;

        $.ajax({
            type: 'POST',
            url: '/clientarea/utils/record-time',
            data: 'teid=' + teid + '&t=' + t
        });
    });

});

Wie kann ich es ändern, damit es auf die Anforderung von AJAX wartet, bevor es die Webseite verlässt?

BEARBEITEN:

Oder es ist vielleicht besser (einfacher), die Anforderung von AJAX etwa jede Minute wiederholen zu lassen. Ist das möglich?

31
Richard Knop

Nun, Sie können async: false bei Ihrem AJAX - Aufruf festlegen, damit der Browser wartet, bis die Anforderung abgeschlossen ist, bevor Sie irgendetwas anderes tun. Beachten Sie jedoch, dass dadurch der Browser für die Dauer der Anforderung "hängen bleibt".

$.ajax({
    type: 'POST',
    async: false,
    url: '/clientarea/utils/record-time',
    data: 'teid=' + teid + '&t=' + t
});

Aus dem Handbuch:

Standardmäßig werden alle Anforderungen asynchron gesendet (d. H. Dies ist standardmäßig auf true gesetzt). Wenn Sie synchrone Anforderungen benötigen, setzen Sie diese Option auf false. Domänenübergreifende Anforderungen und Datentyp: "Jsonp" -Anforderungen unterstützen keine synchrone Operation. Beachten Sie, dass synchrone Anforderungen den Browser möglicherweise vorübergehend sperren und alle Aktionen deaktivieren, während die Anforderung aktiv ist.

31
Tatu Ulmanen

Die beste Lösung ist die Verwendung von navigator.sendBeacon . Es handelt sich um eine brandneue Funktionalität, die in neuen Versionen von Browsern implementiert wird. Die Funktion steht in Browsern zur Verfügung, die neuer als Chrome 39 und Firefox 31 sind. Sie wird zum Zeitpunkt der Erstellung nicht von Internet Explorer und Safari unterstützt. Um sicherzustellen, dass Ihre Anfrage in Browsern gesendet wird, die die neue Funktion noch nicht unterstützen, können Sie diese Lösung verwenden:

var navigator.sendBeacon = navigator.sendBeacon || function (url, data) {
  var client = new XMLHttpRequest();
  client.open("POST", url, false); // third parameter indicates sync xhr
  client.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
  client.send(data);
};

Hoffe das hilft! 

7
user1319331

Wie wäre es, wenn Sie einen Cookie im Entladehandler setzen? Der Server sollte es in den nachfolgenden Anforderungen sehen.

<script>
    $(window).unload(function(){document.cookie='left_on='+(new Date())})
</script>
6
Sixtease

für mich ist es keine gute Idee, dass der Browser vor dem Schließen wartet ...
einfach was, wenn ich es wirklich schließen will? ... 

wenn eine Seite einen Benutzer stört, ist es nicht gut ...

mein vorschlag ist, auf der seite warten sie 2 minuten (wenn 2 minuten die anforderungen sind), dann senden sie eine ajax, dass der benutzer seine 2 minuten getan hat.

sie können es dann auf der Serverseite prüfen, ob einer seine 2 Minuten hat oder nicht ...

4
Reigel

Es ist eine schlechte Idee, den Browser Ihrer Benutzer zu hijacken, da er ihnen ein schlechtes Gefühl vermittelt und sie wegschickt.

Wenn Sie aus irgendeinem Grund keine neue Seite erstellen möchten, bis der Benutzer eine minimale Zeit mit der vorherigen verbracht hat, empfiehlt es sich, die Server-Seite zu pilotieren, d.

Sie müssen nicht einmal Ajax-Anrufe tätigen. Speichern Sie einfach den Zeitstempel der Seite, zu der die Seite geliefert wurde, in der Sitzung und zeigen Sie die folgende Seite nicht an, bis eine bestimmte Zeit vergangen ist.

Stellen Sie sicher, dass Sie den Benutzern sagen, dass sie warten müssen, bis eine neue Seite bereit ist, möglicherweise mit einem einfachen Countdown für Javascript.

Wenn Sie möchten, dass der Benutzer die Seite tatsächlich für eine bestimmte Zeit aktiv hat (d. H. Nicht zu einem anderen Tab/Fenster wechseln, um auf die zwei Minuten zu warten), kann ich keine effektive Lösung vorschlagen.

2
Iacopo

verwenden Sie onbeforeunload:

$(document).ready(function(){
  window.onbeforeunload = function(){
     // $.ajax stuff here
     return false;
  }
});

Dies bringt dem Benutzer zumindest eine messagebox, die ihn fragt, ob er das aktuelle Fenster/Tab schließen möchte.

1
jAndy

Ich denke, es wäre viel besser, eine Abfragetechnik zu verwenden, wie Sie vorschlagen, obwohl dies zu einer Belastung des Webservers führt.

$(document).ready(function() {

    var teid = TEID;
    var startTime = new Date().getTime();

    var ajaxFunc = function() {
        var timeSpentMilliseconds = new Date().getTime() - startTime;
        var t = timeSpentMilliseconds / 1000 / 60;

        $.ajax({
            type: 'POST',
            url: '/clientarea/utils/record-time',
            data: 'teid=' + teid + '&t=' + t
        });
    };

    setInterval(ajaxFunc, 60000);

})

Sie werden froh sein, wenn Sie Websockets verwenden können :)

1
sje397

Die jQuery.ajax()-Methode hat die Option async. Wenn Sie die Variable auf false setzen, wird der Anruf blockiert, bis die Antwort zurückkommt (oder das Zeitlimit überschritten wurde). Ich bin mir ziemlich sicher, dass dieser Aufruf den Browser dazu veranlasst, sich im Entladehandler zu befinden.

Randbemerkung: Sie können sich darauf nicht verlassen, um zu funktionieren. Wenn der Browser dem Benutzer die Option gibt, die Entladehandler abzubrechen (was einige Browser nach einiger Zeit des Wartens tun), wird die "Zeit vor Ort" niemals aktualisiert. Sie können der Site einen Timer hinzufügen, der regelmäßig ein Skript auf dem Server aufruft und die Uhrzeit aktualisiert. Sie haben keinen genauen Wert, aber in Ihrem Fall ist dies nicht erforderlich.

Wenn Sie nur wissen müssen, ob der Benutzer X Sekunden auf der Seite war, können Sie im Onload-Handler einfach ein Timeout festlegen (mit setTimeout(function, ms)), das einen Anruf tätigt, wenn der Benutzer die erforderliche Zeit verbracht hat. Daher wäre kein Entladehandler erforderlich.

0
Martin Thurau