Description: |
chrome.i18n 인프라를 사용하여 전체 앱 또는 확장 프로그램에서 국제화를 구현하세요. |
Availability: |
Chrome 38부터. |
Content Scripts: |
완전히 지원됩니다. 더 알아보기 |
사용자가 볼 수 있는 모든 문자열을 messages.json이라는 파일에 넣어야 합니다. 새 로케일을 추가 할 때마다 _locales / localeCode라는 디렉토리 아래에 메시지 파일을 추가합니다. 여기서 localeCode는 영어의 경우 en과 같은 코드입니다.
다음은 영어 (en), 스페인어 (es) 및 한국어 (ko)를 지원하는 국제화 된 확장자에 대한 파일 계층 구조입니다.
다국어 지원 방법
다음 그림에 표시된 파일의 확장자가 있다고 가정합니다.
이 확장을 국제화 하려면 사용자에게 표시되는 각 문자열의 이름을 지정하고 메시지 파일에 넣습니다. 확장 프로그램의 매니페스트, CSS 파일 및 JavaScript 코드는 각 문자열의 이름을 사용하여 현지화 된 버전을 가져옵니다.
다음은 국제화 되었을 때 확장 프로그램의 모습입니다 (여전히 영어 문자열 만 있음).
중요 : 확장에 _locales 디렉토리가 있는 경우 매니페스트는 "default_locale"을 정의해야 합니다.
국제화에 대한 몇 가지 참고 사항 :
__MSG_messagename__
chrome.i18n.getMessage("messagename")
{ "search_string": { "message": "hello%20world", "description": "The string we search for. Put %20 between words that go together." }, ... }
자세한 내용은 형식 : 로케일 별 메시지를 참조하십시오.
확장 프로그램 또는 앱이 국제화 되면 간단하게 번역 할 수 있습니다. messages.json을 복사하고 번역 한 다음 _locales 아래의 새 디렉토리에 복사합니다. 예를 들어 스페인어를 지원하려면 _locales / es 아래에 messages.json의 번역 된 사본을 넣으십시오. 다음 그림은 새 스페인어 번역이 포함 된 이전 확장을 보여줍니다.
미리 정의 된 메시지
국제화 시스템은 현지화에 도움이 되는 몇 가지 미리 정의 된 메시지를 제공합니다. 여기에는 @@ ui_locale이 포함되어 있으므로 현재 UI 로케일을 감지 할 수 있으며 텍스트 방향을 감지 할 수 있는 몇 가지 @@ bidi _... 메시지가 있습니다. 후자의 메시지는 가젯 BIDI (양방향) API의 상수와 유사한 이름을 갖습니다.
확장 또는 앱이 현지화 되었는지 여부에 관계없이 특수 메시지 @@ extension_id는 CSS 및 JavaScript 파일에서 사용할 수 있습니다. 이 메시지는 매니페스트 파일에서 작동하지 않습니다.
다음 표는 미리 정의 된 각 메시지를 설명합니다.
Message name |
Description |
@@extension_id |
확장 또는 앱 ID 이 문자열을 사용하여 확장 내의 리소스에 대한 URL을 구성 할 수 있습니다. 현지화 되지 않은 확장도 이 메시지를 사용할 수 있습니다. 참고 : 매니페스트 파일에서는 이 메시지를 사용할 수 없습니다. |
@@ui_locale |
현재 로케일. 이 문자열을 사용하여 로케일 별 URL을 구성 할 수 있습니다. |
@@bidi_dir |
현재 로케일의 텍스트 방향으로, 영어와 같은 왼쪽에서 오른쪽 언어의 경우 "ltr", 일본어와 같은 오른쪽에서 왼쪽의 언어의 경우 "rtl"입니다. |
@@bidi_reversed_dir |
@@ bidi_dir이 "ltr"이면 "rtl"입니다. 그렇지 않으면 "ltr"입니다. |
@@bidi_start_edge |
@@ bidi_dir이 "ltr"이면 "왼쪽"입니다. 그렇지 않으면 "맞습니다". |
@@bidi_end_edge |
@@ bidi_dir이 "ltr"이면 "맞습니다"입니다. 그렇지 않으면 "왼쪽"입니다. |
다음은 CSS 파일에서 @@ extension_id를 사용하여 URL을 구성하는 예입니다.
body { background-image:url('chrome-extension://__MSG_@@extension_id__/background.png'); }
확장 ID가 abcdefghijklmnopqrstuvwxyzabcdef 인 경우 이전 코드 조각에서 굵은 줄은 다음과 같습니다.
background-image:url('chrome-extension://abcdefghijklmnopqrstuvwxyzabcdef/background.png');
다음은 CSS 파일에서 @@ bidi_ * 메시지를 사용하는 예입니다.
body { direction: __MSG_@@bidi_dir__; } div#header { margin-bottom: 1.05em; overflow: hidden; padding-bottom: 1.5em; padding-__MSG_@@bidi_start_edge__: 0; padding-__MSG_@@bidi_end_edge__: 1.5em; position: relative; }
영어와 같은 왼쪽에서 오른쪽으로 쓰는 언어의 경우 굵은 선은 다음과 같습니다.
dir: ltr; padding-left: 0; padding-right: 1.5em;
Locales
단일 번역이 여러 언어 변형 (예 : en_GB 및 en_US)을 지원할 수 있는 일부 (예 : en)를 포함하여 여러 로케일에서 선택할 수 있습니다.
지원되는 로케일
Chrome 웹 스토어에서 지원하는 모든 로케일을 사용할 수 있습니다.
메시지 검색
지원되는 모든 로케일에 대해 모든 문자열을 정의 할 필요는 없습니다. 기본 로케일의 messages.json 파일에 모든 문자열에 대한 값이 있는 한 확장 또는 앱은 번역이 얼마나 드문 지에 관계없이 실행됩니다. 확장 시스템이 메시지를 검색하는 방법은 다음과 같습니다.
다음 그림에서 "colores"라는 메시지는 확장이 지원하는 세 로케일 모두에 있지만 "extName"은 두 로케일에만 있습니다. 미국 영어로 Google 크롬을 실행하는 사용자에게 "색상"이라는 레이블이 표시 될 때마다 영국 영어 사용자에게는 "색상"이 표시됩니다. 미국 영어와 영국 영어 사용자 모두 "Hello World"라는 확장명을 볼 수 있습니다. 기본 언어가 스페인어이기 때문에 영어가 아닌 언어로 Chrome을 실행하는 사용자에게는 "Colores"라는 레이블과 "Hola mundo"확장명이 표시됩니다.
브라우저의 로케일을 설정하는 방법
번역을 테스트하기 위해 브라우저의 로케일을 설정할 수 있습니다. 이 섹션에서는 Windows, Mac OS X, Linux 및 Chrome OS에서 로케일을 설정하는 방법을 설명합니다.
Windows
로케일 별 바로 가기 또는 Google Chrome UI를 사용하여 로케일을 변경할 수 있습니다. 바로 가기 접근 방식은 일단 설정하면 더 빠르며 한 번에 여러 언어를 사용할 수 있습니다.
로케일 별 단축키 사용
특정 로케일로 Google 크롬을 실행하는 바로 가기를 만들고 사용하려면 :
path_to_chrome.exe --lang=locale --user-data-dir=c:\locale_profile_dir
예를 들어 스페인어 (es)로 Google Chrome을 시작하는 바로 가기를 만들려면 다음 대상이 있는 chrome-es라는 바로 가기를 만들 수 있습니다.
path_to_chrome.exe --lang=es --user-data-dir=c:\chrome-profile-es
원하는 만큼 바로 가기를 만들 수 있으므로 여러 언어로 쉽게 테스트 할 수 있습니다. 예를 들면 :
path_to_chrome.exe --lang=en --user-data-dir=c:\chrome-profile-en path_to_chrome.exe --lang=en_GB --user-data-dir=c:\chrome-profile-en_GB path_to_chrome.exe --lang=ko --user-data-dir=c:\chrome-profile-ko
참고 : --user-data-dir 지정은 선택 사항이지만 편리합니다. 로케일 당 하나의 데이터 디렉토리를 사용하면 동시에 여러 언어로 브라우저를 실행할 수 있습니다. 단점은 로케일의 데이터가 공유되지 않기 때문에 확장 프로그램을 여러 번 설치해야 한다는 것입니다. 로케일 당 한 번은 언어를 사용하지 않을 때 어려울 수 있습니다. 자세한 내용은 프로필 생성 및 사용을 참조하십시오.
UI 사용
Windows 용 Chrome에서 UI를 사용하여 로케일을 변경하는 방법은 다음과 같습니다.
Mac OS X
Mac에서 로케일을 변경하려면 시스템 환경 설정을 사용하십시오.
Linux
Linux에서 로케일을 변경하려면 먼저 Chrome을 종료하십시오. 그런 다음 모두 한 줄에 LANGUAGE 환경 변수를 설정하고 Google Chrome을 시작하십시오. 예를 들면 :
LANGUAGE=es ./chrome
Chrome OS
Chrome OS에서 로케일을 변경하려면 :
예
examples / api / i18n 디렉토리에서 국제화의 간단한 예를 찾을 수 있습니다. 완전한 예는 examples / extensions / news를 참조하십시오. 다른 예제와 소스 코드보기에 대한 도움말은 샘플을 참조하십시오.
예 : getMessage
다음 코드는 브라우저에서 현지화 된 메시지를 가져 와서 문자열로 표시합니다. 메시지 내의 두 자리 표시자를 "string1"및 "string2"문자열로 바꿉니다.
function getMessage() { var message = chrome.i18n.getMessage("click_here", ["string1", "string2"]); document.getElementById("languageSpan").innerHTML = message; }
단일 문자열을 제공하고 사용하는 방법은 다음과 같습니다.
// In JavaScript code status.innerText = chrome.i18n.getMessage("error", errorDetails);
"error": { "message": "Error: $details$", "description": "Generic error template. Expects error parameter to be passed in.", "placeholders": { "details": { "content": "$1", "example": "Failed to fetch RSS feed." } } }
자리 표시 자에 대한 자세한 내용은 로캘 별 메시지 페이지를 참조하십시오. getMessage() 호출에 대한 자세한 내용은 API 참조를 참조하세요.
예 : getAcceptLanguages
다음 코드는 브라우저에서 accept-language를 가져 와서 각 accept-language를 ','로 구분하여 문자열로 표시합니다.
function getAcceptLanguages() { chrome.i18n.getAcceptLanguages(function(languageList) { var languages = languageList.join(","); document.getElementById("languageSpan").innerHTML = languages; }) }
getAcceptLanguages() 호출에 대한 자세한 내용은 API 참조를 참조하세요.
예 : detectLanguage
다음 코드는 주어진 문자열에서 최대 3 개의 언어를 감지하고 결과를 새 줄로 구분 된 문자열로 표시합니다.
function detectLanguage(inputText) { chrome.i18n.detectLanguage(inputText, function(result) { var outputLang = "Detected Language: "; var outputPercent = "Language Percentage: "; for(i = 0; i < result.languages.length; i++) { outputLang += result.languages[i].language + " "; outputPercent +=result.languages[i].percentage + " "; } document.getElementById("languageSpan").innerHTML = outputLang + "\n" + outputPercent + "\nReliable: " + result.isReliable; }); }
detectLanguage (inputText) 호출에 대한 자세한 내용은 API 참조를 참조하세요.
요약
Types |
Methods |
getAcceptLanguages − chrome.i18n.getAcceptLanguages (함수 콜백) |
getMessage − string chrome.i18n.getMessage (string messageName, 대체 항목, 객체 옵션) |
getUILanguage − string chrome.i18n.getUILanguage() |
detectLanguage − chrome.i18n.detectLanguage(string text, function callback) |
Types
LanguageCode
Since Chrome 47.
string
en 또는 fr과 같은 ISO 언어 코드. 이 메서드에서 지원하는 전체 언어 목록은 kLanguageInfoTable을 참조하세요.
알 수 없는 언어의 경우 und가 반환됩니다. 이는 텍스트의 [백분율]을 CLD가 알 수 없음을 의미합니다.
Methods
getAcceptLanguages
chrome.i18n.getAcceptLanguages(function callback)
브라우저의 허용 언어를 가져옵니다. 이것은 브라우저에서 사용하는 로케일과 다릅니다. 로케일을 얻으려면 i18n.getUILanguage를 사용하십시오.
Parameters |
|||||
function |
callback |
콜백 매개 변수는 다음과 같은 함수 여야 합니다.
|
getMessage
string chrome.i18n.getMessage(string messageName, any substitutions, object options)
지정된 메시지의 지역화 된 문자열을 가져옵니다. 메시지가 누락 된 경우 이 메서드는 빈 문자열 ( '')을 반환합니다. getMessage() 호출의 형식이 잘못된 경우 (예 : messageName이 문자열이 아니거나 대체 배열에 9 개 이상의 요소가 있는 경우)이 메서드는 undefined를 반환합니다.
Parameters |
|||||
string |
messageName |
messages.json 파일에 지정된 메시지 이름입니다. |
|||
any |
(optional) substitutions |
메시지에 필요한 경우 최대 9 개의 대체 문자열. |
|||
object |
(optional) options |
Since Chrome 79.
|
getUILanguage
string chrome.i18n.getUILanguage()
브라우저의 브라우저 UI 언어를 가져옵니다. 이것은 선호하는 사용자 언어를 반환하는 i18n.getAcceptLanguages와 다릅니다.
detectLanguage
chrome.i18n.detectLanguage(string text, function callback)
Since Chrome 47.
CLD를 사용하여 제공된 텍스트의 언어를 감지합니다.
Parameters |
|||||||||||||||||
string |
text |
번역할 사용자 입력 문자열입니다. |
|||||||||||||||
function |
callback |
콜백 매개 변수는 다음과 같은 함수 여야 합니다. function(object result) {...};
|
https://developer.chrome.com/extensions/i18n
등록된 댓글이 없습니다.