透過 Firebase SDKs 的 Vertex AI AI 開始使用 Gemini'API


本指南說明如何開始使用所選平台的 Vertex AI in Firebase SDK，直接從應用程式呼叫 Vertex AI Gemini API。

事前準備

本指南假設您已熟悉使用 JavaScript 開發網路應用程式。本指南不受架構限制。

  • 請確認開發環境和網頁應用程式符合下列規定：

    • (選用) Node.js
    • 新式網路瀏覽器

  • (選用) 查看範例應用程式。

    下載範例應用程式

    您可以快速試用 SDK、查看各種用途的完整導入方式，或使用範例應用程式 (如果您沒有自己的網頁應用程式)。如要使用範例應用程式，您必須將其連結至 Firebase 專案。

步驟 1：設定 Firebase 專案，並將應用程式連結至 Firebase

如果您已建立 Firebase 專案，並將應用程式連結至 Firebase

  1. 在 Firebase 主控台中，前往「運用 Gemini 建構內容」頁面。

  2. 按一下 Vertex AI in Firebase 資訊卡，即可啟動工作流程，協助您完成下列工作：

  3. 請繼續參閱本指南的後續步驟，將 SDK 新增至應用程式。

如果您「沒有」已建立 Firebase 專案，也沒有與 Firebase 連結的應用程式


步驟 2：新增 SDK

Firebase 專案設定完成後，應用程式已連結至 Firebase (請參閱上一個步驟)，現在您可以將 Vertex AI in Firebase SDK 新增至應用程式。

Vertex AI in Firebase 程式庫可提供對 Vertex AI Gemini API 的存取權，並包含在 Firebase JavaScript SDK for Web 中。

  1. 使用 npm 安裝適用於網頁的 Firebase JS SDK：

      npm install firebase

  2. 在應用程式中初始化 Firebase：

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

步驟 3：初始化 Vertex AI 服務和生成模型

您必須先初始化 Vertex AI 服務和產生模型，才能發出任何 API 呼叫。

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 models are versatile and can be used with all API capabilities
const model = getGenerativeModel(vertexAI, { model: "gemini-1.5-flash" });

完成入門指南後，請瞭解如何選擇適合您用途和應用程式的 Gemini 模型和 (選用) 位置。

步驟 4：呼叫 Vertex AI Gemini API

您已將應用程式連結至 Firebase、新增 SDK，並初始化 Vertex AI 服務和產生模型，因此可以呼叫 Vertex AI Gemini API。

您可以使用 generateContent()，根據僅限文字提示要求產生文字：

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 models are versatile and can be used with all API capabilities
const model = getGenerativeModel(vertexAI, { model: "gemini-1.5-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();

你還可以做些什麼？

進一步瞭解 Gemini 模型

瞭解可用於各種用途的模型，以及相關配額和定價。

試用 Gemini API 的其他功能

瞭解如何控管內容產生

您也可以使用 Vertex AI Studio 嘗試使用提示和模型設定。


針對使用 Vertex AI in Firebase 的體驗提供意見回饋