使用 OnBeforeUnload 事件刷新浏览器 [英] Browser refresh using OnBeforeUnload event

问题描述

在用户单击注销按钮时的网页上，我有一个 JavaScript 函数可以清除存储在 MongoDB 上的用户会话.它工作正常.

On the web page when the user clicks on the logout button, I have a JavaScript function which clears the user session which is stored on the MongoDB. It works fine.

我还想在用户关闭浏览器时清除用户会话.这是我面临的问题:当用户单击刷新图标时，注销功能被调用.我只想在浏览器关闭时调用这个函数.

Also I would like to clear the user session when the user closes the browser. Here is the issue I am facing : when the user clicks on the refresh icon the logout function is getting called. I only want this function to be called when the browser is closed.

我可以阻止这个函数在页面刷新时调用吗?

Can I prevent this function from calling on the page refresh?

我这里的逻辑是在浏览器关闭时清理会话.我正在删除 MongoDB 上的会话.有没有更好的方法来管理会话?

My logic here is to clean up the session when the browser is closed. I am deleting the session which is on MongoDB. Is there a better way to manage the session?

var isRefresh = false;
$(window).keydown(function (event) {
    if (event.keyCode == 116) { // User presses F5 to refresh
        refresh = true;
    }
});

// Calls the logout function when you close the browser thus cleans the session data.
var windowsCloseEventListener = window.attachEvent || window.addEventListener;
var chkForBrowserCloseEvents = window.attachEvent ? 'onbeforeunload' : 'beforeunload'; /// make IE7, IE8 compitable
windowsCloseEventListener(chkForBrowserCloseEvents, function (e) { // For >=IE7, Chrome, Firefox
    if (!isRefresh) {
        $scope.logout();
    }
});

推荐答案

正如 Alex 所建议的，您可以使用 会话 Cookie 来检查您的网站是否在当前会话中被看到(IE7+ 支持).

As Alex suggested, you can use session Cookies to check if your website has been seen for the current session (IE7+ support).

示例

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}

var isRefresh = true;
var sessionAlive = readCookie("sessionAlive");
if (sessionAlive === null) {
    isRefresh = false;
    sessionStorage.setItem("sessionAlive", true);
}

var windowsCloseEventListener = window.attachEvent || window.addEventListener;
var chkForBrowserCloseEvents = window.attachEvent ? 'onbeforeunload' : 'beforeunload';
windowsCloseEventListener(chkForBrowserCloseEvents, function (e) {
    if (!isRefresh) {
        $scope.logout();
    }
});

您可以使用sessionStorage，这是更多的HTML5方式，查看浏览器是否已关闭(新会话)(IE8+支持).

You can use sessionStorage, which is more of the HTML5 way, to see if the browser has been closed (new session) (IE8+ support).

示例:

var isRefresh = true;
var sessionAlive = sessionStorage.getItem("sessionAlive");
if (sessionAlive === null) {
    isRefresh = false;
    sessionStorage.setItem("sessionAlive", true);
}

var windowsCloseEventListener = window.attachEvent || window.addEventListener;
var chkForBrowserCloseEvents = window.attachEvent ? 'onbeforeunload' : 'beforeunload';
windowsCloseEventListener(chkForBrowserCloseEvents, function (e) {
    if (!isRefresh) {
        $scope.logout();
    }
});

readCookie 取自:http://www.quirksmode.org/js/cookies.html

readCookie taken from: http://www.quirksmode.org/js/cookies.html

这篇关于使用 OnBeforeUnload 事件刷新浏览器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！