외부 javascript 파일에 다국어 적용하기(i18n.properties 사용)
1. 개요
- 글로벌 서비스를 진행하는 웹 페이지의 경우 다국어를 적용해야한다.
- 그러나 모든 처리를 서버 사이드에서 진행하기에는 굉장히 부담이 크다.
- 특히나 외부 javascript 파일의 경우 더욱 골치가 아프다.
- 그래서 간단히 사용할 수 있는 자바스크립트 모듈 “i18n”을 소개하려고 한다.
- Github URL : https://github.com/jquery-i18n-properties/jquery-i18n-properties
2. 간단한 설명
- 기본 jquery lib는 무조건 import해야함.
- jquery-i18n-properties에서 .js 파일을 다운로드함
- 소스에 추가
- 소스 사용은 아래 Example을 참고하시기를
- i18n 명칭이 약간 이상해서 검색해봄
- 국제화는 때로 줄여서 그저 “I18N”이라고도 표기하는데, 그 의미는 이 용어의 영어 표기에서 첫 글자인 “I”자와 마지막 글자인 “N”의 사이에 18글자가 들어가 있다는 의미이다.
- 출처 : http://www.terms.co.kr/internationalization.html
-
아래는 github README.md 내에 포함된 자료를 복사 붙여넣기 한거다.
- Messages.properties: # This line is ignored by the plugin
msghello = Hello msgworld = World msg_complex = Good morning {0}! - Messages_pt.properties:
# We only provide a translation for the 'msg_hello' key
msg_hello = Bom dia
- MessagesptPT.properties:
#We only provide a translation for the 'msg_hello' key
msg_hello = Olá
- Now, suppose these files are located on the bundle/ folder. One can invoke the plugin like below:
$.i18n.properties({
name:'Messages',
path:'bundle/',
mode:'both',
language:'pt_PT',
callback: function() {
// We specified mode: 'both' so translated values will be
// available as JS vars/functions and as a map
// Accessing a simple value through the map
jQuery.i18n.prop('msg_hello');
// Accessing a value with placeholders through the map
jQuery.i18n.prop('msg_complex', 'John');
// Accessing a simple value through a JS variable
alert(msg_hello +' '+ msg_world);
// Accessing a value with placeholders through a JS function
alert(msg_complex('John'));
}
});