포토그램 인증 구현하기
회원정보 수정 구현
DB에 Update를 진행해볼거다.
전에 UserUpdateDto.java에서
entity만들면서 수정이 필요했다고 한 이유가
이름을 기재 안 했을경우에 공백으로 들어오면 공백으로 업뎃 처리 될 수도있기 때문이다
// 조금 위험함. 코드 수정이 필요할 예정
public User toEntity() {
return User.builder()
.name(name) //이름 기재 안했으면 문제!!(공백으로 들어올 시 공백으로 업뎃진행됨) Validation 체크 !
.password(password) //패스워드를 기재 안했으면 문제!!(공백으로 들어올 시 공백으로 업뎃진행됨) Validation 체크 !
.website(website)
.bio(bio)
.phone(phone)
.gender(gender)
.build();
}
Java
복사
UserApiController.java에 update 함수에 id값을 추가해준다.
@PutMapping("/api/user/{id}")
public String update(@PathVariable int id, UserUpdateDto userUpdateDto) {
//@PathVariable int id 가 맞는데 현재 툴 오류로 진행 불가 String으로 임시 진행
System.out.println(userUpdateDto);
return "ok";
};
Java
복사
service 폴더 안에 UserService.java 생성
package com.cos.photogramstart.service;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import com.cos.photogramstart.domain.user.User;
@Service
public class UserService {
@Transactional
public User 회원수정(int id, User user) {
return null;
}
}
Java
복사
회원수정 관련된 임시 틀을 만들어준다
@RequiredArgsConstructor
@RestController
public class UserApiController {
private final UserService userService;
@PutMapping("/api/user/{id}")
public CMRespDto<?> update(@PathVariable String id, UserUpdateDto userUpdateDto) {
//@PathVariable int id 가 맞는데 현재 툴 오류로 진행 불가 String으로 임시 진행
User userEntity = userService.회원수정(id , userUpdateDto.toEntity());
return new CMRespDto<>(1, "회원수정완료", userEntity);
};
}
Java
복사
이렇게 컨트롤러 수정이 되면 다시 서비스로 돌아가서
@RequiredArgsConstructor
@Service
public class UserService {
private final UserRepository userRepository;
@Transactional
public User 회원수정(int id, User user) {
// 1. 영속화
User userEntity = userRepository.findById(id).get(); //1. 무조건 찾았다. 걱정마 get() 2. 못찾았어 익센션 발동시킬께 orElseThrow()
// 2. 영속화된 오브젝트를 수정 - 더티체킹 (업데이트 완료)
return null;
}
}
Java
복사
.get()을 붙인 이유가 findById()에서 1번유저에 대해서 찾을건데, 만약 1번 유저가 없으면 null이 리턴될텐데 자바에서
랩핑 클래스인 Optional을 쓰면 3가지를 쓸 수 있다.
1. 무조건 찾았다. 걱정마 get()
2. 못찾았어 익센션 발동시킬께 orElseThrow()
3. orElse
이렇게 있는데 지금은 익셉션 처리를 나중에 미룰려고 1번으로 진행한다.
스프링부트 서버랑 DB사이에 영속성 컨텍스트가 있는데
findById를 통해서 1번 유저데이터를 db에서 찾아서 들고 오면
영속성 컨텍스트에 1번유저 데이터가 들어간다
그래서 영속된 데이터(1, ssar, 1234)를 수정하게 되면 자동으로 변경된 정보가 DB에 반영된다
그래서 영속화 시킨거다
@Transactional
public User 회원수정(String id, User user) {
// 1. 영속화
User userEntity = userRepository.findById(Integer.parseInt(id)).get(); //1. 무조건 찾았다. 걱정마 get() 2. 못찾았어 익센션 발동시킬께 orElseThrow()
// 2. 영속화된 오브젝트를 수정 - 더티체킹 (업데이트 완료)
userEntity.setName(user.getName());
userEntity.setPassword(user.getPassword());
userEntity.setBio(user.getBio());
userEntity.setWebsite(user.getWebsite());
userEntity.setPhone(user.getPhone());
userEntity.setGender(user.getGender());
return userEntity;
} //더티체킹이 일어나서 업데이트가 일어남.
Java
복사
젠더만 추가해서 업데이트 해보면
gender에 남 이 들어가졌다!
데이터베이스에 해당 데이터가 들어갔지만
내가 다시 프로필 화면으로 갔다가 다시 회원정보 화면으로 돌아가면 성별에 빈값으로 나온다
이유는 세션정보가 안바껴서 그런거다
@PutMapping("/api/user/{id}")
public CMRespDto<?> update(@PathVariable int id, UserUpdateDto userUpdateDto, @AuthenticationPrincipal PrincipalDetails principalDetails) {
System.out.println("userUpdateDto::"+userUpdateDto);
User userEntity = userService.회원수정(id , userUpdateDto.toEntity());
principalDetails.setUser(userEntity);
return new CMRespDto<>(1, "회원수정완료", userEntity);
};
Java
복사
principalDetails를 통해서 세션을 담아서 넣어주고 다시 서버를 실행시키면
갑자기 로그인이 안된다
암호화로 들어가야 할 비번이 현재 그냥 1234로 들어가져서 로그인이 안되는데…
package com.cos.photogramstart.service;
import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import com.cos.photogramstart.domain.user.User;
import com.cos.photogramstart.domain.user.UserRepository;
import lombok.RequiredArgsConstructor;
@RequiredArgsConstructor
@Service
public class UserService {
private final UserRepository userRepository;
private final BCryptPasswordEncoder bCryptPasswordEncoder;
@Transactional
public User 회원수정(int id, User user) {
// 1. 영속화
User userEntity = userRepository.findById(id).get(); //1. 무조건 찾았다. 걱정마 get() 2. 못찾았어 익센션 발동시킬께 orElseThrow()
// 2. 영속화된 오브젝트를 수정 - 더티체킹 (업데이트 완료)
userEntity.setName(user.getName());
String rawPassword = user.getPassword();
String encPassword = bCryptPasswordEncoder.encode(rawPassword);
userEntity.setPassword(encPassword);
userEntity.setBio(user.getBio());
userEntity.setWebsite(user.getWebsite());
userEntity.setPhone(user.getPhone());
userEntity.setGender(user.getGender());
return userEntity;
} //더티체킹이 일어나서 업데이트가 일어남.
}
Java
복사
비번 관련 암호화를 추가해주고 다시 신규 가입 후 회원수정을 해보자~
변경 해주고 다시 프로필 갔다가 회원정보 수정화면으로 들어가본다
이제 세션을 잘받아와서 수정 후에도 잘 반영됐다~
update.js에서 성공하면 원래페이지로 돌아가게 수정해주자
$.ajax({
type: "put",
url : `/api/user/${userId}`,
data: data,
contentType: "application/x-www-form-urlencoded; charset=utf-8",
dataType: "json",
}).done(res=>{
console.log("update 성공")
location.href=`/user/${userId}`;
}).fail(error=>{
console.log("update 실패")
});
Java
복사
성별을 다시 바꿔주고 성공하면은
이 화면으로 잘 넘어온다
근데 비밀번호를 빈칸으로 하고 수정하게 되면 문제가 되는데… 이건 다음에 ㅎㅎ