Дайте предупреждение перед выходом - PullRequest
Новая
       10

Дайте предупреждение перед выходом

0 голосов
/ 14 мая 2019

Я хотел бы получить всплывающее предупреждение (предупреждение), которое будет выдано за 1 минуту до перенаправления страницы и выхода из системы.Любая помощь будет оценена.Спасибо. 

(function() {
  var idleDurationSecs = 10 * 60;
  var redirectUrl = 'logout.asp'; // Redirect idle users to this URL
  var idleTimeout;

  var resetIdleTimeout = function() {
    if (idleTimeout) clearTimeout(idleTimeout);

    idleTimeout = setTimeout(function() {
      location.href = redirectUrl
    }, idleDurationSecs * 1000);
  };

  resetIdleTimeout();

  ['click', 'touchstart', 'mousemove'].forEach(function(evt) {
    document.addEventListener(evt, resetIdleTimeout, false)
  });
})();

Ответы [ 2 ]

1 голос
/ 14 мая 2019

Лично я не думаю, что должно быть предупреждение, и если оно есть, простого предупреждения, вероятно, недостаточно.Лучше всего использовать div с обратным отсчетом.

Однако, если вы настроены на использование оповещения, просто используйте второй тайм-аут. 

var idleTimeout, warningTimeout;

var resetIdleTimeout = function () {
    clearTimeout(idleTimeout);
    clearTimeout(warningTimeout);

    warningTimeout = setTimeout(function () {
        alert("You will be logged out in 1 minute");
    }, (idleDurationSecs-60) * 1000);

    idleTimeout = setTimeout(function () {
        location.href = redirectUrl
    }, idleDurationSecs * 1000);
};
0 голосов
/ 14 мая 2019

Если вы хотите сделать что-то более качественное, вот фрагмент кода того, что я бы сделал. Не обращая внимания на CSS, мне было просто скучно, и я выглядела красиво. Обратите внимание на код и HTML. 

var n = 600; // 10 minutes

function countDown(){
var tm = setInterval(internalFunc,1000);
internalFunc();
       function internalFunc(){
         n--;
         if(n == 0){
            clearInterval(tm);
         }
          console.log(n);
          document.getElementById('ElementIDhere123').innerHTML = n;
          var date = new Date(null);
          date.setSeconds(n); // specify value for SECONDS here
          var result = date.toISOString().substr(11, 8);
          document.getElementById('ElementIDhere123').innerHTML = result;
       }
};

countDown();
#ElementIDhere123{
background:-webkit-radial-gradient(circle farthest-corner at right center, rgb(0, 151, 126) 0%, rgb(23, 95, 104) 80%);
background:-o-radial-gradient(circle farthest-corner at right center, rgb(0, 151, 126) 0%, rgb(23, 95, 104) 80%);
background:-moz-radial-gradient(circle farthest-corner at right center, rgb(0, 151, 126) 0%, rgb(23, 95, 104) 80%);
background:radial-gradient(circle farthest-corner at right center, rgb(0, 151, 126) 0%, rgb(23, 95, 104) 80%);
border-radius:15px;
-moz-border-radius:50px;
-webkit-border-radius:50px;
color:#C2F5FF;
text-align:center;
width: 90px;
}
<div id="ElementIDhere123">Timer Placeholder</div>

Так как вы спросили, как добавить время в оповещение, уведомляющее пользователя, когда он вышел из системы. 

function startTime(){
  var today = new Date();
  var h = today.getHours();
  var m = today.getMinutes();
  var ampm = h >= 12 ? ' PM' : ' AM';
  hours = h % 12;
  hours = h ? h : 12; // the hour '0' should be '12'

  return [ h, m, ampm ].join(':')
}

    (function () {
    var idleDurationSecs = 10 * 1;
    var warnDurationSecs = 9 * 1;
    var redirectUrl = 'logout.asp';  // Redirect idle users to this URL
    var idleTimeout;

    var resetIdleTimeout = function () {
        if (idleTimeout) clearTimeout(idleTimeout);
        if (idleMsg) clearTimeout(idleMsg);

        idleTimeout = setTimeout(function () {
            alert('You were logged off at ' + startTime());
            location.href = redirectUrl
        }, idleDurationSecs * 1000);

        idleMsg = setTimeout(function () {
        alert("You will be logged out in 1 minute");
    }, (warnDurationSecs) * 1000);
    };

    resetIdleTimeout();

    ['click', 'touchstart', 'mousemove'].forEach(function (evt) {
        document.addEventListener(evt, resetIdleTimeout, false)
    });
})();
...