투케이2K

19. (spring/스프링) [thymeleaf/타임리프] HttpSession 세션 (session) 사용해 사용자 정보 관리 실시 본문

Spring

19. (spring/스프링) [thymeleaf/타임리프] HttpSession 세션 (session) 사용해 사용자 정보 관리 실시

투케이2K 2021. 8. 20. 13:54
반응형

[개발 환경 설정]

개발 툴 : inteli j

개발 언어 : spring


[로직 설명]


[폴더 및 파일 설정]


[소스 코드 : build.gradle]

//thymeleaf
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'

[소스 코드 : application.yml]

spring:
  devtools:
    livereload:
      enabled: true
  datasource:
    driver-class-name: oracle.jdbc.OracleDriver
    url: jdbc:oracle:thin:@115.68.186.215:1521:servername
    username: schemauser
    password: pw1234
  thymeleaf:
    cache: false


server:
  port: 7000



mybatis:
  mapper-locations: classpath:mappers/*.xml
  type-aliases-package: com.project.solutionpackage.model

[소스 코드 : controller >> ModuleApiController]

    // [post : Servlet 방식 [세션 객체 삭제]]
    // [경로 지정 [세션 체크] : http://localhost:7000/deleteSession]
    // [api 로직 : HttpServletRequest 매개변수를 사용해 >> 세션 객체 생성 >> 세션에 들어있는 데이터 삭제 실시]
    @PostMapping("/deleteSession")
    public String deleteSession(HttpServletRequest request){
        //input으로 들어온 파라미터 데이터 확인 실시
        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ModuleApiController] : [deleteSession] : [start]");
        System.out.println("=======================================");
        System.out.println("\n");

        // [결과 반환 변수 생성 실시]
        String result = "";

        // [HttpServletRequest 사용해 세션 객체 생성 실시]
        HttpSession session = request.getSession();

        // [세션에 저장된 데이터 삭제 실시]
        session.removeAttribute("id");
        session.removeAttribute("pw");
        //session.invalidate();

        // [세션에 저장된 데이터 확인 실시]
        try {
            String sessionID = String.valueOf(session.getAttribute("id")); // 세션에 저장된 id key 값 조회
            String sessionPW = String.valueOf(session.getAttribute("pw")); // 세션에 저장된 pw key 값 조회
            String sessionTIME = String.valueOf(session.getMaxInactiveInterval());

            // 결과를 반환할 JSON 객체 생성 실시
            JSONObject resultJson = new JSONObject();

            // 세션에 저장된 정보 ID, PW 가 널 값이 아닐경우 DELETE 상태값 F 반환 / 널 이면 상태값 T 반환 (정상 삭제 완료)
            if(sessionID != null && sessionID.length() > 0 && !sessionID.contains("null") && !sessionID.equals("")
                    && sessionPW != null && sessionPW.length() > 0 && !sessionPW.contains("null") && !sessionPW.equals("")){
                resultJson.put("delete", "F");
                resultJson.put("id", sessionID);
                resultJson.put("pw", sessionPW);
                resultJson.put("time", sessionTIME);
                result = resultJson.toString();
            }
            else {
                resultJson.put("delete", "T");
                resultJson.put("id", sessionID);
                resultJson.put("pw", sessionPW);
                resultJson.put("time", sessionTIME);
                result = resultJson.toString();
            }
        }
        catch (Exception e){
            e.printStackTrace();
        }
        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ModuleApiController] : [deleteSession] : [세션 데이터 삭제 확인]");
        System.out.println("[return data] : " + String.valueOf(result));
        System.out.println("=======================================");
        System.out.println("\n");
        return result;
    }

    // [post : map 방식 [세션 객체 시간 추가 연장]]
    // [경로 지정 : http://localhost:7000/saveSession?id=test&pw=admin]
    // [api 로직 : 인풋으로 들어온 id, pw 받아서 세션 시간 추가 연장 실시]
    @PostMapping("/saveSession")
    public String saveSession(@RequestParam Map<String, String> param, HttpSession session){
        //input으로 들어온 파라미터 데이터 확인 실시
        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ModuleApiController] : [saveSession] : [start]");
        System.out.println("[request keySet] : " + String.valueOf(param.keySet()));
        System.out.println("[request name] : " + String.valueOf(param.get("id")));
        System.out.println("[request name] : " + String.valueOf(param.get("pw")));
        System.out.println("=======================================");
        System.out.println("\n");

        // [결과 반환 변수 생성 실시]
        String result = "";


        // [인풋으로 들어온 데이터 변수에 삽입 실시]
        String id = String.valueOf(param.get("id"));
        String pw = String.valueOf(param.get("pw"));


        // [session : html에 반환할 세션 데이터 key, value 지정 실시]
        /**
         * [세션 세부 설명 추가]
         * 1. 세션은 서버에 저장되는 정보입니다 (쿠키는 하드에 저장됨)
         * 2. 세션은 보안이 필요하고, 데이터를 저장해 사용할 필요가 있을 경우 사용합니다 (ex : 로그인 정보 저장 등)
         * 3. 세션은 서버가 종료되거나 유효시간이 지나면 사라집니다
         * */
        session.setAttribute("id", id); // [세션 key, value]
        session.setAttribute("pw", pw); // [세션 key, value]


        session.setMaxInactiveInterval(10); // [세션 객체 별로 유효시간을 지정 [초단위] : 10초]
        //session.setMaxInactiveInterval(10*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 10*60=600초 >> 10분]
        //session.setMaxInactiveInterval(20*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 20*60=1200초 >> 20분]
        //session.setMaxInactiveInterval(30*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 30*60=1800초 >> 30분]
        //session.setMaxInactiveInterval(60*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 60*60=3600초 >> 1시간]
        //session.setMaxInactiveInterval(60*60*2); // [세션 객체 별로 유효시간을 지정 [초단위] : 60*60*2=7200초 >> 2시간]

        // [세션에 저장된 데이터 확인 실시]
        try {
            String sessionID = String.valueOf(session.getAttribute("id")); // 세션에 저장된 id key 값 조회
            String sessionPW = String.valueOf(session.getAttribute("pw")); // 세션에 저장된 pw key 값 조회
            String sessionTIME = String.valueOf(session.getMaxInactiveInterval());

            // 결과를 반환할 JSON 객체 생성 실시
            JSONObject resultJson = new JSONObject();

            // 세션에 저장된 정보 ID, PW 가 널 값이 아닐경우 SAVE 상태값 T 반환 / 널 이면 상태값 F 반환
            if(sessionID != null && sessionID.length() > 0 && !sessionID.contains("null") && !sessionID.equals("")
                    && sessionPW != null && sessionPW.length() > 0 && !sessionPW.contains("null") && !sessionPW.equals("")){
                resultJson.put("save", "T");
                resultJson.put("id", sessionID);
                resultJson.put("pw", sessionPW);
                resultJson.put("time", sessionTIME);
                result = resultJson.toString();
            }
            else {
                resultJson.put("save", "F");
                resultJson.put("id", sessionID);
                resultJson.put("pw", sessionPW);
                resultJson.put("time", sessionTIME);
                result = resultJson.toString();
            }
        }
        catch (Exception e){
            e.printStackTrace();
        }
        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ModuleApiController] : [saveSession] : [세션 데이터 저장]");
        System.out.println("[return data] : " + String.valueOf(result));
        System.out.println("=======================================");
        System.out.println("\n");
        return result;
    }

    // [post : Servlet 방식 [세션 객체 생성]]
    // [경로 지정 [세션 체크] : http://localhost:7000/checkSession]
    // [api 로직 : HttpServletRequest 매개변수를 사용해 >> 세션 객체 생성 >> 세션에 들어있는 데이터를 확인]
    // [주의점 : 아직 세션 완료 시간이 남았는데 >> 세션 객체 호출 후 검증 실시하면 >> 세션 시간이 자동으로 연장되는 것 주의]
    @PostMapping("/checkSession")
    public String checkSession(HttpServletRequest request){
        //input으로 들어온 파라미터 데이터 확인 실시
        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ModuleApiController] : [checkSession] : [start]");
        System.out.println("=======================================");
        System.out.println("\n");

        // [결과 반환 변수 생성 실시]
        String result = "";

        // [HttpServletRequest 사용해 세션 객체 생성 실시]
        HttpSession session = request.getSession();

        // [세션에 저장된 데이터 확인 실시]
        try {
            String sessionID = String.valueOf(session.getAttribute("id")); // 세션에 저장된 id key 값 조회
            String sessionPW = String.valueOf(session.getAttribute("pw")); // 세션에 저장된 pw key 값 조회
            String sessionTIME = String.valueOf(session.getMaxInactiveInterval());

            // 결과를 반환할 JSON 객체 생성 실시
            JSONObject resultJson = new JSONObject();

            // 세션에 저장된 정보 ID, PW 가 널 값이 아닐경우 CHECK 상태값 T 반환 / 널 이면 상태값 F 반환
            if(sessionID != null && sessionID.length() > 0 && !sessionID.contains("null") && !sessionID.equals("")
                    && sessionPW != null && sessionPW.length() > 0 && !sessionPW.contains("null") && !sessionPW.equals("")){
                resultJson.put("check", "T");
                resultJson.put("id", sessionID);
                resultJson.put("pw", sessionPW);
                resultJson.put("time", sessionTIME);
                result = resultJson.toString();
            }
            else {
                resultJson.put("check", "F");
                resultJson.put("id", sessionID);
                resultJson.put("pw", sessionPW);
                resultJson.put("time", sessionTIME);
                result = resultJson.toString();
            }
        }
        catch (Exception e){
            e.printStackTrace();
        }
        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ModuleApiController] : [checkSession] : [세션 데이터 검증]");
        System.out.println("[return data] : " + String.valueOf(result));
        System.out.println("=======================================");
        System.out.println("\n");
        return result;
    }

[소스 코드 : controller >> ThymeLeafController]

package com.project.solutionpackage.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

// [크로스 도메인 접속 허용 설정]
@CrossOrigin("*")

// [RestController = rest api 요청 / Controller = view 연결]
@Controller
public class ThymeLeafController {

    /**
     * [클래스 설명]
     * 1. thymeleaf 타임리프 view 지정 부분 (html 지정)
     * */



    // [get : map 방식 : 파라미터 받는 방식]
    // [경로 지정 : http://localhost:7000/testSession?id=test&pw=admin]
    // [api 로직 : 인풋으로 들어온 id, pw를 세션에 저장 후 >> testSessionThymeleaf.html로 리턴합니다]
    // [html 로직 : testSessionThymeleaf.html은 리턴 받은 key 값을 불러와서 데이터를 표시해줍니다]
    @GetMapping("/testSession")
    public String testSession(@RequestParam Map<String, String> param, Model model, HttpSession session){
        //input으로 들어온 파라미터 데이터 확인 실시
        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ThymeLeafController] : [testSession] : [start]");
        System.out.println("[request keySet] : " + String.valueOf(param.keySet()));
        System.out.println("[request name] : " + String.valueOf(param.get("id")));
        System.out.println("[request name] : " + String.valueOf(param.get("pw")));
        System.out.println("=======================================");
        System.out.println("\n");

        // [인풋으로 들어온 데이터 변수에 삽입 실시]
        String id = String.valueOf(param.get("id"));
        String pw = String.valueOf(param.get("pw"));


        // [session : html에 반환할 세션 데이터 key, value 지정 실시]
        /**
         * [세션 세부 설명 추가]
         * 1. 세션은 서버에 저장되는 정보입니다 (쿠키는 하드에 저장됨)
         * 2. 세션은 보안이 필요하고, 데이터를 저장해 사용할 필요가 있을 경우 사용합니다 (ex : 로그인 정보 저장 등)
         * 3. 세션은 서버가 종료되거나 유효시간이 지나면 사라집니다
         * */
        session.setAttribute("id", id); // [세션 key, value]
        session.setAttribute("pw", pw); // [세션 key, value]


        session.setMaxInactiveInterval(10); // [세션 객체 별로 유효시간을 지정 [초단위] : 10초]
        //session.setMaxInactiveInterval(10*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 10*60=600초 >> 10분]
        //session.setMaxInactiveInterval(20*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 20*60=1200초 >> 20분]
        //session.setMaxInactiveInterval(30*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 30*60=1800초 >> 30분]
        //session.setMaxInactiveInterval(60*60); // [세션 객체 별로 유효시간을 지정 [초단위] : 60*60=3600초 >> 1시간]
        //session.setMaxInactiveInterval(60*60*2); // [세션 객체 별로 유효시간을 지정 [초단위] : 60*60*2=7200초 >> 2시간]


        // [model : html에 반환할 일반 데이터 key, value 지정 실시]
        model.addAttribute("sessionTime", "10"); // [일반 key, value]

        System.out.println("\n");
        System.out.println("=======================================");
        System.out.println("[ThymeLeafController] : [testSession] : [세션 데이터 저장]");
        System.out.println("[session id] : " + String.valueOf(session.getAttribute("id")));
        System.out.println("[session pw] : " + String.valueOf(session.getAttribute("pw")));
        System.out.println("[session getMaxInactiveInterval] : " + String.valueOf(session.getMaxInactiveInterval()));
        System.out.println("=======================================");
        System.out.println("\n");


        // [testSessionThymeleaf.html 호출]
        return "testSessionThymeleaf";
    }

}

[소스 코드 : templates >> testSessionThymeleaf.html]

<!DOCTYPE html>
<!-- 타임리프를 사용하기 위한 태그 선언 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!-- 내부 css -->
    <style>
        p {
            font-size: 200%;
            color: #0000ff;
        }
    </style>


    <!-- Jquery CDN 로드 : 항상 최신 버전 사용 -->
    <script  src="https://code.jquery.com/jquery-latest.min.js"></script>


    <!-- 내부 js -->
    <script>
        /* [웹 브라우저 로드 완료 확인 함수] */
        var time;
        window.onload = function() {
            console.log("");
            console.log("[window onload] : [start]");
            console.log("");

            // 컨트롤러 모델에서 받아온 세션 타임 데이터 확인 >> 실시간 카운트 감소 실시
            time = document.getElementById("session_time").innerText;

            sessionTimeCount(Number(time)); // 실시간 세션 타임 카운트 확인
        };

        /* [실시간 세션 타임 체크 함수] */
        function sessionTimeCount(data){
            console.log("");
            console.log("[sessionTimeCount] : [start]");
            console.log("[time] : " + data);
            console.log("");

            if(isNaN(data) == true){ // 카운트 값이 정수가 아닐 경우
                return; //return 함수 종료
            }

            // setInterval 사용해 반복 작업 실시
            var interval = setInterval(function() {
                if(data <= 0){ //카운트 값이 0이되면 종료
                    console.log("");
                    console.log("[sessionTimeCount] : [exit]");
                    console.log("");
                    clearInterval(interval); //반복 실행 정지

                    // ajax 통신 사용해 세션 검증 실시
                    requestCheckSessionPost();
                    return; //return 함수 종료
                }

                data --; // 카운트값 감소 실시
                console.log("");
                console.log("[sessionTimeCount] : [exit]");
                console.log("[session_time] : " + data);
                console.log("");
                document.getElementById("session_time").innerText = String(data);
            }, 1000); // 1초 간격으로 반복 실행 정의
        };



        /* [세션 카운트 완료 후 세션 초기화 검증 요청 함수] */
        function requestCheckSessionPost(){
            console.log("");
            console.log("[requestCheckSessionPost] : [start]");
            console.log("");


            // [요청 url 및 데이터 정의 실시]
            var reqURL = "/deleteSession";

            console.log("");
            console.log("[requestCheckSessionPost] : [request url] : " + reqURL);
            console.log("[requestCheckSessionPost] : [request method] : " + "POST QUERY PARAM");
            console.log("");

            $.ajax({
                // [요청 시작 부분]
                url: reqURL, //주소
                type: "POST", //전송 타입
                async: true, //비동기 여부
                timeout: 5000, //타임 아웃 설정
                dataType: "TEXT", //응답받을 데이터 타입 (XML,JSON,TEXT,HTML)
                contentType: "application/x-www-form-urlencoded; charset=utf-8", //헤더의 Content-Type을 설정

                // [응답 확인 부분]
                success: function(response) {
                    console.log("");
                    console.log("[requestCheckSessionPost] : [response] : " + response);
                    console.log("");
                },

                // [에러 확인 부분]
                error: function(xhr) {
                    console.log("");
                    console.log("[requestCheckSessionPost] : [error] : " + xhr);
                    console.log("");
                },

                // [완료 확인 부분]
                complete:function(data,textStatus) {
                    console.log("");
                    console.log("[requestCheckSessionPost] : [complete] : " + textStatus);
                    console.log("");
                }
            });
        };

    </script>

</head>

<body>

<!-- p 태그 삽입 실시 : 세션 key 호출 실시 -->
<p>ID : <span th:text="${session.id}"></span></p>
<p>PW : <span th:text="${session.pw}"></span></p>

<p style="color: #FF6600;">
    SESSION TIME : <span id="session_time" th:text="${sessionTime}"></span>
</p>

</body>

</html>

[결과 출력]


[전체 코드 첨부]

소스코드.txt
0.02MB


 

반응형
Comments