Java 기반 클라우드 융합 개발자 과정 - KH 정보교육원/9월

22.09.30 - [ Spring ] cookie { 쿠키란?, 쿠키설정, 쿠키확인 }, id 저장

giggs 2022. 10. 7. 09:33

 

-- INDEX --

 

 

1. 쿠키란? 2. 쿠키 객체 만들기 3. 쿠키 설정
클라이언트 측 data 저장소 new Cookie()
resp.addCookie()
.setMaxAge()
.setPath()

 

4. 쿠키 삭제 5. 클라이언트에서
쿠키확인
6. 서버에서
쿠키확인
7. id 저장하기
덮어쓰기로 삭제
key, path 동일하게 지정
${cookie.key}
${empty cookie.key}

@CookieValue
Cookie key
flag 역할 지정하고
값 들어오면
쿠키 생성해서 저장

 

 

 

 


 

 

 

 

 

 

1. 쿠키란?

  • 서버 측에서는 4가지 스코프 - 저장소 있었다.( page,request,session,application)
  • 쿠키란 클라이언트 측에서 가지고 있는 data 저장소 -
  • cookie를 이용하여 key:value 형태로 데이터 저장할 수 있다!

 

 

 

 

 

# 쿠키는 서버가 발급한다. 

  • 서버가 발급해준 url에 맞춰 / client는 url에 맞춰 / 해당하는 쿠키를 들고 가는 것이다.
  • 헬스장에서 나한테 5277발급해줬다. / 나는 헬스장에 갈 때 / 5277 헬스장카드키 들고 간다

 

 

 

# 쿠키는 client에 저장된다.

  • client는 어떤 url을 이용해서 방문하게 되면 url에 맞는 쿠키를 들고 방문한다.
  • 예를 들어 – 헬스장에서는 5277 하면 나라고 알아본다. / 목욕탕에서는 7674 하면 나라고 알아본다.

 

 

 

 


 

 

 

 

2. 쿠키 객체 만들어서 사용해보기

 

 

 

2-1 : 컨트롤러 하나 만들어서 테스트해보자

  • new Cookie("key", "value");

 

 

 

 


 

 

2-2 :  이 쿠키를 클라이언트한테 주면 된다.

  • 클라이언트에게 돌려주려면?
  • response에 담아주면 된다.
  • resp.addCookie();

 

 

이러면 클라이언트는 내가 만든 쿠키를 받게 된다..

 

 


 

 

2-3 : 서버에서 발급한 쿠키 클라이언트가 받았나 확인

  • 클라이언트에서 key:value 로 데이터를 저장할 수 있기 때문에
  • 클라이언트에서 key값으로 value를 꺼내올 수 있다.
  • id 저장하기 같은 기능에 사용

 

 

 

 

 

 

 

 

 

 


 

 

 

 

 

 

3.  cookie 추가 설정

  • 이런 것들 설정 가능

 

 

 


 

 

3-1 : setMaxAge()

  • 쿠키 일정 시간 동안만 살아있도록 설정 가능
  • 이거 가지고 광고 몇 시간 동안 보지 않기 같은 기능 적용한다.
  • 서버에서 부여해 준 쿠키의 setMaxAge 값으로 일정 시간 유지되게 해 주고
  • 클라이언트 쪽에서 쿠키 존재하는 동안 광고 차단

 

 

 

 


 

3-2 : setPath()

  • 내가 만든 쿠키가 다른 곳에서는 유지가 안된다.
  • 쿠키가 특정 경로에만 존재하고 있다. ( 기본적으로 태어난 페이지에서 유지 )
  • 왜? - 쿠키 구워줄 때 경로 설정 안 해주어서 그렇다.
  • 쿠키 . setPath()

 

 

 

해당 프로젝트 모든 경로에서 유지되도록 setPath 를 / 로 지정

 

 

 

# 기존에 받고 있던 쿠키와 비교 - 확인 #

Path가 달라서 서로 다른 쿠키로 취급이 되고 있다.

 

 

 

 

 

 


 

 

 

 

4. 쿠키 삭제하기 

  • 쿠키 삭제하는 법
  • 삭제하는 것은 따로 없고
  • 똑같은 이름으로 덮어 씌우기 해주면 된다.+ 유지되는 시간 0초
  • key값이 같아도 – 경로가 다르면 다른 쿠키로 인식된다.
  • path 다른 쿠키는 별개의 쿠키로 인식되므로 덮어 씌기 해서 지울 때 주의할 것.!

 

 

 

4-1 : 쿠키 삭제하는 요청-메서드 만들어서 처리해보기

 

 

 

 

 

 

클라이언트가 들고 있는 쿠키를 뺏어서 삭제해줄 수는 없다.

내가(서버가) 쿠키 발급해주면 클라이언트가 쿠키를 들고 있게 되니까

0초짜리 쿠키를 발급 덮어쓰기 개념으로 지워주는 것!

0초짜리라 쿠키에 값이 안 나온다. - 존재 X

 

 

 

 

# key값이 같아도 경로가 다르면 다른 쿠키로 인식된다.

# path 다른 쿠키는 별개의 쿠키로 인식되므로 덮어 씌기 해서 지울 때 주의할 것.!

 

 

 

 


 

 

 

 

5. 화면에서 쿠키 체크해보기

  • 쿠키는 배열로 관리된다. 따라서 ${} 이런 식으로 사용 가능
  • cookie라는 변수도 만들어져 있다.

 

 

 

5-1 : 쿠키 확인

 

 


 

5-1 : 쿠키가 비었는지 - 존재하는지 확인 

  • 비어있지 않으면 광고를 제한한다거나 하는 처리 가능하겠죠?
  • 쿠키의 name값과 value 도 확인하기

 

 

 

 

 

 


 

 

 

 

 

6. 서버에서 쿠키 체크해보기

  • 클라이언트가 가지고 있는 쿠키를 받아와서 서버에서 출력해보기

 

 

6-1 : 클라이언트가 가지고있는 쿠키 받아오기

  • 방법은? - 파라미터에 Cookie 받아오면 된다.

6-2 : 대신 쿠키의 key값과 동일하게 부여해주어야 한다.


6-3 : @CookieValue 어노테이션도 달아주어야 한다.

 

 

 

 


 

 

6-4 : 쿠키 만들고 콘솔 창에서 확인해보기

  • create 요청으로 쿠키 만들고
  • check2로 요청 보내서 – 콘솔 창에 출력되는지 확인

 

 

 

 쿠키 없이 넘어오면 에러 난다..

 

 


 

 

6-5 : @CookieValue 처리 방식

  • 이 어노테이션은 스프링이 해놓으면 맞춰서 넣어준 것이었다.
  • 스프링 배우기 전에 하려고 했으면 어떻게 해야 했을까?
  • 서블릿 이용하여 처리해주었어야 했다.
  • req.getCookies() 해서 쿠키를 가져오고 name에 맞는 쿠키 찾아서 넣어주는 것이었다.

 

 

 

 

 

 

 


 

 

 

 

 

7. 쿠키를 가지고 - 아이디 저장되도록 해보자!

 

 

 

 

 

 

7-1 : 아이디 저장 체크 박스의 값을 이용

  • 아이디 저장 체크를 하고 로그인 버튼을 눌렀을 때(=로그인 요청을 할 때)
  • 아이디 저장 박스 체크하고 보내면  saveId라는 값이 넘어올 것이고 안 하면 안 나올 것이다.
  • id 입력 칸에 있는 값을 - 쿠키로 관리할 것이다

 

 


 

 


 

 

7-2 : 체크박스 값이 넘어와서 null이 아니면 id 저장해주기

  • 사용자가 아이디 저장 체크했으면
  • id입력창에 입력한 값 - 쿠키 저장해주기 
  • saveId != null이면 쿠키 저장해주기

 

 

 

쿠키에 path 지정안해주었으므

발급해준 서버url인 app99/member 에 갈 때만 쿠키 들고 간다..

 

 

 


 

 

 

7-3 : id 입력 칸에 id값 유지되도록 해주기

  • 화면 작업 – id 자리에 id 값 유지되도록 써주기
  • 마지막으로 로그인 시도했던 id값 == 쿠키에 있는 값
  • value로 넣어주면 된다.