navigator language는 우리가 브라우져 혹은 시스템의 언어를 추론할때 자주 사용하는 속성이다.
그런데 특정 상황, 특정 브라우저에서는 우리가 의도하는데로 동작하지 않는다. 그중 가장 많이 나타나는 경우는 크롬 브라우저를 사용할 때다.
최근 크롬브라우져를 사용할때, 시스템 언어를 바꾸게 되면 크롬의 언어는 해당 시스템 언어로 변경되지만 navigator language로 locale을 판단하는 사이트의 경우에는 해당 언어를 반영하지 못하는 오류가 있다.
이는 크롬 언어설정에 따라 navigator language가 고정되기 때문이다.
이를 해결하기 위해서 간단히 사용할 수 있는 방법이있다.
ECMAScript 국제화 API “Intl”을 사용하면된다.
Intl에서 바로 시스템이나 실제 브라우져가 사용하는 Locale 값을 얻을 수 있는데 관련 속성을 바로 제공하지는 않는다. 다만 Intl의 메서드들을 사용하여 각 메서드들이 메서드로 가지고 있는 resolvedOptions() 를 이용하면 된다.
const locale = new Intl.DateTimeFormat().resolvedOptions().locale;
DateTimeFormat이 아니더라도 다양한 메서드 사용해서 추출 가능하다.
이렇게 하면 시스템 언어에 쉽게 따라갈 수 있다!
출처
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Intl
사진: Unsplash의Lucas George Wendt
