Wie kann man mithilfe des lokalen HTML5-Speichers zwischen Browser-Aktualisierung und -Schließung unterscheiden?

Identifizieren zwischen Browser-Aktualisierungs- und Browser-Schließaktionen

Die Unterscheidung zwischen Seitenaktualisierung und Browser-Schließung kann eine Herausforderung darstellen, wenn beide Aktionen das ONUNLOAD-Ereignis auslösen. Es gibt jedoch eine Lösung, die lokalen HTML5-Speicher und Client/Server-AJAX-Kommunikation verwendet.

Onunload-Ereignisbehandlung

Fügen Sie im Fenster Ihrer Seite einen Onunload-Ereignishandler hinzu:

function myUnload(event) {
    // Set a local storage flag indicating an unload event
    if (window.localStorage) {
        window.localStorage['myUnloadEventFlag'] = new Date().getTime();
    }

    // Notify the server of a disconnection request
    askServerToDisconnectUserInAFewSeconds(); // Synchronous AJAX call
}

Onload-Ereignisbehandlung

Fügen Sie im Hauptteil Ihrer Seite einen Onload-Ereignishandler hinzu:

function myLoad(event) {
    if (window.localStorage) {
        // Check the time between the last unload event and the current time
        var t0 = Number(window.localStorage['myUnloadEventFlag']);
        var t1 = new Date().getTime();
        var duration = t1 - t0;

        if (duration < 10 * 1000) {
            // Page reloaded: Cancel disconnection request
            askServerToCancelDisconnectionRequest(); // Asynchronous AJAX call
        } else {
            // Tab/window closed: Perform desired action
        }
    }
}

Serverseitige Verwaltung

Implementieren Sie auf dem Server einen Prozess zum Sammeln von Verbindungstrennungsanfragen und planen Sie einen Timer-Thread, um nach Zeitüberschreitungsanfragen zu suchen. Trennen Sie Benutzer mit Timeout-Anfragen innerhalb von 5 Sekunden (in diesem Beispiel). Wenn ein Verbindungsabbruch empfangen wird, entfernen Sie die entsprechende Anfrage aus der Liste.

Dieser Ansatz kann auch verwendet werden, um zwischen dem Schließen von Tabs/Fenstern und dem Absenden von Links/Formularen zu unterscheiden. Platzieren Sie die Event-Handler auf allen Seiten mit Links oder Formularen und deren Zielseiten.

Obwohl diese Lösung lokalen Speicher verwendet, beachten Sie, dass sie möglicherweise nicht für Browser geeignet ist, die den lokalen HTML5-Speicher nicht unterstützen. Erwägen Sie spezifische Ansätze für den Umgang mit diesen Szenarien.

Das obige ist der detaillierte Inhalt vonWie kann man mithilfe des lokalen HTML5-Speichers zwischen Browser-Aktualisierung und -Schließung unterscheiden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!