로컬스토리지 활용해서 프론트에서 로그인 유저정보 사용하기 #76
Conversation
| @@ -11,6 +11,9 @@ function logout() { | |||
| alert('로그인 상태가 아닙니다.') | |||
| }, | |||
| success:function(data){ | |||
| localStorage.removeItem('loginUserId'); | |||
| localStorage.removeItem('loginUserName'); | |||
| localStorage.removeItem('loginUserEmail'); | |||
| if (res.status == 200) { | ||
| localStorage.loginUserId = res.responseJSON.id | ||
| localStorage.loginUserName = res.responseJSON.name | ||
| localStorage.loginUserEmail = res.responseJSON.email |
| currentUserName.innerHTML = localStorage.loginUserName | ||
| } | ||
|
|
||
| loadIndex() |
There was a problem hiding this comment.
'load' 라는 이름에서 의미를 한번에 파악하기 어려울 수 있을 것 같아요
좀 더 구체적으로 하는건 어떤가요~?
|
|
||
| const res = await api.POST("/login", form_data) | ||
| let res = $.ajax({ |
There was a problem hiding this comment.
res.responseJSON을 읽어오는게 안되더라고요.
좀 더 찾아볼께요.
There was a problem hiding this comment.
fetch api 사용하면 api.POST가 html 전체를 리턴하는데 이유를 잘 모르겠네요...
post랑 comment는 json 형태의 dto 정보만 넘어오는데 login은 html 전체가 넘어오네요.
There was a problem hiding this comment.
JSON.stringify($("#login_form").serializeObject()) 가 원인이였네요.
$("#login_form").serializeObject() 로 바꿔서 해결했습니다.
바꾸면서 로그아웃도 같이 수정했습니다.
| </li> | ||
| </ul> | ||
| ${ | ||
| (() => { |
| httpSession.setAttribute(USER_SESSION_KEY, loginService.login(loginRequest)); | ||
| return ResponseEntity.ok().build(); | ||
| return ResponseEntity.ok().body(userSession); |
There was a problem hiding this comment.
Controller 테스트에 세션값을 검증하는 부분을 추가하면 좋을 것 같아요!
| </a> | ||
| </li> | ||
| </ul> | ||
| ${ |
There was a problem hiding this comment.
이런식으로도 사용이 가능하군요 !
수정하기 쉽지 않았을텐데 감사합니다 👍
|
|
||
| if (res.status == 200) { | ||
| localStorage.loginUserId = res.responseJSON.id | ||
| localStorage.loginUserName = res.responseJSON.name | ||
| localStorage.loginUserEmail = res.responseJSON.email |
There was a problem hiding this comment.
질문이 있습니다. localStorage에 객체도 담을 수도 있나요? (userSession)
There was a problem hiding this comment.
객체는 안담아지고 String만 가능합니다.
https://javascript.info/localstorage#strings-only
There was a problem hiding this comment.
https://stackoverflow.com/questions/2010892/storing-objects-in-html5-localstorage
이런방식으로 JSON 형식의 String을 저장해서 간접적으로나마 객체로 저장할 수 있네요 ㅎㅎ
resolved: #69
login.js, logout.js 에 주석은 status 비교가 아직 동작하지 않아 이지 요청으로 남겨두었습니다.
관련 내용 다시 정리에서 위키에 올릴께요~