[JavaScript] 타이머를 활용한 자동 로그아웃 기능 구현하기

자바스크립트 타이머를 활용한 자동 로그아웃 기능 구현하기

대부분의 사이트들은 로그인후 일정 시간이 지나면 자동으로 로그아웃 하는 기능이 존재하는데

시간이 0 이되면 자동으로 로그아웃을 함을로써 보안을 한층 강화하여 타인의 계정 도용올 막기 위함이다.

->예제를 살펴보면 타이머 시간을 정해 놓으면 1초 단위로 시간이 줄어들고, 0이 되면 타이머는 종료되며 지정한 사잍로 이동하게 됩니다. 이때 이동하는 사이트는 로그아웃을 처리하는 페이지로 한다.

아래 예제에서는 10분(600초)로 초기값을 지정했다.

[auto_loguout.html]

<html>
  <head>
    <title>자동로그아웃 구현하기</title>
    <script>
      var tid;
      var cnt = parseInt(600); //초기값(초단위)
      function counter_init() {
        tid = setInterval("counter_run()", 1000);
      }

      function counter_reset() {
        clearInterval(tid);
        cnt = parseInt(300);
        counter_init();
      }

      function counter_run() {
        document.all.counter.innerText = time_format(cnt);
        cnt--;
        if (cnt < 0) {
          clearInterval(tid);
          self.location = "logout.php";
        }
      }
      function time_format(s) {
        var nHour = 0;
        var nMin = 0;
        var nSec = 0;
        if (s > 0) {
          nMin = parseInt(s / 60);
          nSec = s % 60;

          if (nMin > 60) {
            nHour = parseInt(nMin / 60);
            nMin = nMin % 60;
          }
        }
        if (nSec < 10) nSec = "0" + nSec;
        if (nMin < 10) nMin = "0" + nMin;

        return "" + nHour + ":" + nMin + ":" + nSec;
      }
    </script>
  </head>

  <body>
    <span id="counter"> </span> 후 자동로그아웃
    <input type="button" value="연장" onclick="counter_reset()" />
  </body>
</html>

<script>
  counter_init();
</script>