Comece a usar a API Gemini usando a Vertex AI nos SDKs do Firebase


Este guia mostra como começar a fazer chamadas para o Vertex AI Gemini API diretamente no app usando o SDK Vertex AI in Firebase para a plataforma escolhida.

Você também pode usar este guia para acessar modelos Imagen usando os SDKs Vertex AI in Firebase.

Pré-requisitos

Neste guia, pressupomos que você já sabe usar o JavaScript para desenvolver apps da Web. Este guia não depende da estrutura.

  • Verifique se o ambiente de desenvolvimento e o app da Web atendem aos seguintes requisitos:

    • (Opcional) Node.js
    • Navegador da Web moderno

  • (Opcional) Confira o app de exemplo.

    Fazer o download do app de exemplo

    Você pode testar o SDK rapidamente, conferir uma implementação completa de vários casos de uso ou usar o app de exemplo se não tiver seu próprio app da Web. Para usar o app de exemplo, você precisa conectar a um projeto do Firebase.

Etapa 1: configurar um projeto do Firebase e conectar o app ao Firebase

Se você já tem um projeto e um app conectados ao Firebase

  1. No console do Firebase, acesse a página Criar com o Gemini.

  2. Clique no card Vertex AI in Firebase para iniciar um fluxo de trabalho que ajuda você a concluir as seguintes tarefas:

  3. Siga para a próxima etapa deste guia para adicionar o SDK ao app.

Se você ainda não tem um projeto do Firebase e um app conectado a ele

  1. Faça login no console do Firebase.

  2. Clique em Criar projeto e use uma das seguintes opções:

    • Opção 1: crie um projeto do Firebase totalmente novo (que vai ser um projeto do Google Cloud automaticamente) ao inserir um novo nome na primeira etapa do fluxo de trabalho "Criar projeto".

    • Opção 2: "Adicionar o Firebase" a um projeto Google Cloud existente selecionando o nome do projeto Google Cloud no menu suspenso da primeira etapa do fluxo de trabalho "Criar projeto".

    Quando solicitado, não é necessário configurar o Google Analytics para usar os SDKs Vertex AI in Firebase.

  3. No console do Firebase, acesse a página Criar com o Gemini.

  4. Clique no card Vertex AI in Firebase para iniciar um fluxo de trabalho que ajuda você a concluir as seguintes tarefas:

  1. Continue no fluxo de trabalho de IA generativa do console para conectar seu app ao Firebase, o que inclui estas tarefas:

    • Registrar o app no projeto do Firebase.

    • Adicionar o objeto de configuração do Firebase ao app.

  2. Nas próximas etapas deste guia, você vai adicionar o SDK Vertex AI in Firebase ao app e concluir a inicialização necessária para usar o SDK e a Gemini API.


Etapa 2: adicionar o SDK

Com o projeto do Firebase configurado e o app conectado ao Firebase (consulte a etapa anterior), agora você pode adicionar o SDK Vertex AI in Firebase ao app.

A biblioteca Vertex AI in Firebase oferece acesso às APIs para interagir com os modelos Gemini e Imagen. A biblioteca é incluída como parte do SDK do Firebase para JavaScript na Web.

  1. Instale o SDK do Firebase para JavaScript para Web usando o npm:

      npm install firebase

  2. Inicialize o Firebase no seu app:

      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);

Etapa 3: inicializar o serviço Vertex AI e o modelo generativo

Antes de fazer chamadas de API e solicitar um modelo Gemini, é necessário inicializar o serviço Vertex AI e o modelo generativo.

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
const model = getGenerativeModel(vertexAI, { model: "gemini-2.0-flash" });

Depois de concluir este guia de início, aprenda a escolher um modelo e (opcionalmente) um local adequado para seu caso de uso e app.

Etapa 4: enviar uma solicitação de comando para um modelo

Agora que você conectou seu app ao Firebase, adicionou o SDK e inicializou o serviço Vertex AI e o modelo generativo, já pode enviar uma solicitação de solicitação para um modelo Gemini.

Você pode usar generateContent() para gerar texto a partir de uma solicitação de comando de texto:

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
const model = getGenerativeModel(vertexAI, { model: "gemini-2.0-flash" });

// 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();

O que mais você pode fazer?

Saiba mais sobre os modelos compatíveis

Saiba mais sobre os modelos disponíveis para vários casos de uso e as cotas e o preço.

Testar outros recursos do Gemini API

Saiba como controlar a geração de conteúdo

Também é possível testar comandos e configurações de modelo usando Vertex AI Studio.


Enviar feedback sobre sua experiência com o Vertex AI in Firebase