프론트+백엔드가 첫 협업한 미니프로젝트를 마쳤다.
https://github.com/0AndWild/recipes
부족한 부분이 너무 많았다........
구현하려고 했던 기능들을 back단에서는 어느정도 완성을 했지만, 프론트와 합치려니 생기는 문제들이 정말 많았다. 처음 접해보는 문제들이라 시간이 촉박하여 완벽하게 끝내지 못한 점이 아쉽다.
그래도 이번을 통해 스프링시큐리티를 많이 배웠던 것 같다.(그치만 이제는 JWT만 쓸거다ㅋ)
이번주 잠을 너무 안자서 정말 너무 피곤하다........ 내일부터 다시 클론코딩을 바로 진행하는데 컨디션이 걱정이다ㅠㅠ
이번 미니 프로젝트를 통해 배웠던 부분 및 회고를 팀원들과 함께 리스트해보았다.
-
(BE <-> FE)로그인/회원가입: spring security form을 disable()하여 프론트에 값을 넘겨주기 위해 cors filter사용, 그렇지만 세션이 여전히 넘어가지 않음.
=> 여러가지 시도를 해보고 구글링을 해보니 양쪽에서 credential을 true를 맞추어주어야 했고 { 'Content-Type': 'application/json', withCredentials: true } 를 axios에 넣어주어야 했다.
cors의 경우는 CorsConfigurationconfig 클래스를 만들어 여기에서 허용값들을 지정해주거나 securityconfig클래스에서 cors를 지정해줄 수 도 있었다. 또한 프론트쪽에서 프록시 설정을
하는 방법도 이용이 가능헀다. -
(BE) spring security 로그인시 아이디값에 이메일값이 저장되는 문제
=> dto와 service에 변경된 이름 통일 -
(BE) 이미지 넣기 -> 이미지를 string으로 불러오고자 했는데 varchar(max)로 받을 수 있는 사이즈 크기를 넘어서서 원하는 이미지를 넣을 수 없음
-
(BE) 서버에서 특정 어노테이션을 사용하여 로그인한 사용자의 정보를 가져오지 못함
=> Authentication 객체 생성으로 가져옴 -
(FE, BE) API 호출 시 PUT / DELETE method 사용 불가
=> credential true추가로 해결 -
(FE) 토큰값의 유무로 메인페이지에 로그인 버튼과 로그아웃 버튼이 같이 나오지 않게 Header.js에서 값을 설정해주었지만 다른페이지로 이동하면 기능하지 않음
=> 다른 페이지로 이동하면 설정 값이 리셋이 되는것을 발견하고 App.js에서 한번 더 값 설정을 해주어 다른페이지 이동을 하더라도 기능할 수 있도록 조치.
