header.jsp
<ul class="navbar-nav"> <!-- 로그인 돼 있을때 -->
<li class="nav-item"><a class="nav-link" href="/board/saveForm">글쓰기</a></li>
<li class="nav-item"><a class="nav-link" href="/user/updateForm">회원정보</a></li>
<li class="nav-item"><a class="nav-link" href="/logout">로그아웃</a></li>
</ul>
userController.java
@GetMapping("/user/updateForm")
public String updateForm() {
return "user/updateForm";
}
updateForm.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../layout/header.jsp"%>
<div class="container">
<form>
<input type="hidden" id="id" value="${principal.user.id }">
<div class="form-group">
<label for="userName">UserName</label>
<input type="text" value="${ principal.user.userName }" class="form-control" placeholder="userName" id="userName" readonly>
</div>
<div class="form-group">
<label for="pwd">Password</label>
<input type="password" class="form-control" placeholder="password" id="password">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" value="${ principal.user.email }" class="form-control" placeholder="email" id="email">
</div>
</form>
<button id = "btn-update" class="btn btn-primary">회원수정완료</button>
</div>
<script src="/js/user.js"></script>
<%@ include file="../layout/footer.jsp"%>
user.js
let index = {
init: function(){
$("#btn-update").on("click",()=>{
this.update();
});
}
,update: function(){
//alert('user의 save함수 호출됨');
let data = { // joinForm input태그의 id로 값을 가져와서 저장
id : $("#id").val(),
password:$("#password").val(),
email:$("#email").val()
};
$.ajax({
type:"PUT",
url:"/user",
data:JSON.stringify(data),
contentType: "application/json; charset=UTF-8",
dataType:"json"
}).done(function(resp){
alert("회원수정이 완료되었습니다.");
console.log(resp)
location.href="/";
}).fail(function(error){
alert(JSON.stringify(error));
});
}
}
index.init();
UserApiController.java
@PutMapping("/user")
public ResponseDto<Integer> update(@RequestBody User user){
userService.회원수정(user);
return new ResponseDto<Integer>(HttpStatus.OK.value(), 1);
}
UserService.java
@Transactional
public void 회원수정(User user) {
// 수정시에는 영속성 컨텍스트 User 오브젝트를 영속화시키고, 영속화된 User 오브젝트를 수정
// select 를 해서 User 오브젝트를 DB로 부터 가져오는 이유는 영속화를 하기 위해서 !!
// 영속화된 오브젝트를 변경하면 자동으로 DB에 update 문을 날려준다
User persistance = userRepository.findById(user.getId()).orElseThrow(()->{
return new IllegalArgumentException("회원 찾기 실패");
});
String rawPassword = user.getPassword();
String encPassword = encoder.encode(rawPassword);
persistance.setPassword(encPassword);
persistance.setEmail(user.getEmail());
// 회원수정 함수 종료시 = 서비스 종료시 = 트랜잭션 종료 = commit이 자동으로 된다.
// 영속화된 persistance 객체의 변화가 감지되면 더티체킹이 되어 update문을 날려줌.
}
테스트
DB를 확인해보면 값이 잘 바뀐것을 볼 수 있다.
하지만 다시 회원정보 페이지를 들어가면 값이 안바뀌어 있는데
사실 이건 오류가 아니고 세션에 띄워져있는 회원정보가 예전 회원에 대한 정보이기 때문이다.
따라서 회원정보의 세션을 바꿔치기 하는 작업이 필요하다.