Détection de la langue avec l'IA intégrée

AI_USAGE=false

Thomas Steiner

Publié le 24 septembre 2024, dernière mise à jour le 20 mai 2025

Explication	Web	Extensions	État de Chrome	Intention
MDN	Chrome 138	Chrome 138	Afficher	Intention d'expédier

Avant de traduire un texte d'une langue à une autre, vous devez d'abord déterminer la langue utilisée dans le texte donné. Auparavant, la traduction nécessitait d'importer le texte dans un service cloud, d'effectuer la traduction sur le serveur, puis de télécharger les résultats.

L'API Language Detector fonctionne côté client, ce qui signifie que vous pouvez protéger la confidentialité des utilisateurs. Bien qu'il soit possible de fournir une bibliothèque spécifique qui effectue cette opération, cela nécessiterait des ressources supplémentaires pour le téléchargement.

Quand utiliser la détection de la langue

L'API Language Detector est principalement utile dans les scénarios suivants :

• Déterminer la langue du texte d'entrée pour pouvoir le traduire
• Déterminer la langue du texte d'entrée pour charger le modèle approprié pour les tâches spécifiques à la langue, comme la détection de la toxicité.
• Déterminer la langue du texte saisi afin de pouvoir l'étiqueter correctement, par exemple sur les sites de réseaux sociaux en ligne.
• Déterminer la langue du texte saisi pour que l'interface d'une application puisse être ajustée en conséquence. Par exemple, sur un site belge, vous pouvez choisir de n'afficher que l'interface destinée aux utilisateurs francophones.

Commencer

L'API Language Detector est disponible à partir de la version stable de Chrome 138. Exécutez la détection de fonctionnalités pour voir si le navigateur est compatible avec l'API Language Detector.

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

Téléchargement de modèles

La détection de la langue dépend d'un modèle optimisé pour la tâche spécifique de détection des langues. Bien que l'API soit intégrée au navigateur, le modèle est téléchargé à la demande la première fois qu'un site tente d'utiliser l'API. Dans Chrome, ce modèle est très petit par rapport aux autres modèles. Il est peut-être déjà présent, car ce modèle est utilisé par d'autres fonctionnalités Chrome.

Pour déterminer si le modèle est prêt à être utilisé, appelez la fonction asynchrone LanguageDetector.availability(). Si la réponse à availability() est downloadable, écoutez la progression du téléchargement et informez l'utilisateur, car le téléchargement peut prendre du temps.

const availability = await LanguageDetector.availability();

Pour déclencher le téléchargement et instancier le détecteur de langue, recherchez l'activation de l'utilisateur. Appelez ensuite la fonction asynchrone LanguageDetector.create().

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

Exécuter le détecteur de langue

L'API Language Detector utilise un modèle de classement pour déterminer la langue la plus susceptible d'être utilisée dans un texte donné. Le classement est un type de machine learning dont l'objectif est d'ordonner une liste d'éléments. Dans ce cas, l'API Language Detector classe les langues de la probabilité la plus élevée à la plus faible.

La fonction detect() peut renvoyer le premier résultat, la réponse la plus probable ou itérer sur les candidats classés avec le niveau de confiance. Elle est renvoyée sous la forme d'une liste d'objets {detectedLanguage, confidence}. Le niveau confidence est exprimé sous la forme d'une valeur comprise entre 0.0 (confiance la plus faible) et 1.0 (confiance la plus élevée).

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
// ...

Bac à sable de l'API

Testez l'API Language Detector dans notre bac à sable d'API. Saisissez du texte écrit dans différentes langues dans la zone de texte.

Règles sur les autorisations, iFrames et Web Workers

Par défaut, l'API Language Detector n'est disponible que pour les fenêtres de premier niveau et leurs iframes de même origine. L'accès à l'API peut être délégué aux iFrames multi-origine à l'aide de l'attribut allow="" de la règle d'autorisation :

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

L'API Language Detector n'est pas disponible dans les Web Workers pour le moment, en raison de la complexité de l'établissement d'un document responsable pour chaque worker afin de vérifier l'état de la règle relative aux autorisations.

Effort de standardisation

Nous nous efforçons de standardiser l'API Language Detector pour la rendre compatible avec tous les navigateurs.

Les API Language Detector et Translator ont été adoptées par le groupe de travail W3C WebML. Nous avons demandé à Mozilla et WebKit de nous faire part de leur position sur les normes.

Envoyer des commentaires

Nous voulons découvrir ce que vous créez avec l'API Language Detector. Partagez vos sites Web et applications Web avec nous sur X, YouTube et LinkedIn.

Si vous avez des commentaires sur l'implémentation de Chrome, signalez un bug Chromium.