(CS) Session & Cookie

❓공부하게 된 계기

Spring Boot 실습 (마이바티스, 빈스코프, 인터셉터 part) 에서 빈스코프에 대해 학습하던 중 세션을 통해 로그인 확인 및 정보 확인에 대해 다루었는데, 세션과 세션을 알려면 반드시 알아야하는 개념인 쿠키에 대해 좀 더 자세히 알고 넘어가고 싶어서 정리하고자 했다. (+ 면접 단골 질문)

❗️공부한 내용

1️⃣ 세션과 쿠키를 활용하는 이유

➡️ HTTP 의 특성 (비연결성 & 비상태성) 을 보완하기 위해 사용된다. 

① 비연결성 (Connectionless Protocol) 

➡️ 클라이언트가 서버에 요청을 했을 때, 그 요청에 맞는 응답을 보낸 후 연결을 끊는 처리방식 (Request ↔️ Response)

 

② 비상태성 (Stateless Protocol)

➡️ 커넥션을 끊는 순간 클라이언트와 서버의 통신이 끝나며 상태 정보는 유지하지 않는 특성

• 클라이언트와 서버가 첫번째 통신에서 데이터를 주고 받았다해도, 두번째 통신에서 데이터를 유지 하지 않는다. But 필요로하는 경우가 많다.

이러한 특성으로 인해 서버와 클라이언트의 통신은 비연속적으로 이루어진다. 만약 이를 해결하려면 서버가 클라이언트를 매번 인증해주어야하는데 이는 매우 번거로운 일이므로 쿠키와 세션을 통해 이를 간편화 한다.

2️⃣ 쿠키 (Cookie)

➡️ HTTP 의 일종으로 사용자가 어떤 웹 사이트를 방문할 경우, 그 사이트가 사용하고 있는 서버에서 사용자의 컴퓨터에 저장하는 기록 정보 파일로, HTTP 에서 클라이언트의 상태 정보를 클라이언트의 PC 에 저장하였다가 필요시 정보를 참조하거나 재사용 할 수 있다.

 

① 형태

➡️ Key 와 Value 로 구성되고, String 형태로 이루어져 있다.

 

② 사용목적

• 세션 관리 (Session Management) : 로그인, 사용하 닉네임, 접속시간, 장바구니 등의 서버가 알아야할 정보들을 저장
• 개인화 (Persionalization) : 사용자마다 다르게 그 사람에게 적절한 페이지를 보여줌
• 트레킹 (Tracking) : 사용자의 행동과 패턴을 분석하고 기록

② 특징

• 이름, 값, 만료일(저장기간), 경로 정보로 구성
• 클라이언트에 총 300개의 쿠키를 저장 가능
• 하나의 도메인 당 20개의 쿠키를 가질 수 있음
• 하나의 쿠키는 4KB 까지 저장 가능

③ 동작 순서

1. 클라이언트가 페이지를 요청한다. (사용자가 브라우저를 통해 웹사이트에 접근 ➡️ 서버에 요청)
2. 웹 서버는 쿠키를 생성한다.
3. 생성한 쿠키에 정보를 담아 HTTP 화면을 돌려줄 때, 같이 클라이언트에게 돌려준다.
4. 넘겨받은 쿠키는 클라이언트가 가지고 있다가 다시 서버에 요청할 때 요청과 함께 쿠키를 전송한다.
5. 동일 사이트에 재방문 시 클라이언트의 PC에 해당 쿠키가 있는 경우, 요청 페이지와 함께 쿠키를 전송한다.

④ 사용 예시

• ID 저장, 로그인 상태 유지
• 일주일간 다시 보지 않기
• 최근 검색한 상품들 확인 & 이를 바탕으로 상품 추천 서비스 제공
• 쇼핑몰 장바구니 기능

⑤ 단점

• 방문 웹 사이트에 대한 정보 및 개인 정보가 기록되므로 정보가 노출됨. 이를 방지하기 위해 쿠키 거부 기능이 존재. But 쿠키에 대한 거부가 설정되어있으면, 쿠키의 본래 목적인 연속적인 연결을 수행할 수 없는 경우가 발생
• 서버가 가지고 있는 것이 아니라 사용자에게 저장되기 때무에, 임의로 고치거나 지울 수 있고, 가로채기로 쉬워 보안이 취약. 따라서 쿠키에는 민감하거나 중요한 정보를 담는 것은 위험함

➡️ 쿠키의 이러한 단점을 보완하기 위한 것이 바로 "세션 (Session)" 이다.

3️⃣ 세션 (Session)

➡️ 일정 시간(= 사용자가 웹 브라우저를 통해 웹 서버에 접속한 시점부터 웹 브라우저를 종료하여 연결을 끝내는 시점) 동안 같은 사용자 (브라우저) 로 부터 들어오는 일련의 요구를 하나의 상태로 보고, 그 상태를 유지시키는 기술로, 사용자가 웹 서버에 접속해 있는 상태를 하나의 단위를 세션이라고 한다.

 

① 특징

• 각 클라이언트에 고유한 Session ID 를 부여한다. Seesion ID 로 클라이언트를 구분해 요구에 맞는 서비스를 제공한다. 이는 웹 브라우저 당 1개씩 생성되어 웹 컨테이너에 저장되며 브라우저 종료시 소멸된다. (+ 로그인한 사용자에 대해서만 세션을 생성하는 것이 아니라, 로그아웃하면 새로운 사용자로 인식해서 새로운 세션이 생성된다.)
  ➡️ 아이디, 닉네임 등의 정보를 세션에 담아두면 요청이 있을 때마다 DB에 접근할 필요가 없어서 효율적이다.
• 웹 서버에 저장되는 쿠키를 "세션 쿠키" 라고 한다.
• 서버 용량이 허용하는 안에서 저장 데이터 활용이 가능하다.

② 동작 순서

1. 클라이언트가 페이지에 요청한다. (사용자가 브라우저를 통해 웹사이트에 접근 ➡️ 서버에 요청)
2. 서버는 접근한 클라이언트의 Request-Header 필드인 Cookie 를 확인하여, 클라이언트가 해당 Session ID 를 보냈는지 확인한다.
3. Session ID 가 존재하지 않는다면 생성해 클라이언트에게 돌려준다.
4. 서버에서 클라이언트로 돌려준 Session ID 를 쿠키를 사용해 웹 브라우저의 쿠키 저장소에 저장한다.
5. 클라이언트는 재접속 시, 쿠키를 이용해 Session ID 값을 서버에 전달하고, 서버에서는 쿠키와 서버에 저장된 사용자 정보를 비교하여 같은 사용자임을 확인한다.

✏️ 적용 시켜본 예제

➡️ 로그인 성공 시 Controller 에서 Session 에 "loginedMemberId" 를 저장하고, 이를 요청이 들어올 때마다 인터셉터를 실행시켜 로그인 여부를 확인하는 과정을 작성해보았다.

• Controller : 로그인 성공 시 세션에  "loginedMemberId" 에 대한 정보를 저장

@Controller
@RequiredArgsConstructor
@RequestMapping("/member")
public class MemberController {
    private final MemberService memberService;
    private final Rq rq;

    @PostMapping("/login")
    public String login(String username, String password, HttpSession session ) {
        Member member = memberService.getMemberByUsername(username);

        if (member == null) {
            return "redirect:/?msg=NotFoundMember";
        }

        if (!member.matchPassword(password)) {
            return "redirect:/?msg=passwordError";
        }

        // login 관련 인터셉터에게 로그인 정보를 전달
        // 단순히 logined 에 T/F 를 보내면 로그인한 유저가 누군지 알 수 없음
        session.setAttribute("loginedMemberId", member.getId());
        rq.setName(member.getName());

        return "redirect:/?msg=loginSuccess";
    }
}

• 세션에 저장된 "loginedMemberId"  정보 확인을 통한 로그인 여부를 확인하는 도구

@Component // Bean 등록
@RequestScope // 브라우저 당 1개
@RequiredArgsConstructor
public class Rq {

    private final HttpSession session;

    public long getLoginedMemberId() {
        Long id =  (Long) session.getAttribute("loginedMemberId");
        if (id == null) {
            return -1;
        }
        return id;
    }

    public boolean isLogined() {
        return getLoginedMemberId() >= 0;
    }
    public boolean isLogout() {
        return isLogined() == false;
    }

}

• Interceptor : 요청이 들어올 때마다 실행되며 로그인 여부를 확인

@Configuration
@RequiredArgsConstructor
@Slf4j
public class NeedToLoginInterceptor implements HandlerInterceptor {
    private final Rq rq;

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {

        if(!rq.isLogined()) {
            response.setCharacterEncoding("UTF-8");
            response.setContentType("text/html; charset=UTF-8");
            response.getWriter().append("로그인 후 이용바랍니다.");

            return false; // Controller 진입 못해보고 종료됨
        }

        return HandlerInterceptor.super.preHandle(request, response, handler);
    }
}

🧐 추가로 궁금한 점

🔗 참고

• https://devuna.tistory.com/23

[web] 쿠키(cookie)와 세션(session)의 개념/차이/용도/작동방식

• https://dev-coco.tistory.com/61

쿠키(Cookie)와 세션(Session)의 차이 (+캐시(Cache))

🔖  면접을 위한 간단한 정리