Spracherkennung mit integrierter KI

Thomas Steiner

Veröffentlicht: 24. September 2024, zuletzt aktualisiert: 20. Mai 2025

Erklärung	Web	Erweiterungen	Chrome-Status	Absicht
MDN	Chrome 138	Chrome 138	Ansicht	Intent to Ship

Bevor Sie Text von einer Sprache in eine andere übersetzen, müssen Sie zuerst feststellen, welche Sprache im angegebenen Text verwendet wird. Bisher musste der Text für die Übersetzung in einen Cloud-Dienst hochgeladen, die Übersetzung auf dem Server durchgeführt und die Ergebnisse dann heruntergeladen werden.

Die Language Detector API funktioniert clientseitig, sodass Sie die Privatsphäre der Nutzer schützen können. Es ist zwar möglich, eine bestimmte Bibliothek zu versenden, die dies tut, aber dafür wären zusätzliche Ressourcen zum Herunterladen erforderlich.

Wann sollte die Spracherkennung verwendet werden?

Die Language Detector API ist hauptsächlich in den folgenden Szenarien nützlich:

• Die Sprache des eingegebenen Texts erkennen, damit er übersetzt werden kann.
• Die Sprache des eingegebenen Texts wird ermittelt, damit das richtige Modell für sprachspezifische Aufgaben wie die Erkennung von schädlichen Inhalten geladen werden kann.
• Die Sprache des Eingabetexts ermitteln, damit er richtig gekennzeichnet werden kann, z. B. in sozialen Netzwerken.
• Die Sprache des eingegebenen Texts wird ermittelt, damit die Benutzeroberfläche einer App entsprechend angepasst werden kann. So kann beispielsweise auf einer belgischen Website nur die Benutzeroberfläche für Nutzer angezeigt werden, die Französisch sprechen.

Jetzt starten

Die Language Detector API ist ab Chrome 138 (stabile Version) verfügbar. Führen Sie die Funktionserkennung aus, um zu prüfen, ob der Browser die Language Detector API unterstützt.

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

Download des Modells

Die Spracherkennung basiert auf einem Modell, das für die spezifische Aufgabe der Spracherkennung optimiert ist. Die API ist zwar im Browser integriert, das Modell wird jedoch bei der ersten Verwendung der API durch eine Website auf Anfrage heruntergeladen. Im Vergleich zu anderen Modellen ist dieses Modell in Chrome sehr klein. Möglicherweise ist es bereits vorhanden, da dieses Modell von anderen Chrome-Funktionen verwendet wird.

Rufen Sie die asynchrone Funktion LanguageDetector.availability() auf und prüfen Sie das resultierende Promise, um festzustellen, ob das Modell einsatzbereit ist. Es gibt drei mögliche Antworten:

• "unavailable": Die angeforderten Optionen werden nicht unterstützt oder das Modell kann nicht aufgefordert werden.
• "downloadable": Die Anfrage wird unterstützt, aber es sind zusätzliche Downloads erforderlich, bevor Sie eine Sitzung erstellen können. Diese Downloads können das Sprachmodell oder das Fine-Tuning umfassen.
• "downloading": Die Anfrage wird unterstützt und ein Download läuft. Dieser muss abgeschlossen werden, bevor eine Sitzung erstellt werden kann.
• "available": Die Anfrage wird unterstützt und Sie können eine Sitzung erstellen.

Rufen Sie die asynchrone Funktion LanguageDetector.create() auf, um den Download auszulösen und den Spracherkennungsdienst zu instanziieren. Wenn die Antwort auf availability() 'downloadable' oder 'downloading' war, ist es am besten, den Downloadfortschritt zu überwachen, damit Sie den Nutzer informieren können, falls der Download länger dauert.

Im folgenden Beispiel wird gezeigt, wie der Spracherkennungsdienst initialisiert wird.

const availability = await LanguageDetector.availability();

let detector;
if (availability === 'unavailable') {
  // The language detector isn't usable.
  return;
}
if (availability === 'available') {
  // The language detector can immediately be used.
  detector = await LanguageDetector.create();
} else {
  // The language detector can be used after model download.
  detector = await LanguageDetector.create({
    monitor(m) {
      m.addEventListener('downloadprogress', (e) => {
        console.log(`Downloaded ${e.loaded * 100}%`);
      });
    },
  });
  await detector.ready;
}

Spracherkennung ausführen

Die Language Detector API verwendet ein Ranking-Modell, um zu ermitteln, welche Sprache in einem bestimmten Text am wahrscheinlichsten verwendet wird. Ranking ist eine Art von maschinellem Lernen, bei der eine Liste von Elementen sortiert werden soll. In diesem Fall werden die Sprachen von der Language Detector API nach Wahrscheinlichkeit sortiert, von der höchsten zur niedrigsten.

Die Funktion detect() kann entweder das erste Ergebnis, die wahrscheinlichste Antwort, zurückgeben oder die sortierten Kandidaten mit dem Konfidenzniveau durchlaufen. Die Ergebnisse werden als Liste von {detectedLanguage, confidence}-Objekten zurückgegeben. Das confidence-Niveau wird als Wert zwischen 0.0 (niedrigste Zuverlässigkeit) und 1.0 (höchste Zuverlässigkeit) angegeben.

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-Playground

API-Playground Geben Sie Text in verschiedenen Sprachen in das Textfeld ein.

Standardisierungsaufwand

Das Chrome-Team hat Feedback von der W3C Technical Architecture Group angefordert und Mozilla und WebKit um ihre Standardpositionen gebeten.

Feedback geben

Wir möchten gern sehen, was Sie mit der Language Detector API entwickeln. Teilen Sie uns Ihre Websites und Webanwendungen auf X, YouTube und LinkedIn mit.

Wenn Sie Feedback zur Implementierung in Chrome haben, erstellen Sie in Chromium einen Eintrag für das Problem.