Guide sur l'intégration de texte pour le Web

La tâche MediaPipe Text Embedder vous permet de créer une représentation numérique des données textuelles pour capturer leur signification sémantique. Ces instructions vous expliquent comment utiliser l'outil Text Embedder pour les applications Web et JavaScript.

Pour en savoir plus sur les fonctionnalités, les modèles et les options de configuration de cette tâche, consultez la présentation.

Exemple de code

L'exemple de code pour Text Embedder fournit une implémentation complète de cette tâche en JavaScript à titre de référence. Ce code vous aide à tester cette tâche et à commencer à créer votre propre application d'embedding de texte. Vous pouvez afficher, exécuter et modifier l'exemple d'outil d'embedding de texte à l'aide de votre navigateur Web.

Configuration

Cette section décrit les étapes clés pour configurer votre environnement de développement et vos projets de code afin d'utiliser Text Embedder. Pour obtenir des informations générales sur la configuration de votre environnement de développement pour utiliser les tâches MediaPipe, y compris les exigences concernant la version de la plate-forme, consultez le guide de configuration pour le Web.

Packages JavaScript

Le code Text Embedder est disponible dans le package @mediapipe/tasks-text. Vous pouvez trouver et télécharger ces bibliothèques à partir des liens fournis dans le guide de configuration de la plate-forme.

Vous pouvez installer les packages requis avec le code suivant pour la préparation locale à l'aide de la commande suivante :

npm install @mediapipe/tasks-text

Si vous souhaitez déployer le code sur un serveur, vous pouvez utiliser un service de réseau de diffusion de contenu (CDN, Content Delivery Network), tel que jsDelivr, pour ajouter le code directement à votre page HTML, comme suit :

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-text@latest/index.js"
    crossorigin="anonymous"></script>
</head>

Modèle

La tâche MediaPipe Text Embedder nécessite un modèle entraîné compatible avec cette tâche. Pour en savoir plus sur les modèles entraînés disponibles pour Text Embedder, consultez la section Modèles de la présentation des tâches.

Sélectionnez et téléchargez un modèle, puis stockez-le dans le répertoire de votre projet :

<dev-project-root>/app/shared/models

Créer la tâche

Utilisez l'une des fonctions createFrom...() Text Embedder pour préparer la tâche à exécuter des inférences. Vous pouvez utiliser la fonction createFromModelPath() avec un chemin d'accès relatif ou absolu au fichier de modèle entraîné. L'exemple de code ci-dessous montre comment utiliser la fonction createFromOptions(). Pour en savoir plus sur les options de configuration disponibles, consultez Options de configuration.

Le code suivant montre comment créer et configurer cette tâche :

async function createEmbedder() {
  const textFiles = await FilesetResolver.forTextTasks("https://cdn.jsdelivr.net/npm/@mediapipe/tasks-text@latest/wasm/");
  textEmbedder = await TextEmbedder.createFromOptions(
    textFiles,
    {
      baseOptions: {
        modelAssetPath: `https://storage.googleapis.com/mediapipe-tasks/text_embedder/universal_sentence_encoder.tflite`
      },
      quantize: true
    }
  );
}
createEmbedder();

Options de configuration

Cette tâche comporte les options de configuration suivantes pour les applications Web et JavaScript :

Nom de l'option Description Plage de valeurs Valeur par défaut
l2Normalize Indique si le vecteur de caractéristiques renvoyé doit être normalisé avec la norme L2. Utilisez cette option uniquement si le modèle ne contient pas déjà une opération TFLite L2_NORMALIZATION native. Dans la plupart des cas, c'est déjà le cas et la normalisation L2 est donc obtenue par inférence TFLite sans avoir besoin de cette option. Boolean False
quantize Indique si l'embedding renvoyé doit être quantifié en octets à l'aide de la quantification scalaire. Les embeddings sont implicitement supposés être de norme unitaire. Par conséquent, chaque dimension est garantie d'avoir une valeur comprise entre -1,0 et 1,0. Utilisez l'option l2Normalize si ce n'est pas le cas. Boolean False

Préparer les données

Text Embedder fonctionne avec les données textuelles (string). La tâche gère le prétraitement des données d'entrée, y compris la tokenisation et le prétraitement des tenseurs. Tout le prétraitement est géré dans la fonction embed. Il n'est pas nécessaire de prétraiter le texte saisi.

const inputText = "The input text to be embedded.";

Exécuter la tâche

L'outil d'embedding de texte utilise la fonction embed pour déclencher des inférences. Pour l'embedding de texte, cela signifie renvoyer les vecteurs d'embedding pour le texte d'entrée.

Le code suivant montre comment exécuter le traitement avec le modèle de tâche.

// Wait to run the function until inner text is set
const embeddingResult = textEmbedder.embed(
  inputText
);

Gérer et afficher les résultats

L'outil d'embedding de texte génère un TextEmbedderResult contenant une liste d'embeddings (à virgule flottante ou quantifiés scalaires) pour le texte d'entrée.

Voici un exemple des données de sortie de cette tâche :

TextEmbedderResult:
  Embedding #0 (sole embedding head):
    float_embedding: {0.2345f, 0.1234f, ..., 0.6789f}
    head_index: 0

Vous pouvez comparer la similarité sémantique de deux embeddings à l'aide de la fonction TextEmbedder.cosineSimilarity. Consultez l'exemple de code suivant.

// Compute cosine similarity.
const similarity = TextEmbedder.cosineSimilarity(
  embeddingResult.embeddings[0],
  otherEmbeddingResult.embeddings[0]);

L'exemple de code Text Embedder montre comment afficher les résultats de l'embedder renvoyés par la tâche. Pour en savoir plus, consultez l'exemple.