react-native dayjs() 타임존 세계시간 관련 내용정리

리액트만패는젊은이·2024년 5월 7일

ReactNative 공부기록

목록 보기
4/12
post-thumbnail

[문제상황]
GMT : 2024-04-30T02:00:00.000Z
베를린 timeZone Offset : +2 2024-04-30 04시00분
서울 timeZone Offset : +9 2024-04-30 11시00분
로 가정해보면 백앤드에는 한국에서 보낸 GMT 기준으로 저장이 되어잇다.
이시간을 아무런 정제없이 독일에서 나타내거나 보내게 된다면 시간의 오류가 생긴다.
dayjs()라이브러리에 setDefault()함수를 이용하여 한국시간 기준으로 바꿔야하지만 작동하지않음

Day.js의 locale 메서드는 날짜와 시간의 로컬라이제이션을 변경하는 데 사용됩니다. 즉, 이는 단지 날짜와 시간을 표시하는 형식(예: "월", "화", "수" 등)을 변경하는 것이며, 타임존 설정에는 영향을 주지 않습니다.
시간대와 관련된 문제를 해결하기 위해서는 Day.js의 tz.setDefault()를 사용하여 타임존을 명시적으로 설정해야 합니다. 하지만 앞서 말씀드린 것처럼 Hermes 엔진에서는 Day.js의 tz 모듈을 지원하지 않는다고 합니다.


[결론]

함수를 지원하지 않으니 만들어야한다.
방법1 - 프론트에서 요청을할때 나라를 식별하여 서버로 던져주고 시간의차이를 계산하여 프론트에게 넘겨준다.
방법2 - 직접계산한다..

방법2로 진행하기로 결정해서 현재 앱을 접속해 있는 나라가 서울의 utcoffset인 9와 다를때 시간의 차이만큼 더하거나 빼준다.

import dayjs, {Dayjs} from 'dayjs';
import utc from 'dayjs/plugin/utc';
import timezone from 'dayjs/plugin/timezone';

dayjs.extend(utc);
dayjs.extend(timezone); // dayjs의 기본 설정에 utc와 timezone을 확장시켜준다

export const ConvertDayAddOffSet = (day: any) => {
  const CurrentCountryOffSet: number = dayjs().utcOffset(); // - 600
  const SeoulOffset: number = 540; // 60 * 9

  const SubSeoulToCurrent = SeoulOffset - CurrentCountryOffSet;
  const AddDayjsToUtc = dayjs(day).add(SubSeoulToCurrent, 'minute');
  return AddDayjsToUtc;
};
profile
front-end-developer

0개의 댓글