Day36
간단한 로그인 기능(AccessToken을 이용한)과 HOC(high order component)로 권한 권리 페이지를 만들고 작업을 하다보니 문제가 생겼다 토큰이 변수에 저장되어 버려서 새로고침을 하면 다시 로그인을 반복 해야한다는 점 ㅜ 그래서 로그인 기능을 깊이 들어가기 전에 여러가지 브라우저 저장소를 비교하면서 브라우저 임시저장 공간에 토큰을 저장해서 사용해 보자!
1. 브라우저 저장소
브라우저 저장소
1-1 저장소 종류
쿠키: 백엔드까지 같이 날라간다. ( 리프레쉬 토큰에 쓰임)
로컬 스토리지: 브라우저에 저장하면 껐다 켜도 안 날라감(비회원 장바구니 같은 기능, 오늘 본 상품)
세션 스토리지: 브라우저에 저장하면 껐다 키면 날라감
브라우저 저장소 안에 넣는 방법으로 기본적으로 Key value 형태로 넣어준다.
브라우저 저장소 안에서 빼낼때
쿠키는 문자열로 합처 있는 것이라서 세미 콜론 기준으로 Split + 빈 공간 을 해줘서 뺀다.
로컬스토리지에서 담을때는 객체로 담기때문에 필요에 따라
배열이든 객체든 문자열로 만드는 JSON.stringfy
반대 문자를 배열로 JSON.parse
끝으로
로컬스토리지 를 사용하면 잠시나마 쉽게 로
그인 정보러르 저장해서 화면이 새로 바뀌어도 유지 될 줄 알았지만 찾아보니 대충 이런 느낌으로
react(화면이 바로 그려짐)
next(화면을 스케치 해놓고 비교해서 같으면 그대로 넣고 다르면 수정해서 다시 화면을 그림)
이러한 이유로 내가 할 수있는 상식 밖이라 도움을 받을 수 밖에 없었다.
