인프런 커뮤니티 질문&답변
작성한 질문수
시간 오류 - getTime()
해결된 질문
작성
·
1.3K
0
안녕하세요.
한국에선 문제 없던 앱이. 미국에서 동작할경우 등록한 날짜보다 하루 전의 날짜로 저장되는문제를 겪었습니다.
찾아보니 getTime()도 toISOString 와 마찬가지로 UTC 0+ 시간으로 작동되는 부분이 문제였습니다. 스토리지에 저장되는 타임스탬프가 UTC 기반이였던거죠. 달력에서 날짜를 설정할때 시간은 반영되지않고 12am 즉 00시로 설정되는데, 한국은 UTC +9 이라 날짜에 영향을 주지 않았지만, 제가 있는 지역의 타임존은 UTC -5이기에 하루전날의 타임스탬프가 저장되고 다시 그 타임스탬을 이용해 new Date(date)을 해줄때 전날의 날짜가 불러진다고 결론내렸습니다.
이문제를 해결하기위해, 스트로지에 타임스탬프가아닌 getStringDate 으로 뽑아낸 스트링 날짜를 넣어주었고. 다이어리 리스트에서 sort 를 위한 비교를할때만 getTime()을 써주었습니다.
전문가의 의견을 듣고싶습니다.
답변 2
4
안녕하세요 이정환입니다.
예제 코드를 작성할 때에 국내 시간대 이외의 시간대를 고려하지 못했네요
미국 시간대의 경우 문제가 발생하는게 사실입니다.
우선 수강에 불편함을 드려 죄송합니다 🥲
이 문제가 발생한 이유는 new Date(yyyy-mm-dd) 형식은 UTC 타임을 기준으로 Date 객체를 생성하기 때문입니다. 따라서 말씀하신 것 처럼 UTC -n 시간대에서는 문제가 발생할 수 있습니다.
이 문제에 대한 해결책은 말씀하신 getStringDate를 이용하는 것 도 훌륭한 해결책이 될 수 있습니다.
그런데 다른 해결책도 궁금하시다면 아래의 2가지를 참고하실 수 있습니다.
첫번째 : yyyy-mm-dd 00:00:00 형식 사용하기
yyyy-mm-dd 형식과 달리 yyyy-mm-dd 00:00:00 형식을 사용해 Date 객체를 생성하면 UTC 기준이 아닌 현재 시간대(로컬 타임)를 기준으로 Date 객체를 생성합니다. 이를 이용하면 시간대가 달라서 겪는 문제를 쉽게 해결될 수 있습니다. 우리 프로젝트에 적용하시려면 src/App.js의 onCreate를 다음과 같이 수정하시면 됩니다.
// src/App.js
const onCreate = (date, content, emotionId) => {
dispatch({
type: "CREATE",
data: {
id: idRef.current,
date: new Date(`${date} 00:00:00`).getTime(),
content,
emotionId,
},
});
idRef.current += 1;
};
두번째 : yyyy/mm/dd 형식 사용하기
yyyy-mm-dd 형식과 달리 yyyy/mm/dd 형식 또한 앞서 살펴본 yyyy-mm-dd 00:00:00 형식과 같이 로컬타임을 기준으로 Date 객체를 생성합니다. 따라서 다음과 같이 src/App.js를 수정하시면 문제가 해결됩니다.
// src/App.js
const onCreate = (date, content, emotionId) => {
dispatch({
type: "CREATE",
data: {
id: idRef.current,
date: new Date(date.replaceAll("-", "/")).getTime(),
content,
emotionId,
},
});
idRef.current += 1;
};yyyy-mm-dd 형식의 문자열을 문자열 메서드 replaceAll을 이용하여 yyyy/mm/dd 형식으로 변환합니다.
이 두 방법외에도 new Date(yyyy, mm, dd) 형식을 사용할 수 있으나 이 때의 mm은 0부터 11 까지로 월을 표현하기 때문에 월에 -1을 해주어야 하는 문제가 있어 우리 프로젝트에 어울리지는 않다고 생각되므로 권장드리지는 않습니다.
감사합니다.
1
감사합니다 . yyyy-mm-dd 00:00:00 형식을 사용하니 간단히 해결되었습니다.
getTime의 문제가 아닌 new Date()을 만들때 사용되는 형식의 문제였군요. 좋은정보 감사합니다!