localstorage - woowa-turkey/miniprojects-2019 GitHub Wiki

//login
//login 성공시 UserSession 객체를 넘겨줌
let res = $.ajax({
    url:"/login",
    type:"POST",
    async: false,
    data: form_data,
    headers: header
})

if (res.status == 200) {
    localStorage.loginUserId = res.responseJSON.id
    localStorage.loginUserName = res.responseJSON.name
		localStorage.loginUserEmail = res.responseJSON.email
		alert('로그인되었습니다.')
		window.location.href="/"
} else if (res.status == 400) {
    alert(res.responseJSON.message)
}


// view(html) 적용 예시
<div class="user-info mrg-left-5">
   <span class="name pdd-right-5 text-white text-bold" id="current-user-name">현재 로그인된 사용자 이름 위치</span>
</div>

const currentUserName = document.getElementById("current-user-name")
currentUserName.innerHTML = localStorage.loginUserName


//logout
$.ajax({
    url:"/logout",
    type:"POST",
    async:false,
    dataType:'text',
    error:function(request,status,error){
    	alert('로그인 상태가 아닙니다.')
    },
    success:function(data){
        localStorage.removeItem('loginUserId');
        localStorage.removeItem('loginUserName');
        localStorage.removeItem('loginUserEmail');
    	alert('로그아웃 되었습니다.')
    }
})

...
<div class="user-info mrg-left-5">
   <span class="name pdd-right-5 text-white text-bold" th:text="${session.loginUser.name}"></span>
</div>

...
<script th:inline="javascript">
    var loginUserId = [[${session.loginUser.id}]];
    var loginUserName = [[${session.loginUser.name}]];
		var loginUserEmail = [[${session.loginUser.email}]];
</script>
<script src="/js/script.js"></script>
...