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

问题描述

在当用户点击注销按钮的网页，我有一个JavaScript函数，它清除存储在MongoDB的用户会话。它工作正常。

此外，我想清楚用户会话当用户关闭浏览器。这是我面临的问题：当用户点击刷新图标注销函数获取调用。我只希望在浏览器关闭时被调用这个函数。

我可以prevent从调用页面刷新这个功能呢？

我在这里的逻辑是，当浏览器关闭清理会话。我删除这是有关MongoDB的会话。有没有更好的方式来管理会话？

  VAR isRefresh = FALSE;
$（窗口）.keydown（函数（事件）{
    如果（event.key code == 116）{//用户presses F5刷新
        刷新= TRUE;
    }
}）;//当您关闭从而清除浏览器会话数据调用注销功能。
VAR windowsCloseEventListener = window.attachEvent || window.addEventListener;
VAR chkForBrowserCloseEvents = window.attachEvent？ 'onbeforeunload'：'beforeunload'; ///使IE7，IE8 compitable
windowsCloseEventListener（chkForBrowserCloseEvents，功能（E）{//对于＆GT; = IE7，Chrome浏览器，火狐
    如果（！isRefresh）{
        $ scope.logout（）;
    }
}）;
 

解决方案

亚历克斯建议，您可以使用会话Cookie 以检查您的网站已经看到了当前会话（IE7 +支持）。

示例

 函数readCookie（名称）{
    VAR nameEQ =名称+=;
    变种CA = document.cookie.split（';'）;
    对于（VAR I = 0; I＆LT; ca.length;我++）{
        变种C = CA [I]
        而（c.charAt（0）==''）C = c.substring（1 c.length）;
        如果（c.indexOf（nameEQ）== 0）找到return c.substring（nameEQ.length，c.length）;
    }
    返回null;
}VAR isRefresh = TRUE;
变种sessionAlive = readCookie（sessionAlive）;
如果（sessionAlive === NULL）{
    isRefresh = FALSE;
    sessionStorage.setItem（sessionAlive，真正的）;
}VAR windowsCloseEventListener = window.attachEvent || window.addEventListener;
VAR chkForBrowserCloseEvents = window.attachEvent？ 'onbeforeunload'：'beforeunload';
windowsCloseEventListener（chkForBrowserCloseEvents，功能（E）{
    如果（！isRefresh）{
        $ scope.logout（）;
    }
}）;
 

您可以使用的sessionStorage ，这是比较的HTML5方式，浏览器是否已关闭（新会）（IE8 +支持）。

示例：

  VAR isRefresh = TRUE;
变种sessionAlive = sessionStorage.getItem（sessionAlive）;
如果（sessionAlive === NULL）{
    isRefresh = FALSE;
    sessionStorage.setItem（sessionAlive，真正的）;
}VAR windowsCloseEventListener = window.attachEvent || window.addEventListener;
VAR chkForBrowserCloseEvents = window.attachEvent？ 'onbeforeunload'：'beforeunload';
windowsCloseEventListener（chkForBrowserCloseEvents，功能（E）{
    如果（！isRefresh）{
        $ scope.logout（）;
    }
}）;
 

http://www.quirksmode.org/js/cookies.html <：

readCookie取自/ A>

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?

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();
    }
});

解决方案

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

Example

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();
    }
});

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

Example:

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 taken from: http://www.quirksmode.org/js/cookies.html

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