[TIL] #88. 231210

어제 목표 & 오늘 완료한 한 일 

• 알고리즘 문제
• 자바 종합 문법 복습 (3주차)
• 스프링 기초 개인과제 해설 강의
• 스프링 심화 과제 (테스트 코드 작성)
• 스프링 심화 팀 프로젝트

내일 목표

• 알고리즘 문제
• 자바 종합 문법 복습 (3주차)
• 스프링 기초 개인과제 해설 강의
• 스프링 심화 과제 (테스트 코드 작성)
• 스프링 심화 팀 프로젝트

 

발생한 에러와 해결 방법

basic.js:63 Uncaught TypeError: response.forEach is not a function

새로고침시 DB에 저장된 좋아요 상태를 가져오기 위해 작성한 코드에서 이러한 에러가 발생하였었다. 해당 에러는 response가 배열의 형태가 아니라 발생하는 에러라고 한다. 그래서

Array.from(response).forEach

 이와 같이 코드를 작성하였더니 문제를 해결할 수 있었다. Array.from()은 배열의 모든 요소를 호출하는 함수

 라고 한다.

 

그리고 PostLike에 대한 값을 모두 가져오고 싶어 코드를 작성한 결과, 

GET http://localhost:8080/api/post/like net::ERR_INCOMPLETE_CHUNKED_ENCODING 200 (OK)"

Unable to handle the Spring Security Exception because the response is already committed.

이와 같은 에러가 발생했다. 알고보니 해당 부분을 구현하는 과정에서 추가한 서버쪽 코드인 PostLikeResponseDto에 코드를 잘못 작성해서 그런 것이었다. 

 

느낀점 & 오늘 공부한 내용

오늘은 어제 마무리하지 못했던 좋아요 부분을 끝내고, 팔로우 부분을 구현하고자 하였다. 좋아요는 DB에 저장된 데이터를 가져와 새로고침이 될 때마다 하트 아이콘의 상태를 관리하는 부분을 구현하는 것이 가장 어려웠던 것 같다. 좋아요 취소는 추가랑 비슷해서 금방 구현할 수 있었다. 좋아요 갯수를 가져오는 부분에서도 약간의 어려움이 있었다. 새로고침시 좋아요 상태가져오는 부분에서는 응답데이터에 postId와 클릭된 게시물의 id를 가져와 비교하는 부분과 그 방법을 생각하기 까지 어려움이 있었고, 서버쪽 코드를 작성하는 과정에서도 좋아요 관련 데이터를 전부 가져올지, 아니면 로그인한 유저에 대한 데이터만 가져올지 고민을 하였다. 고민을 하다가 내가 결국에 선택한 방법은 좋아용 관련 데이터를 전부 가져오는 것이었다. 왜냐하면 좋아요 상태만 필요한 게 아니라 모든 게시물에 대한 좋아요 수도 필요했기 때문이다. 지금은 데이터가 적어서 괜찮지만, 데이터가 많아지는 상황이 온다면 더 고민을 해볼 필요가 있는 부분이라고 생각된다.

그리고 중간중간 깃관련해서도 오류가 되게 많이 발생했었고 pull 해서 오류가 발생하는 경우도 꽤 있었다.

좋아요 부분 끝내고 구현하려고 했던 팔로우 부분.. 결론부터 말하자면 구현하지 못했다. 메인페이지에서 유저 프로필 이미지를 클릭했을 때 해당하는 유저의 페이지로 이동을 하고 거기서 팔로우, 언팔로우와 팔로워 팔로잉 목록을 보이게 하고자 했다. 그런데 화면을 전환하는 부분을 구현하려고 했는데 자꾸 로그인 화면으로 넘어갔다. 개발자도구에서 header로 넘어오는 데이터를 살펴보니 쿠기가 null과 제대로 된 토큰 이렇게 2개 넘어오는 것을 볼 수 있었다. 그런데 null 부분이 앞쪽에 있어 토큰을 가지고 있지 않다고 생각하여 자꾸만 로그인 페이지로 화면을 전환시키는 것 같았다. 이 문제를 해결하기 위해서 정말 시간가는 줄도 모르고 많은 시간을 투자하면서 정말 많이 노력했음에도 불구하고 코드 수정할 때마다 테스트하기 위해 진행했던 로그인만 몇 십번 하고, 결국에는 해결하지 못했다. 팔로우 부분은 서버쪽 코드도 내가 작성한 부분이라 프론트부분도 꼭 구현하고 싶었는데 너무 아쉽고 속상했다.