반응형
* Web Storage
HTML5 에서 추가된 내용으로, 데이터를 클라이언트에 저장하는 저장소입니다.
키와 값을 저장(key-value Storage)할 수 있고, Web Storage를 상속받아 구현된 localStorage와 sessionStorage가 존재합니다.
1. LocalStorage
- localStorage는 일부러 지우지 않는다면 브라우저를 닫고 열어도 계속 남아있음. (만료기간이 없음)
- 도메인마다 별도로 로컬스토리지 생성
- 접근 : window.localStorage
- 사용 예 : 지속적으로 필요한 데이터(자동 로그인 등)
//로컬스토리지 저장
localStorage.loginId = value;
localStorage.setItem("key", value);
//특정 로컬스토리지 불러오기
localStorage.loginId;
localStorage.getItem("key");
//전체 로컬스토리지 데이터 불러오기
localStorage.getItem();
//특정 로컬스토리지 삭제
localStorage.removeItem("key");
//로컬스토리지 전체 삭제
localStorage.clear();
2. SessionStorage
- sessionStorage는 페이지의 window가 바뀌거나 브라우저 탭을 닫을 때 사라짐. (세션이 만료될때 종료)
- 브라우저가 다르면 서로 다른영역
- 도메인마다 별도의 세션스토리지 생성
- 접근 : window.sessionStorage
- 사용 예 : 잠깐 동안 필요한 정보(일회성 로그인 정보)
//세션 저장
sessionStorage.setItem("key", value);
//특정 세션 값 불러오기
sessionStorage.getItem("key");
//특정세션 삭제
sessionStorage.removeItem("key");
//세션 전체 삭제
sessionStorage.clear();
* Java에서 SessionStorage
public String intro( HttpServletRequest req, HttpServletResponse res){
//세션 생성
req.getSession().setAttribute("key", value);
//세션 값 반환
req.getSession().getAttribute("key");
//세션 값 반환 없으면 세션생성
req.getSession();
//세션 값 반환 없으면 null 반환
req.getSession(true);
}
public void filter(ServletRequest req, SercletResponse res){
HttpSession session = request.getSession();
}
// 세션종료 모두삭제
session.invalidate();
// Key인 세션 제거
session.removeAttribute("key");
// 세션 속성의 이름들을 Enumeration 객체 타입으로 리턴
session.getAttributeNames();
* 쿠키 vs Web Storage
- 쿠키 데이터는 서버로 전송되지만, Web Storage의 데이터는 전송 X
- 쿠키 데이터와 달리 Web Storage의 데이터는 반영구저장이 가능.
반응형
'Front > JavaScript' 카테고리의 다른 글
for await of (0) | 2020.11.12 |
---|---|
자바스크립트 코드 별 성능 비교 / 스코프 체인 (0) | 2020.08.31 |
특정일로 부터 날짜 계산 (JavaScript) (0) | 2020.07.28 |
웹 실행순서 (java > jstl > html > javascript) (1) | 2020.01.13 |
자바스크립트 뒤로가기(백스페이스) BFCache 이슈 / onpageshow (0) | 2019.07.16 |