내장 AI를 통한 언어 감지

Thomas Steiner

게시일: 2024년 9월 24일, 최종 업데이트: 2025년 5월 20일

텍스트를 한 언어에서 다른 언어로 번역하기 전에 먼저 지정된 텍스트에 사용된 언어를 확인해야 합니다. 이전에는 번역을 위해 텍스트를 클라우드 서비스에 업로드하고 서버에서 번역을 실행한 다음 결과를 다운로드해야 했습니다.

Language Detector API는 클라이언트 측에서 작동하므로 사용자 개인 정보를 보호할 수 있습니다. 이 작업을 실행하는 특정 라이브러리를 제공할 수는 있지만 다운로드하려면 추가 리소스가 필요합니다.

언어 감지를 사용해야 하는 경우

Language Detector API는 주로 다음과 같은 시나리오에서 유용합니다.

• 번역할 수 있도록 입력 텍스트의 언어를 확인합니다.
• 유해성 감지와 같은 언어별 태스크에 올바른 모델을 로드할 수 있도록 입력 텍스트의 언어를 확인합니다.
• 온라인 소셜 네트워킹 사이트와 같이 올바르게 라벨을 지정할 수 있도록 입력 텍스트의 언어를 확인합니다.
• 앱의 인터페이스를 적절하게 조정할 수 있도록 입력 텍스트의 언어를 확인합니다. 예를 들어 벨기에 사이트에서 프랑스어를 사용하는 사용자와 관련된 인터페이스만 표시합니다.

시작하기

Language Detector 및 Translator API 는 데스크톱의 Chrome에서 작동합니다. 이러한 API는 휴대기기에서 작동하지 않습니다.

기능 감지를 실행하여 브라우저에서 Language Detector API를 지원하는지 확인합니다.

if ('LanguageDetector' in self) {
  // The Language Detector API is available.
}

모델 다운로드

언어 감지는 언어 감지라는 특정 태스크에 맞게 미세 조정된 모델에 따라 달라집니다. API는 브라우저에 기본 제공되지만 모델은 사이트에서 API를 처음 사용하려고 할 때 주문형으로 다운로드됩니다. Chrome에서 이 모델은 다른 모델에 비해 매우 작습니다. 이 모델은 다른 Chrome 기능에서 사용되므로 이미 존재할 수 있습니다.

모델을 사용할 준비가 되었는지 확인하려면 비동기 LanguageDetector.availability() 함수를 호출합니다. availability()에 대한 응답이 downloadable인 경우 다운로드에 시간이 걸릴 수 있으므로 다운로드 진행률을 수신 대기하고 사용자에게 알립니다.

다운로드를 트리거하고 언어 감지기를 인스턴스화하려면 사용자 활성화를 확인합니다. 그런 다음 비동기 LanguageDetector.create() 함수를 호출합니다.

const detector = await LanguageDetector.create({
  monitor(m) {
    m.addEventListener('downloadprogress', (e) => {
      console.log(`Downloaded ${e.loaded * 100}%`);
    });
  },
});

언어 감지기 실행

Language Detector API는 순위 모델을 사용하여 지정된 텍스트에서 가장 많이 사용되는 언어를 결정합니다. 순위 는 항목 목록을 정렬하는 것을 목표로 하는 머신러닝 유형입니다. 이 경우 Language Detector API는 언어의 확률을 가장 높은 것부터 가장 낮은 것까지 순위를 지정합니다.

detect() 함수는 첫 번째 결과인 가장 가능성이 높은 답변을 반환하거나 신뢰도 수준으로 순위가 지정된 후보를 반복할 수 있습니다. 이는 {detectedLanguage, confidence} 객체 목록으로 반환됩니다. confidence 수준은 0.0 (최저 신뢰도)과 1.0 (최고 신뢰도) 사이의 값으로 표현됩니다.

const someUserText = 'Hallo und herzlich willkommen!';
const results = await detector.detect(someUserText);
for (const result of results) {
  // Show the full list of potential languages with their likelihood, ranked
  // from most likely to least likely. In practice, one would pick the top
  // language(s) that cross a high enough threshold.
  console.log(result.detectedLanguage, result.confidence);
}
// (Output truncated):
// de 0.9993835687637329
// en 0.00038279531872831285
// nl 0.00010798392031574622
// ...

API 플레이그라운드

API 플레이그라운드에서 Language Detector API를 실험해 보세요. 텍스트 영역에 여러 언어로 작성된 텍스트를 입력합니다.

권한 정책, iframe, 웹 워커

기본적으로 Language Detector API는 최상위 창과 동일한 출처 iframe에서만 사용할 수 있습니다. 권한 정책 allow="" 속성을 사용하여 교차 출처 iframe 에 API 액세스 권한을 위임할 수 있습니다.

<!--
  The hosting site at https://main.example.com can grant a cross-origin iframe
  at https://cross-origin.example.com/ access to the Language Detector API by
  setting the `allow="language-detector"` attribute.
-->
<iframe src="https://cross-origin.example.com/" allow="language-detector"></iframe>

Language Detector API는 웹 워커에서 사용할 수 없습니다. 이는 권한 정책 상태를 확인하기 위해 각 워커에 대한 책임 있는 문서를 설정하는 것이 복잡하기 때문입니다.

의견 공유

Language Detector API로 무엇을 빌드하고 있는지 알고 싶습니다. X, YouTube, and LinkedIn에서 웹사이트와 웹 애플리케이션을 공유해 주세요.

Chrome 구현에 관한 의견이 있으면 Chromium 버그를 신고해 주세요.

새로운 기본 제공 AI API를 미리 살펴보고 메일링 리스트에서 토론에 참여하려면 프리뷰 프로그램에 가입하세요.