[Servlet&JSP] Cookie로 상태 값 유지하기

* 본 글은 [뉴렉처]의 Servlet&JSP 프로그래밍 강의를 듣고 정리한 글입니다.

2020 Servlet&JSP 프로그래밍

 

 Cookie로 상태 값 유지하기 

서블릿에서 사용할 수 있는 상태 저장소 Application, Session, Cookie

• 어느 저장소에 값을 저장할 건지는 데이터의 속성에 따라 결정
• 서버에 상태 값을 저장
  • Application
    • 서블릿이 애플리케이션 전역에서 사용할 수 있는 공간
  • Session
    • 서블릿이 세션 범주 내에서 사용할 수 있는 공간
    • 현재 사용자를 의미
    • SID(Session ID)를 갖고 있는 사용자만 Session에 값을 저장할 수 있음
• 클라이언트에 상태 값을 저장
  • Cookie
    • 서버에 상태 값을 두지 않고, 클라이언트(브라우저)가 들고 다니는 상태 값
    • 요청이 있을 때마다 해당 값을 가져가서 서블릿이 실행될 때 썼다가 다시 가져옴

 

클라이언트와 서버가 통신할 때 오가는 상태 값

• 클라이언트가 서버에 요청(request)할 때 가져갈 수 있는 값
  • Header 정보
    • 사용자가 아니라 브라우저가 자동으로 담아주는 정보
    • getHeader(”remote-host”) 메소드로 Header 정보를 사용할 수 있음
  • 사용자 데이터
    • 사용자가 보내는 데이터
    • getParameter(”x”) 메소드라는 API 함수로 사용자 데이터를 사용할 수 있음
  • Cookie
    • 사용자가 아니라, 쿠키가 있으면 브라우저가 가져가는 데이터
    • getCookies( )메소드로 쿠키를 꺼내 쓸 수 있음
• 브라우저가 클라이언트에 응답(response)할 때 보낼 수 있는 값
  • Cookie
    • addCookie( )메소드로 쿠키를 응답에 심어서 클라이언트에 보낼 수 있음 (브라우저에 쿠키를 저장하는 것)
      • addCookie( )가 시작점
        • 1) 서버가 Application이나 Session이 아니라 브라우저에 저장하겠다 하면 addCookie( )메소드로 그 값을 보냄
        • 2) 그 값은 Cookie로 이동해 저장됨
        • 3) 요청이 있을 때 Cookie를 가져감
        • 4) getCookies( )메소드로 쿠키를 꺼내 씀
        • 5) 다시 addCookie( )메소드로 쿠키를 추가하기도 함
    • response의 헤더에 심어진 형태로 전달됨

 

쿠키 사용하기

• 브라우저에 쿠키 저장하기
  • 쿠키는 key와 value로 나뉨
  • 쿠키 객체 생성하기
    • Cookie 쿠키객체명 = new Cookie(key, value);
  • 서버에서 클라이언트로 쿠키 보내기
    • response.addCookie(쿠키 객체명);
    • 브라우저는 response에 심어진 값을 읽어서 그 값을 자신이 가짐

//c라는 key에 값을 심어 쿠키 저장
Cookie cookie = new Cookie("c", String.valueOf(result));
//서버에서 쿠키를 클라이언트로 보냄
response.addCookie(cookie);

• 서버에서 쿠키 읽기
  • 브라우저가 다시 요청하면 쿠키를 서버로 보냄
  • 서버에서는 getCookies( )메소드로 쿠키를 읽음
  • 쿠키가 여러 개로 올 수 있기 때문에 배열로, 맵 컬렉션처럼 key와 value로 옴
  • key값을 찾고 그에 해당되는 value 값을 얻어야 함
    • getName( )메소드: key 값을 알려줌
    • getValue( )메소드: value 값을 알려줌

Cookie[] coookies = request.getCookies();
String _c = "";

if(cookies != null){
  for(Cookie cookie : cookies){
    if("c".equals(cookie.getName())){
      _c = cookie.getValue();
    }
  }
}

 

Cookie 사용하는 실제 코드

• 브라우저에 쿠키 저장하기
  • v와 op를 저장할 수 있는 쿠키 객체 생성
    • v와 op를 저장하는 쿠키 객체의 이름을 다르게 설정해야 함
      • ValueCookie와 OpCookie
  • 쿠키의 value 값은 무조건 URL에 사용할 수 있는 문자열이어야 함 > 문자열로 변환하는 작업 필요: String.valueOf(value) 활용
    • Cookie valueCookie = new Cookie("value", String.valueOf(v)); Cookie opCookie = new Cookie("op", op);
    • JSON, XML을 사용하면 다양한 개체를 문자열 형태로 만들어 쿠키로 저장할 수 있음
  • 클라이언트에게 보내기 위해 addCookie( )메소드 사용
    • response.addCookie(valueCookie); response.addCookie(opCookie);
  • 쿠키는 response의 헤더에 심어진 형태로 전달됨
  • 브라우저는 서버로부터 받은 쿠키를 저장함

  Cookie valueCookie = new Cookie("value", String.valueOf(v));
  Cookie opCookie = new Cookie("op", op);
  response.addCookie(valueCookie);
  response.addCookie(opCookie);
  

• 서버에서 쿠키 읽기
  • 배열에 쿠키를 읽은 값을 넣음
    • Cookie[] cookies = request.getCookies();
  • 반복문으로 쿠키 꺼내기
    • 우선 반복문 없이 꺼내보기
      • c라는 Cookie형 변수가 cookies배열의 0번째 값이라고 가정
      • c의 key 값이 “value”와 같다면(원하는 걸 찾은 거니까), 덧셈/뺄셈의 피연산자인 x가 c의 value 값임
      • x는 0으로 초기화
      • getValue( )메소드의 리턴타입은 String인데 x는 정수니까 Integer.parseInt( )메소드로 형변환해야 함

    int x = 0;
    Cookie c = cookies[0];
    if(c.getName().equals("value")) {
      x = Integer.parseInt(c.getValue());
    }
    

    • 반복문으로 바꾸기
      • cookies 배열이 갖고 있는 개수만큼 돌면서 c 찾기
      • c를 찾으면 더이상 for문이 돌 필요가 없으니까 break

    int x = 0;
    for(Cookie c : cookies) {
      if(c.getName().equals("value")) {
        x = Integer.parseInt(c.getValue());
        break;
      }
    }
    

    • operator도 위의 코드와 같은 방식으로 만들어주기
      • op는 정수가 아니라 문자열이니까 형변환 필요없음

    String operator = "";
    for(Cookie c : cookies) {
      if(c.getName().equals("op")) {
        operator = c.getValue();
        break;
      }
    }
    

 

Cookie를 사용하는 코드 삽입한 서블릿과 HTML

• Calc2.java

package com.newlecture.web;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/calc2")
public class Calc2 extends HttpServlet {
  @Override
  protected void service(HttpServletRequest request
                        , HttpServletResponse response)
                        throws ServletException, IOException
  {
    ServletContext application = request.getServletContext();
    HttpSession session = request.getSession();
    Cookie[] cookies = request.getCookies();
		
    //response의 인코딩 방식 지정
    response.setContentType("text/html; charset=UTF-8");
    response.setCharacterEncoding("UTF-8");
		
    PrintWriter out = response.getWriter();
		
    String v_ = request.getParameter("v");
    String op = request.getParameter("operator");
		
    //기본값 처리
    int v = 0;
    if(!v_.equals("")) {v = Integer.parseInt(v_);}
		
    //값을 계산
    if(op.equals("=")) {
//    int x = (Integer)application.getAttribute("value");

      int x = 0;
      for(Cookie c : cookies) {
        if(c.getName().equals("value")) {
          x = Integer.parseInt(c.getValue());
          break;
        }
      }

      int y = v;
//    String operator = (String)application.getAttribute("op");
			
      String operator = "";
      for(Cookie c : cookies) {
        if(c.getName().equals("op")) {
          operator = c.getValue();
          break;
        }
      }

      int result = 0;
			
      if(operator.equals("+")) {
        result = x + y;
      } else {
        result = x - y;
      }
      response.getWriter().printf("계산 결과는 %d\\n", result);
    }
    //값을 저장
    else {
//    application.setAttribute("value", v);
//    application.setAttribute("op", op);
    
//    session.setAttribute("value", v);
//    session.setAttribute("op", op);

      Cookie valueCookie = new Cookie("value", String.valueOf(v));
      Cookie opCookie = new Cookie("op", op);
      response.addCookie(valueCookie);
      response.addCookie(opCookie);
    }
  }
}

• calc2.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>계산기 웹 프로그램</title>
</head>
<body>
  <form action="calc2" method="post">
    <div>
      <p>계산할 값을 입력하세요.</p>
    </div>
    <div>
      <label>입력 : </label>
      <input type="text" name="v"/>
    </div>
    <div>
      <input type="submit" name="operator" value="+">
      <input type="submit" name="operator" value="-">
      <input type="submit" name="operator" value="=">
		</div>
  </form>
</body>
</html>

 

Cookie 사용하기 결과

• value로 3, op로 + 입력

• value로 3, op로 + 입력 후 쿠키 확인

• value로 14, op로 = 입력

• value로 14, op로 = 입력 후 쿠키 확인

• 계산 결과

 

브라우저에서 쿠키 설정하기

• 크롬 > 설정 > 개인 정보 보호 및 보안 > 쿠키 및 기타 사이트 데이터
• 쿠키를 허용하지 않으면 데이터를 유지관리하는 데에 쓸 수 없음