Rumah > hujung hadapan web > tutorial js > Bagaimana Membezakan Antara Penyegaran Penyemak Imbas dan Penutupan Menggunakan Storan Setempat HTML5?

Bagaimana Membezakan Antara Penyegaran Penyemak Imbas dan Penutupan Menggunakan Storan Setempat HTML5?

Patricia Arquette
Lepaskan: 2024-11-03 16:26:29
asal
421 orang telah melayarinya

How to Distinguish Between Browser Refresh and Closure Using HTML5 Local Storage?

Mengenal pasti Antara Muat semula dan Tutup Tindakan Penyemak Imbas

Membezakan antara muat semula halaman dan penutupan penyemak imbas boleh menimbulkan cabaran apabila kedua-dua tindakan mencetuskan acara ONUNLOAD. Walau bagaimanapun, terdapat penyelesaian menggunakan storan tempatan HTML5 dan komunikasi AJAX klien/pelayan.

Pengendalian Acara Onunload

Dalam tetingkap halaman anda, tambahkan pengendali acara onunload:

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
}
Salin selepas log masuk

Pengendalian Acara Onload

Dalam badan halaman anda, tambahkan pengendali acara onload:

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
        }
    }
}
Salin selepas log masuk

Pengurusan Sebelah Pelayan

Pada pelayan, laksanakan proses untuk mengumpulkan permintaan pemutusan sambungan dan jadualkan urutan pemasa untuk menyemak permintaan tamat masa. Dalam masa 5 saat (dalam contoh ini), putuskan sambungan pengguna dengan permintaan tamat masa. Jika pembatalan pemutusan sambungan diterima, alih keluar permintaan yang sepadan daripada senarai.

Pendekatan ini juga boleh digunakan untuk membezakan antara penutupan tab/tetingkap dan penyerahan pautan/borang. Letakkan pengendali acara pada semua halaman dengan pautan atau borang dan halaman pendaratannya.

Walaupun penyelesaian ini menggunakan storan setempat, ambil perhatian bahawa ia mungkin tidak sesuai untuk penyemak imbas yang tidak menyokong storan setempat HTML5. Pertimbangkan pendekatan khusus untuk mengendalikan senario ini.

Atas ialah kandungan terperinci Bagaimana Membezakan Antara Penyegaran Penyemak Imbas dan Penutupan Menggunakan Storan Setempat HTML5?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan