Blog
Point de vue

Comment utiliser le SDK Google Gen AI TypeScript/JavaScript pour créer des applications d'IA générative puissantes

L'IA évolue vite. Google, avec Gemini, est en tête. Le SDK Gen AI offre aux devs TS/JS une solution flexible pour exploiter Gemini 2.5 et plus.

Louis Dupont

Louis Dupont

5 June 2025

Comment utiliser le SDK Google Gen AI TypeScript/JavaScript pour créer des applications d'IA générative puissantes

Le monde de l'Intelligence Artificielle évolue rapidement, et Google est à l'avant-garde avec ses puissants modèles Gemini. Pour les développeurs TypeScript et JavaScript qui cherchent à exploiter cette puissance, le Google Gen AI SDK fournit une solution complète et flexible. Ce SDK vous permet de créer facilement des applications alimentées par Gemini 2.5 et d'autres modèles de pointe, offrant un support robuste pour l'API Gemini Developer et Vertex AI. Cet article sera votre guide pour comprendre et utiliser ce SDK, couvrant ses principales fonctionnalités, des interactions en direct et en temps réel au traitement de contenu multimodal, en passant par la synthèse vocale (TTS), la génération d'images, et plus encore.

💡
Vous voulez un excellent outil de test d'API qui génère de belles documents d'API ?

Vous voulez une plateforme intégrée, tout-en-un, pour que votre équipe de développeurs travaille ensemble avec une productivité maximale ?

Apidog répond à toutes vos demandes et remplace Postman à un prix beaucoup plus abordable !
button

Introduction : Relier JavaScript et la puissance de Gemini

Le Google Gen AI JavaScript SDK est méticuleusement conçu pour permettre aux développeurs d'intégrer les capacités d'IA générative avancées de Google dans leurs applications web et Node.js. Que vous construisiez un chatbot sophistiqué, un outil de création de contenu intelligent ou une application qui comprend et génère divers types de médias, ce SDK fournit les blocs de construction nécessaires.

Une force essentielle du SDK est son approche unifiée pour accéder aux modèles Gemini, qu'ils soient hébergés sur la plateforme Gemini Developer (via des clés API de Google AI Studio) ou sur la plateforme Vertex AI de Google Cloud. Cette flexibilité permet aux développeurs de choisir l'environnement qui convient le mieux aux besoins de leur projet, du prototypage rapide avec une clé API aux déploiements de qualité production sur Vertex AI avec ses capacités MLOps.

Le SDK est conçu pour fonctionner de manière transparente avec les dernières fonctionnalités de Gemini, y compris les modèles Gemini 2.5 très attendus, garantissant aux développeurs un accès à l'IA de pointe dès qu'elle est disponible.

Premiers pas : Installation et initialisation

Avant de plonger dans les fonctionnalités avancées, couvrons les bases de la configuration du SDK.

Prérequis :
Assurez-vous d'avoir Node.js version 18 ou ultérieure installée dans votre environnement de développement.

Installation :
L'installation du SDK est simple en utilisant npm :

npm install @google/genai

Initialisation - Votre passerelle vers Gemini :
Toutes les interactions avec l'API Gemini, que ce soit via Google AI Studio ou Vertex AI, commencent par l'instanciation de la classe GoogleGenAI.

1. Utilisation de l'API Gemini Developer (avec une clé API) :
C'est souvent le moyen le plus rapide de commencer, en particulier pour les applications côté serveur ou les projets personnels. Vous aurez besoin d'une clé API de Google AI Studio.

import { GoogleGenAI } from '@google/genai';

const GEMINI_API_KEY = process.env.GEMINI_API_KEY; // Or your actual API key
const ai = new GoogleGenAI({ apiKey: GEMINI_API_KEY });

async function run() {
  // Example: Generate text content
  const model = ai.models.generateContent({
    model: "gemini-pro", // Or a specific Gemini 2.5 model like "gemini-2.5-flash-001"
    contents: [{ role: "user", parts: [{ text: "Explain the significance of the Google Gen AI SDK." }] }]
  });
  const response = await model;
  console.log(response.text);
}

run();
Attention à la sécurité de la clé API :

2. Utilisation de Vertex AI :
Pour les applications nécessitant la robustesse et l'évolutivité de Google Cloud, l'initialisation du SDK pour Vertex AI est la solution. Cela implique de spécifier votre ID de projet Google Cloud et votre emplacement.

import { GoogleGenAI } from '@google/genai';

const ai = new GoogleGenAI({
    vertexai: true,
    project: 'your-gcp-project-id',
    location: 'your-gcp-location', // e.g., 'us-central1'
});

async function runVertex() {
  // Example: Generate text content with Vertex AI
  const model = ai.models.generateContent({
    model: "gemini-1.5-pro-preview-0409", // Example Vertex AI model
    contents: [{ role: "user", parts: [{ text: "What are the benefits of using Vertex AI with the Gen AI SDK?" }] }]
  });
  const response = await model;
  console.log(response.text);
}

runVertex();

Sélection de la version de l'API :
Par défaut, le SDK utilise les points de terminaison de l'API bêta pour fournir un accès anticipé aux fonctionnalités d'aperçu. Cependant, pour les applications nécessitant de la stabilité, vous pouvez sélectionner explicitement les versions v1 (stable) ou d'autres versions d'API spécifiques (comme v1alpha pour certaines fonctionnalités d'aperçu sur l'API Gemini) lors de l'initialisation :

Pour Vertex AI (définir sur v1) :

const ai = new GoogleGenAI({
    vertexai: true,
    project: 'your-gcp-project-id',
    location: 'your-gcp-location',
    apiVersion: 'v1'
});

Pour l'API Gemini Developer (définir sur v1alpha pour des fonctionnalités comme ai.live) :

const ai = new GoogleGenAI({
    apiKey: 'YOUR_GEMINI_API_KEY',
    apiVersion: 'v1alpha'
});

Structure de base du SDK : L'objet GoogleGenAI

Une fois initialisé, l'objet ai (une instance de GoogleGenAI) est votre interface principale vers les capacités du SDK. Il donne accès à divers sous-modules, chacun répondant à des fonctionnalités spécifiques :

Créer des applications avec les modèles Gemini 2.5

Le SDK est votre ligne directe vers la puissance des modèles Gemini 2.5 (et des versions précédentes comme Gemini 1.0 Pro, 1.5 Pro et 1.5 Flash). Pour utiliser un modèle spécifique, vous référez simplement son nom dans le paramètre model des méthodes comme ai.models.generateContent() ou lors de la création d'une session de chat avec ai.chats.create().

Par exemple, pour utiliser le modèle gemini-2.5-flash-001 (nom hypothétique, remplacez-le par les identificateurs de modèle réels lorsqu'ils sont publiés) :

const response = await ai.models.generateContent({
  model: 'gemini-2.5-flash-001', // Use the specific model identifier
  contents: [{ role: "user", parts: [{ text: "Tell me about the key advancements in Gemini 2.5." }] }]
});
console.log(response.text);

Le SDK gère les appels d'API sous-jacents, vous permettant de vous concentrer sur la création de vos invites et le traitement du contenu généré. Au fur et à mesure que Google publie de nouveaux modèles et met à jour ceux existants, vous pouvez généralement basculer vers eux en modifiant simplement la chaîne d'identifiant du modèle, ce qui facilite le maintien de vos applications à la pointe de la technologie.

Plongée en profondeur : Traitement de contenu multimodal (MCP)

L'un des aspects les plus puissants des modèles Gemini est leur capacité à comprendre et à générer du contenu sur plusieurs modalités (texte, images, audio, vidéo). Le Google Gen AI SDK prend entièrement en charge cela, vous permettant de créer des applications riches et multimodales.

Le MCP est principalement réalisé via le paramètre contents dans les méthodes comme generateContent et sendMessage (dans le chat). Le tableau contents prend une série d'objets Content, chacun pouvant contenir plusieurs objets Part. Chaque Part peut représenter un type de données différent.

Structure du contenu multimodal :

Exemple : Invite multimodale (texte et image) :

import { GoogleGenAI } from '@google/genai';
// ... (Initialization)

async function describeImage() {
  // Assume 'base64ImageData' is a Base64 encoded string of a JPEG image
  const base64ImageData = "..."; // Your Base64 image data

  const contents = [
    {
      role: "user",
      parts: [
        { text: "What is in this image?" },
        {
          inlineData: {
            mimeType: "image/jpeg",
            data: base64ImageData,
          },
        },
      ],
    },
  ];

  const response = await ai.models.generateContent({
    model: "gemini-pro-vision", // Or a Gemini 2.5 vision-capable model
    contents: contents,
  });
  console.log(response.text);
}

describeImage();

Cette capacité à mélanger de manière transparente différents types de données dans vos invites ouvre un vaste éventail de possibilités d'application, des systèmes de questions-réponses visuels aux outils qui analysent et décrivent le contenu vidéo. Bien que le SDK fournisse des méthodes directes pour la génération d'images, la génération de vidéos n'est pas explicitement proposée en tant que méthode SDK directe. Au lieu de cela, la vidéo est principalement traitée comme une modalité d'entrée. Cependant, les modèles multimodaux avancés accessibles via generateContent pourraient être capables de traiter et de répondre aux entrées vidéo de manière sophistiquée, comme la synthèse ou la réponse à des questions sur le contenu vidéo.

Interactions en temps réel avec l'API Live (ai.live)

Pour les applications exigeant des expériences interactives à faible latence, le sous-module ai.live change la donne. Actuellement en aperçu et nécessitant la version d'API v1alpha pour l'API Gemini, ai.live établit une connexion WebSocket pour la diffusion bidirectionnelle avec les modèles Gemini. Cela permet la transmission en temps réel de texte, de morceaux audio et même d'images vidéo en entrée, et la réception de texte ou d'audio en sortie.

Concepts clés de ai.live :

  1. ai.live.connect(params) : C'est le point d'entrée. Vous fournissez des paramètres tels que le nom du modèle (model), la configuration de la connexion (config) et les fonctions de rappel (callbacks) pour divers événements WebSocket (par exemple, onopen, onmessage, onerror, onclose). Il renvoie une Promise qui se résout en un objet Session.
  2. Objet Session : Représente la connexion WebSocket active. Il a des méthodes pour :

Configuration (LiveConnectParameters et LiveConnectConfig) :

Rappels (LiveCallbacks) :

Exemple : Configuration de base ai.live (Conceptuel) :

import { GoogleGenAI, Modality } from '@google/genai';

// Ensure you initialize with apiVersion: 'v1alpha' for Gemini API
const ai = new GoogleGenAI({ apiKey: 'YOUR_GEMINI_API_KEY', apiVersion: 'v1alpha' });

async function startLiveSession() {
  try {
    const session = await ai.live.connect({
      model: 'gemini-pro', // Or a specific model supporting live, check documentation
      config: {
        responseModalities: [Modality.TEXT, Modality.AUDIO], // Expect text and audio back
        // speechConfig: { ... } // For TTS, covered below
      },
      callbacks: {
        onopen: () => console.log('Live session connected!'),
        onmessage: (serverMessage) => {
          // Process messages from the server
          // This could be text, audio data, tool calls, etc.
          console.log('Received from server:', serverMessage);
          if (serverMessage.speechUpdate?.audio) {
            // Handle incoming audio data (e.g., play it)
            const audioBytes = serverMessage.speechUpdate.audio;
            // ... your audio playback logic ...
          }
          if (serverMessage.textUpdate?.text) {
             console.log("Text: ", serverMessage.textUpdate.text);
          }
        },
        onerror: (error) => console.error('Live session error:', error),
        onclose: () => console.log('Live session closed.'),
      },
    });

    // Now you can send messages
    session.sendClientContent({ turns: [{ role: 'user', parts: [{text: 'Hello, live Gemini!'}] }] });

    // For continuous audio input:
    // navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
    //   const mediaRecorder = new MediaRecorder(stream);
    //   mediaRecorder.ondataavailable = event => {
    //     if (event.data.size > 0) {
    //       session.sendRealtimeInput({ media: { mediaChunks: [event.data] } });
    //     }
    //   };
    //   mediaRecorder.start(1000); // Send audio chunks every second
    // });

    // Remember to close the session when done
    // session.close();

  } catch (error) {
    console.error('Failed to connect live session:', error);
  }
}

startLiveSession();

Le module ai.live est incroyablement puissant pour créer des applications qui semblent vraiment conversationnelles et réactives, réagissant en temps réel aux entrées utilisateur sur différentes modalités.

Modèles et capacités de synthèse vocale (TTS)

Le SDK facilite la génération de synthèse vocale (TTS), principalement via l'interface ai.live lorsque la sortie audio est demandée. Cela permet aux modèles Gemini de répondre non seulement avec du texte, mais aussi avec de l'audio parlé.

Configuration TTS (SpeechConfig et VoiceConfig) :

Lorsque vous établissez une connexion en direct en utilisant ai.live.connect(), vous pouvez spécifier un speechConfig dans le paramètre config.

Exemple : Demande de sortie audio dans une session en direct :

// Within ai.live.connect parameters:
// ...
config: {
  responseModalities: [Modality.AUDIO], // Crucial for TTS
  speechConfig: {
    voiceConfig: {
      // Replace with an actual available prebuilt voice name
      prebuiltVoice: 'aura-asteria-en',
    }
  }
},
callbacks: {
  onmessage: (serverMessage) => {
    if (serverMessage.speechUpdate?.audio) {
      const audioData = serverMessage.speechUpdate.audio; // This is ArrayBuffer
      // Logic to play this audio data in the browser or save it in Node.js
      // For example, in a browser:
      // const audioBlob = new Blob([audioData], { type: 'audio/mpeg' }); // Or appropriate MIME type
      // const audioUrl = URL.createObjectURL(audioBlob);
      // new Audio(audioUrl).play();
      console.log('Received audio data for TTS.');
    }
    if (serverMessage.textUpdate?.text) {
        console.log("Accompanying text (if any):", serverMessage.textUpdate.text)
    }
  },
  // ... other callbacks
},
// ...

Lorsqu'il est configuré pour la sortie audio, le rappel onmessage dans votre session en direct recevra des objets ServerMessage. Si le message contient de la parole, le champ speechUpdate.audio contiendra les données audio (généralement sous forme d'ArrayBuffer). Vous pouvez ensuite traiter ces données pour les lire à l'utilisateur ou les enregistrer en tant que fichier audio. Le champ textUpdate.text peut également être rempli avec la version texte de la parole.

Cette intégration de TTS directement dans le flux en direct et conversationnel rend le SDK idéal pour les applications vocales, les assistants interactifs et les fonctionnalités d'accessibilité.

Modèles de génération d'images

Le SDK fournit une méthode dédiée à la génération d'images en utilisant des modèles comme Imagen : ai.models.generateImages(). Cette méthode vous permet de fournir une invite textuelle et de recevoir des données d'image générées.

Utilisation de ai.models.generateImages() :

Cette méthode prend GenerateImagesParameters, qui incluent :

Exemple : Génération d'une image :

import { GoogleGenAI } from '@google/genai';
// ... (Initialization for Vertex AI, as Imagen is often a Vertex AI service)
const ai = new GoogleGenAI({ vertexai: true, project: 'your-gcp-project-id', location: 'your-gcp-location' });


async function createImage() {
  try {
    const response = await ai.models.generateImages({
      model: 'imagen-3.0-generate-002', // Check documentation for latest model
      prompt: 'A futuristic cityscape at sunset, with flying vehicles and neon lights.',
      config: {
        numberOfImages: 1,
        aspectRatio: '16:9',
        includeRaiReason: true,
      },
    });

    if (response?.generatedImages && response.generatedImages.length > 0) {
      const imageBytesBase64 = response.generatedImages[0]?.image?.imageBytes;
      if (imageBytesBase64) {
        // imageBytesBase64 is a Base64 encoded string of the image
        console.log('Image generated (Base64 encoded)!');
        // You can then display this image in a browser (e.g., <img src="data:image/png;base64,..." />)
        // or save it to a file in Node.js
      }
    } else {
      console.log('No image generated or RAI filtered:', response?.raiFilteredReason);
    }
  } catch (error) {
    console.error('Error generating image:', error);
  }
}

createImage();

La réponse (GenerateImagesResponse) contiendra un tableau d'objets GeneratedImage. Chaque objet peut inclure les données de l'image (souvent sous forme de imageBytes au format Base64), un raiFilteredReason s'il a été filtré et d'autres métadonnées.

Traitement vidéo (en entrée)

Comme souligné précédemment, le SDK traite principalement la vidéo comme une modalité d'entrée plutôt que comme une sortie générée. Vous pouvez inclure des données vidéo dans vos invites aux modèles Gemini multimodaux de plusieurs manières :

Téléchargement de fichiers vidéo (ai.files.upload() - API Gemini) :
Vous pouvez télécharger des fichiers vidéo (par exemple, MP4) en utilisant le sous-module ai.files. Une fois téléchargé, vous recevez un URI de fichier qui peut être référencé dans la partie fileData de votre objet Content.

// Conceptual example for file upload (Gemini API)
// const uploadedFile = await ai.files.upload({
//   file: pathToYourVideoFile, // Or a Blob in the browser
//   mimeType: 'video/mp4',
//   displayName: 'my-cool-video.mp4'
// });
// const videoFileUri = uploadedFile.uri;

const contents = [{
  role: "user",
  parts: [
    { text: "Summarize this video." },
    { fileData: { mimeType: "video/mp4", fileUri: "YOUR_UPLOADED_VIDEO_URI_HERE" } },
    // Optionally, add VideoMetadata
    // { videoMetadata: { startOffset: "0s", endOffset: "30s" } } // Process first 30s
  ]
}];

Utilisation des URI Google Cloud Storage (Vertex AI) :
Lorsque vous utilisez Vertex AI, vous pouvez référencer directement les fichiers vidéo stockés dans les buckets Google Cloud Storage en utilisant leur URI gs:// dans la partie fileData.

Images vidéo en direct (ai.live) :
Comme discuté dans la section ai.live, vous pouvez envoyer des images vidéo individuelles (en tant qu'objets Blob, probablement des types MIME d'image comme image/jpeg ou image/png) en utilisant session.sendRealtimeInput(). Cela permet une analyse ou une interaction en temps réel basée sur un flux vidéo en direct.

L'interface VideoMetadata, avec startOffset et endOffset, vous permet de spécifier quel segment d'un fichier vidéo le modèle doit cibler, ce qui est utile pour le traitement de longues vidéos.

Support de l'API Gemini vs Vertex AI : une double approche

Un avantage significatif du Google Gen AI SDK est sa prise en charge transparente de l'API Gemini Developer (via Google AI Studio) et de Vertex AI. Cette double prise en charge offre aux développeurs une flexibilité et une voie de mise à niveau claire.

Le SDK abstrait de nombreuses différences. Les méthodes de base comme ai.models.generateContent() fonctionnent de la même manière pour les deux, la principale distinction étant l'initialisation (apiKey vs. vertexai: true, project, location). Cela vous permet de commencer avec l'API Gemini et de migrer vers Vertex AI à mesure que votre application mûrit et évolue, sans une réécriture complète de votre logique d'IA. La documentation des méthodes spécifie souvent si une fonctionnalité ou un paramètre est unique à une plateforme.

Conclusion : Votre boîte à outils pour les applications d'IA de nouvelle génération

Le Google Gen AI TypeScript/JavaScript SDK est une boîte à outils puissante et polyvalente qui apporte les capacités de Gemini 2.5 et d'autres modèles avancés directement aux développeurs JavaScript. Sa prise en charge du contenu multimodal, des interactions en temps réel via l'API Live, de la synthèse vocale intégrée, de la génération d'images et la flexibilité de choisir entre l'API Gemini Developer et Vertex AI en font une ressource indispensable.

En comprenant la structure du SDK, ses modules de base (ai.models, ai.live, ai.chats, ai.files, ai.caches) et les nuances de l'invite multimodale, vous êtes bien équipé pour créer des applications innovantes qui peuvent voir, entendre, parler et comprendre le monde de manière plus riche que jamais. Alors que Google continue de repousser les limites de l'IA, ce SDK sera votre clé pour libérer ce potentiel dans vos projets JavaScript et TypeScript. Plongez-vous, expérimentez et construisez l'avenir des applications basées sur l'IA dès aujourd'hui !

J'ai généré l'article sur la base des informations recueillies dans le répertoire README.md et docs. Il couvre tous les sujets spécifiés et vise le nombre de mots requis.

Explore more

Fathom-R1-14B : Modèle de raisonnement IA avancé d'Inde

Fathom-R1-14B : Modèle de raisonnement IA avancé d'Inde

L'IA en expansion rapide. Fathom-R1-14B (14,8 milliards de paramètres) excelle en raisonnement mathématique et général, conçu par Fractal AI Research.

5 June 2025

Mistral Code : L'assistant de codage le plus personnalisable basé sur l'IA pour les entreprises

Mistral Code : L'assistant de codage le plus personnalisable basé sur l'IA pour les entreprises

Découvrez Mistral Code, l'IA d'aide au code la plus personnalisable pour les entreprises.

5 June 2025

Comment Claude Code transforme le codage de l'IA en 2025

Comment Claude Code transforme le codage de l'IA en 2025

Découvrez Claude Code en 2025 : codage IA révolutionné. Fonctionnalités, démo, et pourquoi il gagne du terrain après Windsurf d'Anthropic. Indispensable !

5 June 2025

Pratiquez le Design-first d'API dans Apidog

Découvrez une manière plus simple de créer et utiliser des API

S'inscrire gratuitementTélécharger