Question

在构建监视器时，监视器将监视用户在浏览器上的任何活动，例如单击按钮或在文本框上键入（而不是鼠标悬停在文档上）。因此，如果用户长时间没有活动，会话将超时。

我们需要在没有jquery或其他任何东西的情况下这样做。我可以使用ajax。另一端的java servlet更可取。

Answer 1

Here is pure JavaScript way跟踪空闲时间，当达到某个限制时执行某些操作，您可以相应修改并使用

var IDLE_TIMEOUT = 60; //seconds
var _idleSecondsCounter = 0;
document.onclick = function() {
    _idleSecondsCounter = 0;
};
document.onmousemove = function() {
    _idleSecondsCounter = 0;
};
document.onkeypress = function() {
    _idleSecondsCounter = 0;
};
window.setInterval(CheckIdleTime, 1000);

function CheckIdleTime() {
    _idleSecondsCounter++;
    var oPanel = document.getElementById("SecondsUntilExpire");
    if (oPanel)
        oPanel.innerHTML = (IDLE_TIMEOUT - _idleSecondsCounter) + "";
    if (_idleSecondsCounter >= IDLE_TIMEOUT) {
        alert("Time expired!");
        document.location.href = "logout.html";
    }
}

此代码将在显示警报和重定向之前等待60秒，任何操作都将“重置”计数 - 鼠标单击，鼠标移动或按键。

它应该尽可能地跨浏览器，并且直截了当。如果您向ID为SecondsUntilExpire的页面添加元素，它还支持显示剩余时间。

参考：How to know browser idle time?

Answer 2

您建议的方法的问题是会话将超时，即使用户正在移动鼠标或输入输入。因此，如果您将会话超时设置为20分钟，并且用户继续键入21分钟，则会话仍将超时，即使它们已处于“活动”状态。使会话暂时超时的唯一因素是对服务器的新请求。

解决方案1：让服务器控制会话超时

除非您在后台制作Ajax请求，否则会继续更新会话，您可以在页面加载时设置JavaScript超时，并以这种方式提醒用户。除非您向服务器发出其他请求，否则当用户在您的页面上时，无需使其变得困难：

setTimeout(function () {
   alert("You've timed out baby!");
}, 1200000); // 20 minutes in millisec (modify to your session timeout)

如果用户访问其他页面或重新加载页面，则会话续订并重置JavaScript计时器。如果用户没有这样做，会话将在用户收到警报的同时超时。

解决方案2：让客户端控制会话超时

如果您希望JavaScript完全控制会话持续多长时间，以便在用户键入，移动鼠标或其他任何内容时更新它，您将在后台继续向您发出Ajax请求服务器，所以会话更新。（这可能是一个空的虚拟请求，只是命中服务器的东西）

然后，您必须跟踪您认为“用户活动”的所有操作（AnhSirk在他的回答中建议一种方式）并在发生此类事件时重置超时计时器。如果用户长时间处于非活动状态，则您必须向服务器上的页面发出Ajax请求，这会使会话无效，然后您可以提醒用户会话已超时。

通过浏览器检测用户不活动 - 纯粹通过javascript

2 个答案: