📝 회원정보 수정
- 이번 시간에는 회원정보 수정을 위한 기능을 추가해보도록 하겠습니다.
- 우선 우리가 header.jsp 파일에서 설정했던 경로를 요청받기 위해 Controller 클래스에 함수를 구현해주어야 합니다.
- 따라서 UserController 클래스에 다음과 같이 함수를 추가해줍니다.
- 즉 header.jsp 파일에서 구현한 버튼이 눌리게 되면 해당 버튼은 '/user/updateForm'이라는 경로를 요청하게 되며 UserController에서는 이 경로에 대한 요청을 받는 함수가 구현되어 있으므로 해당 함수에서는 요청을 받아들여 jsp 파일을 반환하고 해당 jsp 파일은 html 파일로 변환되어 사용자에게 출력될 것입니다.
- 아직 updateForm.jsp 파일이 없기 때문에, user 폴더 아래에 있는 joinForm.jsp 파일을 복사하여 그대로 붙여넣기 한 뒤 파일명을 updateForm으로 바꾸어 아래와 같이 수정해줍니다.
- 수정된 사항으로 우선 이후에 user.js 파일에서 어떤 사용자의 정보를 수정할 것인지를 파악하기 위한 <input> 태그를 추가해주었으며 username의 경우는 수정할 수 없는 사항이기 때문에 태그 끝에 'readonly' 속성을 추가해주었습니다. 또한 기본값을 설정해주기위해 value 속성을 추가하여 기존의 회원 정보를 삽입해주었습니다.
- 이 외에도 <button> 태그의 id와 버튼 안의 텍스트 또한 알맞게 수정해주었습니다.
- 이제 user.js 파일에 다음과 같이 코드를 추가해줍니다.
- 이어서 UserService 클래스에 회원정보 수정을 위한 함수를 구현해줍니다.
- 마지막으로 UserApiController에서 위 함수를 사용하여 회원정보 수정을 수행하고 결과를 반환해줍니다.
- 이후 테스트를 진행하여 결과를 확인합니다.
📝 오류 수정
- 위에서 테스트를 진행해보면 알겠지만 데이터베이스에는 바뀐 결과값이 잘 들어가는 것을 확인할 수 있으나 사용자가 보았을 때는 값이 그대로인 것을 확인할 수 있습니다.
- 그 이유는 세션 값이 변경되지 않았기 때문입니다. 따라서 우리가 직접 세션 값을 변경해주어야 합니다.
- 우선 user.js의 update 함수에서 username 데이터를 추가로 받아옵니다.
- 다음으로 SecurityConfig 클래스에서 AuthenticationManager 객체를 반환하는 함수를 오버라이드하여 스프링 빈으로 등록합니다.
- 이후 UserApiController 클래스에서 이를 @Autowired 어노테이션을 통해 받은 뒤, 해당 객체를 활용하여 다음과 같이 세션 등록을 수행할 수 있습니다.
- 이제 페이지를 새로고침하여 회원 정보를 수정해보면 사용자에게 보여지는 데이터 역시 수정된 데이터가 바로 보이는 것을 확인할 수 있습니다.
💡 알게 된 점
- 세션 값을 직접 변경하는 방법
📌 Reference
'🚗 Backend Toy Project > 스프링 부트 게시판' 카테고리의 다른 글
[스프링부트 게시판] 21. 댓글 구현 (2) | 2022.05.17 |
---|---|
[스프링부트 게시판] 20. 카카오 로그인 (0) | 2022.05.16 |
[스프링부트 게시판] 18. 게시글(추가, 상세보기, 삭제, 수정, 페이징) (0) | 2022.05.14 |
[스프링부트 게시판] 17. 비밀번호 해쉬 후 회원가입 및 로그인하기 (0) | 2022.05.12 |
[스프링부트 게시판] 16. 스프링 시큐리티 체험해보기 (0) | 2022.05.12 |