Ce guide explique comment effectuer des appels vers l'API Gemini directement à partir de votre application à l'aide du SDK Vertex AI pour Firebase.
Prérequis
Dans ce guide, nous partons du principe que vous savez utiliser JavaScript pour développer des applications Web. Ce guide est indépendant du framework.
Assurez-vous que votre environnement de développement et votre application Web répondent aux exigences suivantes:
- (Facultatif) Node.js
- Navigateur Web récent
(Facultatif) Découvrez l'application exemple.
Télécharger l'application exemple
Vous pouvez tester rapidement le SDK, consulter une implémentation complète de divers cas d'utilisation ou utiliser l'application exemple si vous ne disposez pas de votre propre application Web. Pour l'utiliser, vous devez l'associer à un projet Firebase.
Étape 1: Configurez un projet Firebase et connectez votre application à Firebase
Si vous avez déjà un projet et une application associés à Firebase
Dans la console Firebase, accédez à la page Build with Gemini (Compiler avec Gemini), puis cliquez sur la deuxième fiche pour lancer un workflow qui vous aide à effectuer les tâches suivantes. Si la mise en page en cartes ne s'affiche pas, cela signifie que ces tâches sont terminées.
Mettez à niveau votre projet pour utiliser le forfait de paiement à l'usage Blaze.
Activez les deux API suivantes pour votre projet:
aiplatform.googleapis.com
etfirebaseml.googleapis.com
.
Passez à l'étape suivante de ce guide pour ajouter le SDK à votre application.
Si vous n'avez pas encore de projet Firebase et d'application connectée à Firebase
Étape 2: Ajouter le SDK
Une fois votre projet Firebase configuré et votre application connectée à Firebase (voir l'étape précédente), vous pouvez y ajouter le SDK Vertex AI pour Firebase.
Le SDK Vertex AI pour le Web permet d'accéder à l'API Gemini.
Installez la version preview privée du SDK à l'aide de npm:
npm install firebase@vertexai-preview
Initialisez Firebase dans votre application:
import { initializeApp } from "firebase/app"; // TODO(developer) Replace the following with your app's Firebase configuration // See: https://firebase.google.com/docs/web/learn-more#config-object const firebaseConfig = { // ... }; // Initialize FirebaseApp const firebaseApp = initializeApp(firebaseConfig);
Étape 3: Initialiser le service Vertex AI et le modèle génératif
Avant de pouvoir effectuer des appels d'API, vous devez initialiser le service Vertex AI et le modèle génératif.
import { initializeApp } from "firebase/app";
import { getVertexAI, getGenerativeModel } from "firebase/vertexai";
// TODO(developer) Replace the following with your app's Firebase configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
// ...
};
// Initialize FirebaseApp
const firebaseApp = initializeApp(firebaseConfig);
// Initialize the Vertex AI service
const vertexAI = getVertexAI(firebaseApp);
// Initialize the generative model with a model that supports your use case
// Gemini 1.5 Pro is versatile and can accept both text-only or multimodal prompt inputs
const model = getGenerativeModel(vertexAI, { model: "gemini-1.5-pro-preview-0409" });
Une fois que vous avez terminé le guide de démarrage, découvrez comment choisir un modèle Gemini adapté à votre cas d'utilisation.
Étape 4: Appeler l'API Gemini
Maintenant que vous avez connecté votre application à Firebase, ajouté le SDK et initialisé le service Vertex AI et le modèle génératif, vous êtes prêt à appeler l'API Gemini.
Indiquez si vous souhaitez diffuser la réponse (generateContentStream
) ou l'attendre jusqu'à ce que l'intégralité du résultat soit générée (generateContent
).
Flux
Par défaut, le modèle renvoie une réponse une fois l'ensemble du processus de génération terminé. Toutefois, vous pouvez obtenir des interactions plus rapides en n'attendant pas le résultat complet et en utilisant plutôt un flux pour gérer les résultats partiels.
Vous pouvez utiliser generateContentStream()
pour diffuser du texte généré à partir d'une requête de requête n'incluant que du texte:
import { initializeApp } from "firebase/app";
import { getVertexAI, getGenerativeModel } from "firebase/vertexai";
// TODO(developer) Replace the following with your app's Firebase configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
// ...
};
// Initialize FirebaseApp
const firebaseApp = initializeApp(firebaseConfig);
// Initialize the Vertex AI service
const vertexAI = getVertexAI(firebaseApp);
// Initialize the generative model with a model that supports your use case
// Gemini 1.5 Pro is versatile and can accept both text-only and multimodal prompt inputs
const model = getGenerativeModel(vertexAI, { model: "gemini-1.5-pro-preview-0409" });
// Wrap in an async function so you can use await
async function run() {
// Provide a prompt that contains text
const prompt = "Write a story about a magic backpack."
// To stream generated text output, call generateContentStream with the text input
const result = await model.generateContentStream(prompt);
for await (const chunk of result.stream) {
const chunkText = chunk.text();
console.log(chunkText);
}
console.log('aggregated response: ', await result.response);
}
run();
Sans streaming
Vous pouvez également attendre l'intégralité du résultat au lieu de le diffuser. Le résultat n'est renvoyé qu'une fois que le modèle a terminé l'ensemble du processus de génération.
Vous pouvez utiliser generateContent()
pour générer du texte à partir d'une requête de requête qui n'inclut que du texte:
import { initializeApp } from "firebase/app";
import { getVertexAI, getGenerativeModel } from "firebase/vertexai";
// TODO(developer) Replace the following with your app's Firebase configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
// ...
};
// Initialize FirebaseApp
const firebaseApp = initializeApp(firebaseConfig);
// Initialize the Vertex AI service
const vertexAI = getVertexAI(firebaseApp);
// Initialize the generative model with a model that supports your use case
// Gemini 1.5 Pro is versatile and can accept both text-only and multimodal prompt inputs
const model = getGenerativeModel(vertexAI, { model: "gemini-1.5-pro-preview-0409" });
// Wrap in an async function so you can use await
async function run() {
// Provide a prompt that contains text
const prompt = "Write a story about a magic backpack."
// To generate text output, call generateContent with the text input
const result = await model.generateContent(prompt);
const response = result.response;
const text = response.text();
console.log(text);
}
run();
Qu'est-ce que tu sais faire d'autre ?
En savoir plus sur les modèles Gemini
Découvrez les modèles disponibles pour différents cas d'utilisation, ainsi que leurs quotas et leur tarification.
Tester d'autres fonctionnalités de l'API Gemini
- Découvrez comment envoyer des invites textuelles uniquement.
- Envoyez des requêtes de requêtes multimodales contenant des requêtes textuelles et multimédias (y compris des images, des fichiers PDF, de la vidéo et de l'audio).
- Créer des conversations multitours (chat).
Découvrez comment contrôler la génération de contenu
- Familiarisez-vous avec la conception de requêtes, y compris les bonnes pratiques, les stratégies et les exemples de requêtes.
- Configurez les paramètres du modèle, tels que la température et le nombre maximal de jetons de sortie.
- Utilisez les paramètres de sécurité pour ajuster la probabilité de recevoir des réponses pouvant être considérées comme nuisibles.
Vous pouvez également tester des requêtes et des configurations de modèle à l'aide de Vertex AI Studio.
Donnez-nous votre avis sur votre expérience avec les SDK Vertex AI pour Firebase.