Gemini JavaScript SDK gebruiken

Welke SDK gebruik je?

Google biedt sinds Gemini 2.0 één unified SDK: @google/genai. Deze vervangt de oude @google/generative-ai, die sinds 30 november 2025 is uitgefaseerd en geen updates of bugfixes meer krijgt. Begin nieuwe projecten daarom altijd met @google/genai. Deze SDK werkt zowel met de Gemini Developer API (met API-sleutel) als met Vertex AI.

Installatie

npm install @google/genai

Voor een nieuw project:

mkdir mijn-gemini-app
cd mijn-gemini-app
npm init -y
npm install @google/genai dotenv

Voeg "type": "module" toe aan package.json voor de ES module import-syntax.

Basis configuratie

Je maakt één keer een client aan en hergebruikt die voor alle aanroepen.

import { GoogleGenAI } from "@google/genai";
import dotenv from "dotenv";

dotenv.config();

const ai = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });

Tekstgeneratie

Tekst genereer je via ai.models.generateContent(). Het resultaat lees je uit de text-property (geen functieaanroep).

const response = await ai.models.generateContent({
    model: "gemini-3.5-flash",
    contents: "Geef een overzicht van de vijf meest gebruikte JavaScript frameworks.",
    config: {
        systemInstruction: "Je bent een behulpzame assistent die antwoord geeft in het Nederlands.",
    },
});

console.log(response.text);

console.log("Prompt tokens:", response.usageMetadata.promptTokenCount);
console.log("Output tokens:", response.usageMetadata.candidatesTokenCount);

Generatieconfiguratie

Alle generatie-instellingen geef je mee in het config-object.

const response = await ai.models.generateContent({
    model: "gemini-3.5-flash",
    contents: "Schrijf een korte productbeschrijving.",
    config: {
        temperature: 0.8,
        topP: 0.95,
        topK: 40,
        maxOutputTokens: 2048,
        stopSequences: ["---EINDE---"],
    },
});

Chatsessie opzetten

Voor gesprekken met geheugen gebruik je ai.chats.create(). De sessie onthoudt de geschiedenis tussen aanroepen.

const chat = ai.chats.create({
    model: "gemini-3.5-flash",
    history: [
        {
            role: "user",
            parts: [{ text: "Hoi, ik wil leren programmeren in Python." }],
        },
        {
            role: "model",
            parts: [{ text: "Geweldig! Python is een uitstekende eerste taal. Waar wil je mee beginnen?" }],
        },
    ],
});

const response1 = await chat.sendMessage({ message: "Leg variabelen uit." });
console.log(response1.text);

const response2 = await chat.sendMessage({ message: "En functies?" });
console.log(response2.text);

console.log("Geschiedenis:", chat.getHistory().length, "berichten");

Streaming

Met streaming toon je het antwoord woord voor woord, zodra het binnenkomt. Dat geeft een snellere gebruikerservaring.

const stream = await ai.models.generateContentStream({
    model: "gemini-3.5-flash",
    contents: "Schrijf een uitleg van async/await in JavaScript met praktische voorbeelden.",
});

for await (const chunk of stream) {
    process.stdout.write(chunk.text);
}
console.log();

In een chatsessie stream je met chat.sendMessageStream({ message: "..." }), die je op dezelfde manier doorloopt.

Afbeeldingen verwerken

Multimodale invoer geef je mee als onderdelen in de contents-array. Een lokale afbeelding lees je in als base64.

import * as fs from "node:fs";

const base64Afbeelding = fs.readFileSync("diagram.png", { encoding: "base64" });

const response = await ai.models.generateContent({
    model: "gemini-3.5-flash",
    contents: [
        {
            inlineData: {
                mimeType: "image/png",
                data: base64Afbeelding,
            },
        },
        { text: "Beschrijf dit diagram en leg de architectuur uit." },
    ],
});

console.log(response.text);

Voor grotere of veel hergebruikte bestanden kun je beter de Files API gebruiken (ai.files.upload()), zodat je een bestand niet bij elke aanroep opnieuw verstuurt.

Gebruik in de browser

In de browser laad je de SDK via een bundler (Vite, webpack) of een import map.

<script type="importmap">
{
  "imports": {
    "@google/genai": "https://esm.run/@google/genai"
  }
}
</script>
<script type="module">
    import { GoogleGenAI } from "@google/genai";

    const ai = new GoogleGenAI({ apiKey: GEMINI_API_KEY });

    document.getElementById("submit").addEventListener("click", async () => {
        const prompt = document.getElementById("prompt").value;
        const response = await ai.models.generateContent({
            model: "gemini-3.5-flash",
            contents: prompt,
        });
        document.getElementById("output").textContent = response.text;
    });
</script>

Foutafhandeling

Vang fouten op en bouw een eenvoudige retry voor rate limits (HTTP 429).

async function veiligGenereren(prompt) {
    try {
        const response = await ai.models.generateContent({
            model: "gemini-3.5-flash",
            contents: prompt,
        });

        if (response.promptFeedback?.blockReason) {
            throw new Error(`Prompt geblokkeerd: ${response.promptFeedback.blockReason}`);
        }

        return response.text;
    } catch (error) {
        if (error.status === 429) {
            console.error("Rate limit bereikt, wacht even...");
            await new Promise(resolve => setTimeout(resolve, 60000));
            return veiligGenereren(prompt);
        }
        throw error;
    }
}

TypeScript-ondersteuning

De SDK is volledig getypeerd. Importeer types voor betere ondersteuning in je editor.

import {
    GoogleGenAI,
    type GenerateContentConfig,
} from "@google/genai";

const config: GenerateContentConfig = {
    temperature: 0.7,
    maxOutputTokens: 1024,
};

const ai = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });

const response = await ai.models.generateContent({
    model: "gemini-3.5-flash",
    contents: "Hallo",
    config,
});