회사에서 "자동로그아웃 안내" 개발을 맡았다.
기간은 일주일..! 두둥
약간의 대리님의 도움을 받아서 해결했지만..
내것으로 만들기 위해 다시 한번 만들어보았다.

결과 화면😊

실제로 시간은 계속 1초씩 줄어들고 있다.. 사진의 한계점으로..
해결 방법😊
1. 세션 생성
(회사에서는 로그인하면 세션이 생성되지만, 나는 아직 로그인 화면이 없기때문에 임의로 세션을 생성해줬다.)\
2. web.xml에서 세션 time 지정
( session time은 10분으로 지정해줬음! )
3. filter를 이용해서 .do 가 탈때마다 현재 서버시간과, 세션만료시간을 초기화해서 cookie에 담아준다.
(페이지가 이동할 때마다 .do가 타기때문에 세션만료시간이 다시 10분후가 된다.
액션이 10분동안 없을 때, 세션을 자동으로 만료시키고, 액션이 취해졌을때는 세션시간이 다시 10분으로 초기화되게끔 하기 위한 것! )
4. 화면에 남은 세션시간을 뿌려준다
(jsp에서 setInterval을 1초동안 돌리면서 남은 시간을 화면에 뿌려주었다.)
5. "세션 타임 연장" 버튼 구현
(회사 소스에서는 .do를 다시 타게끔 빈 컨트롤러를 맵핑해주었다. 그렇게되면 filter가 다시 찍혀서 세션을 초기화해주기 때문이다.
내 소스에서는 그냥 쿠키에 담아두었던 서버시간과 세션만료시간을 가져와서 임의로 남은 시간만 구현해놓았다.
원래는 회사소스처럼 하는게 맞음!!
왜냐면 쿠키에 담아두었던 서버시간과 세션만료시간은 최초로 filter를 탔을 때, 시간이기 때문에..!! )
내가 짠 코드😊
web.xml
<filter>
<filter-name>sessionTimeoutFilter</filter-name>
<filter-class>com.spring.test.filter.SessionTimeoutFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>sessionTimeoutFilter</filter-name>
<url-pattern>*.do</url-pattern>
</filter-mapping>
SessionTimeoutFilter.java
package com.spring.test.filter;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.stereotype.Component;
@Component
public class SessionTimeoutFilter implements Filter{
@Override
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)
throws IOException, ServletException {
HttpServletResponse httpResponse = (HttpServletResponse) response;
HttpServletRequest httpRequest = (HttpServletRequest) request;
//system 최근 시간 (밀리초)
long serverTime = System.currentTimeMillis();
//HttpSession 만료시간
long sessionExpireTime = serverTime + httpRequest.getSession().getMaxInactiveInterval() * 1000;
Cookie cookie = new Cookie("CurrentServerTime", ""+serverTime);
cookie.setPath("/");
httpResponse.addCookie(cookie);
cookie = new Cookie("ExpireSessionTime", ""+sessionExpireTime);
cookie.setPath("/");
httpResponse.addCookie(cookie);
chain.doFilter(request, response);
}
}
sessionTimeCheck.jsp
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script>
//세션 타임 info
var currentServerTime; //현재서버시간
var expireSessionTime; //서버만료시간
var elapsedLocalTime = 0; //로컬경과시간
var sessionExpiredState = false; //세션만료상태
function pad(n, width){
n = n + "";
return n.length >= width ? n : new Array(width - n.length + 1).join("0") + n;
}
function getCookie(cname){
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(";");
for(var i = 0; i < ca.length; i++){
var c = ca[i];
while(c.charAt(0) == " "){
c = c.substring(1);
}
if(c.indexOf(name) == 0){
return c.substring(name.length, c.length);
}
}
return "";
}
function sessionTimeoutInit(){
elapsedLocalTime = 0;
firstLocalTime = (new Date()).getTime();
fnShowRemaining();
timer = setInterval(fnShowRemaining, 1000);
}
function fnShowRemaining(){
currentServerTime = getCookie("CurrentServerTime");
expireSessionTime = getCookie("ExpireSessionTime");
elapsedLocalTime = (new Date()).getTime() - firstLocalTime;
var timeRemaining = expireSessionTime - currentServerTime - elapsedLocalTime;
var timeHour = Math.floor(timeRemaining/1000/60/60);
var timeMin = Math.floor((timeRemaining/1000/60)%60);
var timeSec = Math.floor((timeRemaining/1000)%60);
if(timeMin == '00' && timeSec == '50'){
console.log("으악!! 세션만료 50초 전!!");
}
if(timeRemaining < 1000) {
clearInterval(timer);
$("#topTimeInfo").text("00:00:00");
sessionExpiredState = true;
return;
}
$("#topTimeInfo").text(pad(timeHour, 2) + ":" + pad(timeMin, 2) + ":" + pad(timeSec, 2));
var test = pad(timeHour, 2) + ":" + pad(timeMin, 2) + ":" + pad(timeSec, 2);
console.log(test);
return;
}
function fnReqTimeAjax(){
if(sessionExpiredState == true){
return;
}
clearInterval(timer);
console.log("세션 time 초기화");
sessionTimeoutInit();
}
</script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body onload="sessionTimeoutInit()">
<span id="topTimeInfo"></span>
<button onclick="fnReqTimeAjax();" return false;" >세션 시간 연장</button>
</body>
</html>
'mini_project > 차근차근 WEB 만들어보기' 카테고리의 다른 글
day1. 이클립스 설치, 프로젝트 생성 ( maven, tomcat 설정 ) - 개발자 배찌 (0) | 2022.07.05 |
---|