[협업 시 주의점 #1] 프론트와 백엔드 날짜 형식 맞추기

728x90
<Calendar onChange={(date) => setRecruitmentPeriod(moment(date).format('yyyy-MM-DD'))}  />

 

달력에서 선택된 날짜를 다음과 같은 형식으로 JSON화 하여 전송한다고 해보자.

 

(백엔드) 실수코드

public LocalDate deadline;

 

요런식으로 받았더니 에러가 난다.

 

당연히 Json 포맷을 안맞췄기 때문.

 

 

 

(백엔드) 실수코드 2

implementation 'com.fasterxml.jackson.core:jackson-databind:2.16.0'

jackson-databind를 통해 Json 의 날짜 포멧을 바꾸자.

@JsonFormat(pattern = "yyyy-MM-dd") //데이터 포맷 변환
 private LocalDateTime deadline;

 

날짜 포맷을 맞춰서 설정하고 보내면 또 오류가 난다...

 

leException: JSON parse error: Cannot deserialize value of type `java.time.LocalDateTime` from String "2024-01-21": Failed to deserialize java.time.LocalDateTime: (java.time.format.DateTimeParseException) Text '2024-01-21' could not be parsed: Unable to obtain LocalDateTime from TemporalAccessor: {},ISO resolved to 2024-01-21 of type java.time.format.Parsed]

 

이유는 LocalDateTime은 날짜 + 시간까지 포함하는 반면에 Json으로 오는 형식은 시간이 없기 때문

 

따라서, LocalDateTime을 LocalDate로 바꾸고 실행하자.

@JsonFormat(pattern = "yyyy-MM-dd") //데이터 포맷 변환
private LocalDate deadline;

 

 

 

 

[ 참고 ]

리액트에서 'yyyy-MM-dd'에서 dd는 요일이 출력된다.(공부 필요)

따라서 'yyyy-MM-DD'로 작성하고

스프링에선 ' yyyy-MM-dd'로 설정해야 한다.

728x90