Firebase SDK で Vertex AI を使用して Gemini API を使ってみる


このガイドでは、 Vertex AI Gemini API 選択したプラットフォーム用の Vertex AI in Firebase SDK。

前提条件

このガイドは、読者が JavaScript を使用したコードの作成に精通していることを前提としています。 サポートします。このガイドはフレームワークに依存していません。

ステップ 1: Firebase プロジェクトを設定し、アプリを Firebase に接続する

Firebase プロジェクトと Firebase に接続されたアプリがすでにある場合

  1. Firebase コンソールで、 Gemini を使用した構築ページ

  2. Vertex AI in Firebase カードをクリックすると、以下に役立つワークフローを起動できます。 次のタスクを行います。(コンソールに Vertex AI の場合、これらのタスクは完了です)。

  3. このガイドの次のステップに進んで、SDK をアプリに追加します。

Firebase プロジェクトと Firebase に接続されたアプリがまだない場合


ステップ 2: SDK を追加する

Firebase プロジェクトを設定し、アプリを Firebase に接続したら、 (前のステップを参照)これで、Vertex AI in Firebase SDK をアプリに追加できるようになりました。

Vertex AI in Firebase ライブラリは、 Vertex AI Gemini APIで、 ウェブ用の Firebase JavaScript SDK。

  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 サービスと生成モデルを初期化する

API 呼び出しを行う前に、Vertex AI を初期化する必要があります。 生成モデルの違いです

import { initializeApp } from "firebase/app";
import { getVertexAI, getGenerativeModel } from "firebase/vertexai-preview";

// 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 モデルと(必要に応じて) location を使用します。

ステップ 4: Vertex AI Gemini API を呼び出す

アプリを Firebase に接続し、SDK を追加して初期化を終えたので、 Vertex AI サービスと生成モデル、 Vertex AI Gemini API を呼び出す準備が整いました。

generateContent() を使用すると、テキストのみのプロンプトからテキストを生成できます。 request:

import { initializeApp } from "firebase/app";
import { getVertexAI, getGenerativeModel } from "firebase/vertexai-preview";

// 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();
<ph type="x-smartling-placeholder">で確認できます。 で確認できます。

Google アシスタントの機能

Gemini モデルの詳細

詳しくは、 さまざまなユースケースで利用可能な および 割り当てと料金をご確認ください。

Gemini API のその他の機能を試す

コンテンツの生成を制御する方法

で確認できます。 また、Terraform を使用してプロンプトやモデル構成をテストすることもできます。 Vertex AI Studio


フィードバックを送信 Vertex AI in Firebase の感想をお聞かせください。