c# - 用于 session 超时的javascript倒数计时器

Question

我想提醒用户 session 超时即将到期。我想要一个带有确定按钮的弹出窗口，并在弹出窗口上显示秒数。我可以只用 java 脚本来做到这一点吗？ 我也可以在后面使用 C# 代码。

现在它检测到 session 超时并弹出窗口告诉他们 session 已过期。

<script type="text/javascript">
    var sessionTimeout = "<%= Session.Timeout %>";

    function DisplaySessionTimeout() {
        sessionTimeout = sessionTimeout - 1;

        if (sessionTimeout >= 0)
          window.setTimeout("DisplaySessionTimeout()", 60000);
        else {
            alert("Your current Session is over due to inactivity.");
        }
    }
</script>

Answer 1

是的，您可以通过 JavaScript 执行此操作。这是一个简单的计数器实现 that was inspired from this StackOverflow answer我前一段时间发现:

function Counter(options) {
    var timer;
    var instance = this;
    var seconds = options.seconds || 10;
    var onUpdateStatus = options.onUpdateStatus || function() {};
    var onCounterEnd = options.onCounterEnd || function() {};
    var onCounterStart = options.onCounterStart || function() {};

    function decrementCounter() {
        onUpdateStatus(seconds);
        if (seconds === 0) {
            stopCounter();
            onCounterEnd();
            return;
        }
        seconds--;
    };

    function startCounter() {
        onCounterStart();
        clearInterval(timer);
        timer = 0;
        decrementCounter();
        timer = setInterval(decrementCounter, 1000);
    };

    function stopCounter() {
        clearInterval(timer);
    };

    return {
        start : function() {
            startCounter();
        },
        stop : function() {
            stopCounter();
        }
    }
};

...以及如何使用它的示例:

var countdown = new Counter({
    // number of seconds to count down
    seconds: 3,

    onCounterStart: function () { 
        // show pop up with a message 
        ... 
    },

    // callback function for each second
    onUpdateStatus: function(second) {
        // change the UI that displays the seconds remaining in the timeout 
        ... 
    },

    // callback function for final action after countdown
    onCounterEnd: function() {
        // show message that session is over, perhaps redirect or log out 
        ... 
    }
});
countdown.start();

一旦服务器准备好提醒用户，只需创建计时器，它就会开始倒计时。您可以自定义每个事件发生的情况:计时器何时开始、秒数何时结束以及倒计时何时结束。