왜? 데이트 피커에서는 하루 전으로 날짜가 찍히는가…..

zzzzsb·2022년 8월 27일
0

왜? 데이트 피커에서는 하루 전으로 날짜가 찍히는가…..

데이트피커에서는 toISOString() 형식으로 날짜를 받아온다

ex) 2022-08-28T03:17:17.856Z

그런데 이 형식의 경우 한국 time zone이 아니라 UCT time zone을 사용하기에, 데이트 피커에서 선택한 날짜보다 하루 전 날짜가 출력된다.

해결방법은 크게 두가지가 있는데

  • 대한민국 offset을 수동으로 추가해줌
  • 자바스크립트의 moment.js 라이브러리 사용

새벽에 영현, 근혁님과 모여 끙끙대다가 영현님은 moment.js로, 나는 offset을 추가하는 방식으로 해결해냈다.

let offset = date.getTimezoneOffset() * 60000; //ms단위라 60000곱해줌
let dateOffset = new Date(date.getTime() - offset);
  
console.log(dateOffset.toISOString());
  • 삽질의 흔적…

처음에 자꾸 date.getTimezoneOffset is not a function 이라는 에러가 떠서 뭐지 싶었는데 date값에 들어가는 형식이

Sun Aug 28 2022 03:26:17 GMT+0900 (한국 표준시)

이런 형식이어야 했다. (= New Date() 값)

그래서 db에서 가져오는 ISOStirng 형식의 데이터를 new Date() 안에 넣어 다시 바꿔준뒤 그 값을 date값으로 넣어주니 time zone이 반영된 날짜로 잘 출력되었다.

적용한 코드

function convertTime(date) {
  date = new Date(date);
  let offset = date.getTimezoneOffset() * 60000; //ms단위라 60000곱해줌
  let dateOffset = new Date(date.getTime() - offset);
  return dateOffset.toISOString();
}

export default convertTime;
const fromDate = convertTime(project.startpoint).split("T")[0];
const toDate = convertTime(project.endpoint).split("T")[0];

[javascript] toISOString() 1일 전 날짜가 뜨는 이유 및 해결법 (UTC 타임존 zero offset 이슈)

profile
성장하는 developer

0개의 댓글