현재시간을 한국 시간으로 표시하기
세계 각지에는 협정 세계시(UTC)를 기준으로 하여 그 국가나 지역에서 공통적으로 사용하는 표준시가 있습니다.
대한민국 표준시는 KST (Korea Standard Time) 라고 합니다.
KST는 UTC(협정 세계시)보다 9시간 빠릅니다. 예를 들어 한국이 오전 9시일 때 영국은 오전 0시입니다.
newDate()를 사용해서 가져온 현재날짜와 시간은 기본적으로 사용자의 PC에 설정된 표준 시간대를 기준으로 표시합니다.
즉 사용자의 위치에 따라 다른 결과를 반환하는 것입니다.
예를 들어, 한국에서 newDate() 함수를 실행하면 KST 기준의 시간 정보가 반환되고,
미국에서 실행하면 PST(Pacific Standard Time) 기준의 시간 정보가 반환됩니다.
그러므로 newDate() 함수는 서로 다른 표준 시간대에 있는 경우 시간 정보가 달라질 수 있다는 점을 유념하여 사용해야합니다.
1.현재시간 (LOCALE) 구하기
// 1. 현재 시간 (Locale)
const locale = new Date();
console.log("LOCALE 시간 : " + locale);
사용자 PC의 표준 시간대를 변경하면, new Date()도 맞춘 시간으로 보여주는 것을 확인 할 수 있습니다.
2. UTF시간 구하기
// 1. 현재 시간 (Locale)
const locale = new Date();
console.log("LOCALE 시간 : " + locale);
// 2. UTC 시간
const utc = locale.getTime() + (locale.getTimezoneOffset() * 60 * 1000);
console.log("UTC 시간 : " + utc);
dataObj.getTimezoneOffset()
getTimezoneOffset()이라는 함수를 이용하여 UTC시간을 계산합니다
함수는 현재 사용자 pc 설정 시간대로부터 UTC시간까지의 차이를 '분'단위로 리턴합니다
사용자 pc시간설정이 한국이라면 '-540'을 리턴할 것입니다.
한국시간은 UTC시간보다 9시간 빠르기때문에 UTC시간은 한국으로부터 -9시간(-540분)이기 때문입니다.
const utc = locale.getTime() + (locale.getTimezoneOffset() * 60 * 1000);
getTime()함수는 '1970년 1월 1일 00:00:00 UTC'로 부터 주어진 시간 사이의 경과시간(밀리초)를 리턴합니다.
따라서, UTC 시간을 계산하기 위해 getTime()의 결과 값에 getTimezoneOffset() 함수에서
나온 분단위의 시간을 밀리초 단위로 변환하여 더해주어야합니다.
이제 'utc'는 현재 시간을 utc 시간으로 변환한 밀리초 값입니다.
2.PC 표준시간대 설정 관계없이 한국시간 (KST) 표시하기
// 1. 현재 시간 (Locale)
const locale = new Date();
console.log("LOCALE 시간 : " + locale);
// 2. UTC 시간
const utc = locale.getTime() + (locale.getTimezoneOffset() * 60 * 1000);
console.log("UTC 시간 : " + utc);
// 3. UTC to KST (UTC + 9시간)
const kr_time_diff = 9 * 60 * 60 * 1000;
const kr_now = new Date(utc + (kr_time_diff));
console.log("KST 시간 : " + kr_now);
const kr_time_diff = 9 * 60 * 60 * 1000;
한국 시간(KST)은 UTC시간보다 9시간 더 빠릅니다. 9시간을 밀리초 단위로 변환하였습니다.
const kr_now = new Date(utc + (kr_time_diff));
UTC 시간을 한국 시간으로 변환하기 위해 utc 밀리초 값에 9시간(밀리초 단위로 변환한 값)을 더해주었습니다.
그리고, 'new Date()'를 사용하여, 밀리초값을 date로 변환하였습니다.
이렇게 하면, 사용자 환경의 시간대가 어떻게 설정이 되어 있든 사용자에게 한국 시간을 보여줄 수 있습니다.
출처 : https://hianna.tistory.com/390
'STUDY > JavaScript' 카테고리의 다른 글
[JS] encodeURIComponent (0) | 2024.04.29 |
---|---|
[JS] Blob, File, URL 다루기 (0) | 2024.02.26 |
[JS] getUserMedia() 호환성(iOS 지원안함)문제해결 (1) | 2024.02.16 |
[JS] 부모창에서 자식창으로 값 전달 (0) | 2023.10.19 |
[JS] undefined, null 체크하기 (0) | 2023.10.13 |