[EXT-023][실무] 언어 태그를 나누고 표준 형태로 정리하기 > IT 기술 공유

• 목록

[이번 수업]

ko-KR, en-US 같은 언어 태그를 문자열 자르기로 처리하지 않고 JavaScript의 Intl.Locale로 읽고 정리합니다. 언어·문자 체계·지역을 꺼내고 빠진 정보를 보완하는 방법을 배웁니다.

[선수지식]

문자열과 객체 속성을 알고 Node.js 파일을 실행할 수 있으면 됩니다. 언어 태그는 콘텐츠의 언어와 필요하면 문자 체계, 지역, 변형을 하이픈으로 연결해 식별하는 값입니다.

[학습목표]

1. Intl.Locale로 언어 태그를 표준 대소문자 형태로 정리할 수 있습니다.
2. language, script, region, baseName을 구분할 수 있습니다.
3. maximize()의 추정값과 실제 사용자 정보를 혼동하지 않을 수 있습니다.

[핵심개념]

Intl.Locale 생성자는 Unicode 로케일 식별자를 객체로 표현합니다. `new Intl.Locale('ko-kr')`처럼 대소문자가 섞인 입력도 toString()에서 `ko-KR`로 정리됩니다. language는 기본 언어, script는 문자 체계, region은 지역을 나타내며 빠진 부분은 undefined일 수 있습니다. baseName은 `-u-`로 시작하는 설정 확장을 제외한 기본 태그입니다. `-u-` 확장이 붙어도 baseName에는 기본 태그만 남습니다.

maximize()는 CLDR의 likely subtags, 즉 가능성이 높은 하위 태그 데이터를 이용해 빠진 언어·문자 체계·지역을 채웁니다. ko-KR은 보통 ko-Kore-KR이 됩니다. minimize()는 maximize 결과가 같게 유지되는 범위에서 생략 가능한 부분을 뺍니다. 이 값은 편리한 기본 추정일 뿐 사용자의 실제 위치, 국적, 선호 언어를 확인한 결과가 아닙니다. likely subtags 데이터는 버전에 따라 바뀔 수 있습니다.

[따라하기]

아래를 locale-parts.js로 저장합니다.

```javascript
const locale = new Intl.Locale('ko-kr');
const preferences = new Intl.Locale('en-US-u-hc-h23-nu-latn');

console.log(locale.toString());
console.log(locale.language, locale.script ?? '(없음)', locale.region);
console.log(locale.maximize().toString());
console.log(locale.maximize().minimize().toString());
console.log(preferences.baseName);
console.log(preferences.hourCycle, preferences.numberingSystem);
```

`node locale-parts.js`를 실행합니다. 예상 결과는 `ko-KR`, `ko (없음) KR`, `ko-Kore-KR`, `ko`, `en-US`, `h23 latn` 순서입니다. Windows PowerShell·명령 프롬프트, macOS 터미널, Linux 셸에서 명령은 같습니다. Node.js와 ICU·CLDR 데이터 버전에 따라 maximize 결과나 지원 기능이 달라질 수 있어 배포 환경에서도 확인해야 합니다.

[흔한 실수]

`tag.split('-')`로 두 번째 조각을 항상 지역이라고 생각하면 zh-Hant-TW처럼 문자 체계가 포함된 태그를 잘못 읽습니다. BCP 47 태그는 밑줄이 아니라 하이픈을 사용하므로 ko_KR은 RangeError가 날 수 있습니다. maximize()가 추가한 지역을 사용자가 제공한 사실로 저장하지 마세요. 표준 형태로 정리한 태그가 애플리케이션에서 지원하는 언어라는 뜻도 아닙니다.

[보안 주의]

URL, 쿠키, 요청 헤더에서 받은 태그는 길이를 제한하고 try/catch로 RangeError를 처리한 뒤 지원 로케일 허용 목록과 대조합니다. 언어 태그를 파일 경로나 번역 파일명에 직접 이어 붙이지 말고 허용된 내부 키로 변환하세요. maximize()로 추정한 지역을 접근 제한, 법률 적용, 가격, 세금 판단에 사용하면 안 됩니다. 사용자가 명시한 설정과 검증된 업무 데이터를 따로 보관합니다. 화면에 태그를 출력할 때는 일반 텍스트로 렌더링합니다. 실습은 본인 소유의 로컬 환경에서만 진행합니다.

[직접 해볼 과제]

zh-Hant-TW와 sr-Cyrl-RS를 Intl.Locale로 읽어 language, script, region을 표로 출력하세요. en-Latn-US와 ja-Jpan-JP에 minimize()를 적용해 결과를 비교하세요. 마지막으로 ko_KR과 지나치게 긴 입력을 거부하는 parseLocale 함수를 try/catch와 길이 검사로 작성하세요.

[확인문제]

1. 언어 태그를 하이픈으로 직접 나누면 어떤 태그에서 문제가 생길 수 있나요?
2. maximize()가 추가한 지역을 실제 사용자 위치로 보면 안 되는 이유는 무엇인가요?
3. baseName은 `-u-` 확장이 포함된 전체 태그와 어떻게 다른가요?

[다음 학습]

다음에는 여러 나라의 달력과 시간 표기 방식이 달라도 일정 데이터를 일관되게 표시하는 방법을 다룹니다.

[공식 참고 자료]

ECMA-402 Locale 객체: https://tc39.es/ecma402/#locale-objects
ECMA-402 Intl.Locale 생성자: https://tc39.es/ecma402/#sec-Intl.Locale
RFC 5646 언어 태그: https://www.rfc-editor.org/rfc/rfc5646.html
Unicode LDML 언어·로케일 식별자: https://www.unicode.org/reports/tr35/#Unicode_Language_and_Locale_Identifiers
Node.js 국제화 지원: https://nodejs.org/api/intl.html