Membuat pengalaman campuran dengan model yang dihosting di perangkat dan di cloud


Buat aplikasi dan fitur yang didukung AI dengan inferensi campuran menggunakan Firebase AI Logic. Inferensi campuran memungkinkan inferensi berjalan menggunakan model di perangkat jika tersedia dan kembali ke model yang dihosting di cloud dengan lancar jika tidak.

Dengan rilis ini, inferensi campuran tersedia menggunakan SDK klien Firebase AI Logic untuk Web dengan dukungan untuk inferensi di perangkat untuk Chrome di Desktop.

Langsung ke contoh kode

Kasus penggunaan yang direkomendasikan dan kemampuan yang didukung

Kasus penggunaan yang direkomendasikan:

  • Menggunakan model di perangkat untuk inferensi menawarkan:

    • Privasi yang ditingkatkan
    • Konteks lokal
    • Inferensi tanpa biaya
    • Fungsi offline
  • Menggunakan penawaran fungsi hybrid:

    • Menjangkau 100% audiens Anda, terlepas dari ketersediaan model di perangkat

Kemampuan dan fitur yang didukung untuk inferensi di perangkat:

  • Pembuatan konten satu giliran, streaming, dan non-streaming
  • Membuat teks dari input khusus teks
  • Membuat teks dari input teks dan gambar, khususnya jenis gambar input JPEG dan PNG
  • Membuat output terstruktur, termasuk JSON dan enum

Mulai

Panduan ini menunjukkan cara memulai penggunaan Firebase AI Logic SDK untuk Web guna melakukan inferensi campuran.

Inferensi menggunakan model di perangkat menggunakan Prompt API dari Chrome; sedangkan inferensi menggunakan model yang dihosting cloud menggunakan penyedia Gemini API yang Anda pilih (Gemini Developer API atau Vertex AI Gemini API).

Langkah 1: Siapkan Chrome dan Prompt API untuk inferensi di perangkat

  1. Download build Chrome Dev terbaru.

    Inferensi di perangkat tersedia mulai dari Chrome v138 dan yang lebih baru.

  2. Aktifkan Prompt API untuk instance Chrome Anda dengan menetapkan flag berikut:

    • chrome://flags/#optimization-guide-on-device-model: Tetapkan ke Enabled.
    • chrome://flags/#prompt-api-for-gemini-nano: Tetapkan ke Enabled.

    Pelajari lebih lanjut cara menggunakan API di localhost dalam dokumentasi Chrome. Secara opsional, bergabunglah dengan Program Pratinjau Awal (EPP) Chrome untuk memberikan masukan.

  3. Aktifkan model multimodal di perangkat dengan menetapkan tanda berikut:

    • chrome://flags/#prompt-api-for-gemini-nano-multimodal-input: Tetapkan ke Enabled.
  4. Verifikasi API secara lokal:

    1. Mulai ulang Chrome.

    2. Buka Alat Developer > Konsol.

    3. Jalankan perintah berikut:

      await LanguageModel.availability();
      
    4. Pastikan outputnya adalah available, downloading, atau downloadable. .

    5. Jika outputnya adalah downloadable, Anda dapat memulai download model dengan menjalankan await LanguageModel.create();. Jika tidak, permintaan pertama untuk inferensi di perangkat akan memulai download model di latar belakang, yang dapat memerlukan waktu beberapa menit.

Langkah 2: Siapkan project Firebase dan hubungkan aplikasi Anda ke Firebase

  1. Login ke konsol Firebase, lalu pilih project Firebase Anda.

  2. Di Firebase console, buka halaman Firebase AI Logic.

  3. Klik Mulai untuk meluncurkan alur kerja terpandu yang membantu Anda menyiapkan API yang diperlukan dan resource untuk project Anda.

  4. Pilih penyedia "Gemini API" yang ingin Anda gunakan dengan SDK Firebase AI Logic. Anda dapat menyiapkan dan menggunakan penyedia API lainnya nanti, jika mau.

    • Gemini Developer APIpenagihan opsional (tersedia di paket harga Spark tanpa biaya)
      Konsol akan mengaktifkan API yang diperlukan dan membuat kunci API Gemini di project Anda. Anda dapat menyiapkan penagihan nanti jika ingin mengupgrade paket harga.

    • Vertex AI Gemini APIpenagihan diperlukan (memerlukan paket harga Blaze bayar sesuai penggunaan)
      Konsol akan membantu Anda menyiapkan penagihan dan mengaktifkan API yang diperlukan dalam project Anda.

  5. Jika diminta dalam alur kerja konsol, ikuti petunjuk di layar untuk mendaftarkan aplikasi dan menghubungkannya ke Firebase.

  6. Lanjutkan ke langkah berikutnya dalam panduan ini untuk menambahkan SDK ke aplikasi Anda.

Langkah 3: Tambahkan SDK

Library Firebase menyediakan akses ke API untuk berinteraksi dengan model generatif. Library ini disertakan sebagai bagian dari Firebase JavaScript SDK untuk Web.

  1. Instal Firebase JS SDK untuk Web menggunakan npm.

    Fitur campuran dirilis dengan tag npm yang berbeda, jadi pastikan untuk menyertakannya dalam perintah penginstalan Anda.

    npm install firebase@eap-ai-hybridinference
    
  2. Inisialisasi Firebase di aplikasi Anda:

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

Langkah 4: Lakukan inisialisasi layanan dan buat instance model

Klik penyedia Gemini API untuk melihat konten dan kode khusus penyedia di halaman ini.

Sebelum mengirim perintah ke model Gemini, lakukan inisialisasi layanan untuk penyedia API yang Anda pilih dan buat instance GenerativeModel.

Tetapkan mode ke salah satu dari:

  • prefer_on_device: Mengonfigurasi SDK untuk menggunakan model di perangkat jika tersedia, atau kembali ke model yang dihosting cloud.

  • only_on_device: Mengonfigurasi SDK untuk menggunakan model di perangkat atau menampilkan pengecualian.

  • only_in_cloud: Mengonfigurasi SDK agar tidak pernah menggunakan model di perangkat.

Secara default saat Anda menggunakan prefer_on_device atau only_in_cloud, model yang dihosting cloud adalah gemini-2.0-flash-lite, tetapi Anda dapat mengganti setelan default.

import { initializeApp } from "firebase/app";
import { getAI, getGenerativeModel, GoogleAIBackend } from "firebase/ai";

// 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 Gemini Developer API backend service
const ai = getAI(firebaseApp, { backend: new GoogleAIBackend() });

// Create a `GenerativeModel` instance
// Set the mode, for example to use on-device model when possible
const model = getGenerativeModel(ai, { mode: "prefer_on_device" });

Mengirim permintaan perintah ke model

Bagian ini memberikan contoh cara mengirim berbagai jenis input untuk menghasilkan berbagai jenis output, termasuk:

Jika Anda ingin membuat output terstruktur (seperti JSON atau enum), gunakan salah satu contoh "generate text" berikut dan juga konfigurasi model untuk merespons sesuai dengan skema yang diberikan.

Membuat teks dari input khusus teks

Sebelum mencoba contoh ini, pastikan Anda telah menyelesaikan bagian Memulai dalam panduan ini.

Anda dapat menggunakan generateContent() untuk membuat teks dari perintah yang berisi teks:

// Imports + initialization of FirebaseApp and backend service + creation of model instance

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

Membuat teks dari input teks dan gambar (multimodal)

Sebelum mencoba contoh ini, pastikan Anda telah menyelesaikan bagian Memulai dalam panduan ini.

Anda dapat menggunakan generateContent() untuk membuat teks dari perintah yang berisi file teks dan gambar—dengan menyediakan setiap mimeType file input dan file itu sendiri.

Jenis gambar input yang didukung untuk inferensi di perangkat adalah PNG dan JPEG.

// Imports + initialization of FirebaseApp and backend service + creation of model instance

// Converts a File object to a Part object.
async function fileToGenerativePart(file) {
  const base64EncodedDataPromise = new Promise((resolve) => {
    const reader = new FileReader();
    reader.onloadend = () => resolve(reader.result.split(',')[1]);
    reader.readAsDataURL(file);
  });
  return {
    inlineData: { data: await base64EncodedDataPromise, mimeType: file.type },
  };
}

async function run() {
  // Provide a text prompt to include with the image
  const prompt = "Write a poem about this picture:";

  const fileInputEl = document.querySelector("input[type=file]");
  const imagePart = await fileToGenerativePart(fileInputEl.files[0]);

  // To generate text output, call `generateContent` with the text and image
  const result = await model.generateContent([prompt, imagePart]);

  const response = result.response;
  const text = response.text();
  console.log(text);
}

run();

Kamu bisa apa lagi?

Selain contoh di atas, Anda juga dapat menggunakan mode inferensi alternatif, mengganti model penggantian default, dan menggunakan konfigurasi model untuk mengontrol respons.

Menggunakan mode inferensi alternatif

Contoh di atas menggunakan mode prefer_on_device untuk mengonfigurasi SDK agar menggunakan model di perangkat jika tersedia, atau kembali ke model yang dihosting cloud. SDK menawarkan dua mode inferensi alternatif: only_on_device dan only_in_cloud.

  • Gunakan mode only_on_device sehingga SDK hanya dapat menggunakan model di perangkat. Dalam konfigurasi ini, API akan menampilkan error jika model di perangkat tidak tersedia.

    const model = getGenerativeModel(ai, { mode: "only_on_device" });
    
  • Gunakan mode only_in_cloud sehingga SDK hanya dapat menggunakan model yang dihosting di cloud.

    const model = getGenerativeModel(ai, { mode: "only_in_cloud" });
    

Mengganti model penggantian default

Saat Anda menggunakan mode prefer_on_device, SDK akan kembali menggunakan model yang dihosting cloud jika model di perangkat tidak tersedia. Model default yang dihosting cloud penggantian adalah gemini-2.0-flash-lite. Model yang dihosting di cloud ini juga merupakan default saat Anda menggunakan modeonly_in_cloud.

Anda dapat menggunakan opsi konfigurasi inCloudParams untuk menentukan model default yang dihosting cloud alternatif:

const model = getGenerativeModel(ai, {
  mode: 'prefer_on_device',
  inCloudParams: {
    model: "gemini-2.0-flash"
  }
});

Temukan nama model untuk semua model Gemini yang didukung.

Menggunakan konfigurasi model untuk mengontrol respons

Dalam setiap permintaan ke model, Anda dapat mengirim konfigurasi model untuk mengontrol cara model menghasilkan respons. Model yang dihosting di cloud dan model di perangkat menawarkan opsi konfigurasi yang berbeda.

Konfigurasi dipertahankan selama masa aktif instance. Jika Anda ingin menggunakan konfigurasi yang berbeda, buat instance GenerativeModel baru dengan konfigurasi tersebut.

Menetapkan konfigurasi untuk model yang dihosting cloud

Gunakan opsi inCloudParams untuk mengonfigurasi model Gemini yang dihosting cloud. Pelajari parameter yang tersedia.

const model = getGenerativeModel(ai, {
  mode: 'prefer_on_device',
  inCloudParams: {
    model: "gemini-2.0-flash"
    temperature: 0.8,
    topK: 10
  }
});

Menetapkan konfigurasi untuk model di perangkat

Perhatikan bahwa inferensi menggunakan model di perangkat menggunakan Prompt API dari Chrome.

Gunakan opsi onDeviceParams untuk mengonfigurasi model di perangkat. Pelajari parameter yang tersedia.

const model = getGenerativeModel(ai, {
  mode: 'prefer_on_device',
  onDeviceParams: {
    createOptions: {
      temperature: 0.8,
      topK: 8
    }
  }
});

Menetapkan konfigurasi untuk output terstruktur

Pembuatan output terstruktur (seperti JSON dan enum) didukung untuk inferensi menggunakan model yang dihosting di cloud dan di perangkat.

Untuk inferensi campuran, gunakan inCloudParams dan onDeviceParams untuk mengonfigurasi model agar merespons dengan output terstruktur. Untuk mode lainnya, hanya gunakan konfigurasi yang berlaku.

  • Untuk inCloudParams: Tentukan responseMimeType yang sesuai (dalam contoh ini, application/json) serta responseSchema yang ingin digunakan model.

  • Untuk onDeviceParams: Tentukan responseConstraint yang ingin Anda gunakan oleh model.

Output JSON

Contoh berikut menyesuaikan contoh output JSON umum untuk inferensi campuran:

import {
  getAI,
  getGenerativeModel,
  Schema
} from "firebase/ai";

const jsonSchema = Schema.object({
 properties: {
    characters: Schema.array({
      items: Schema.object({
        properties: {
          name: Schema.string(),
          accessory: Schema.string(),
          age: Schema.number(),
          species: Schema.string(),
        },
        optionalProperties: ["accessory"],
      }),
    }),
  }
});

const model = getGenerativeModel(ai, {
  mode: 'prefer_on_device',
  inCloudParams: {
    model: "gemini-2.0-flash"
    generationConfig: {
      responseMimeType: "application/json",
      responseSchema: jsonSchema
    },
  }
  onDeviceParams: {
    promptOptions: {
      responseConstraint: jsonSchema
    }
  }
});
Output enum

Seperti di atas, tetapi menyesuaikan dokumentasi tentang output enum untuk inferensi campuran:

// ...

const enumSchema = Schema.enumString({
  enum: ["drama", "comedy", "documentary"],
});

const model = getGenerativeModel(ai, {

// ...

    generationConfig: {
      responseMimeType: "text/x.enum",
      responseSchema: enumSchema
    },

// ...

Fitur belum tersedia untuk inferensi di perangkat

Sebagai rilis eksperimental, tidak semua kemampuan Web SDK tersedia untuk inferensi di perangkat. Fitur berikut belum didukung untuk inferensi di perangkat (tetapi biasanya tersedia untuk inferensi berbasis cloud).

  • Membuat teks dari jenis input file gambar selain JPEG dan PNG

    • Dapat kembali ke model yang dihosting cloud; tetapi, mode only_on_device akan menampilkan error.
  • Membuat teks dari input audio, video, dan dokumen (seperti PDF)

    • Dapat kembali ke model yang dihosting cloud; tetapi, mode only_on_device akan menampilkan error.
  • Membuat gambar menggunakan model Gemini atau Imagen

    • Dapat kembali ke model yang dihosting cloud; tetapi, mode only_on_device akan menampilkan error.
  • Menyediakan file menggunakan URL dalam permintaan multimodal. Anda harus menyediakan file sebagai data inline ke model di perangkat.

  • Multi-turn chat

    • Dapat kembali ke model yang dihosting cloud; tetapi, mode only_on_device akan menampilkan error.
  • Streaming dua arah dengan Gemini Live API

    • Perhatikan bahwa hal ini tidak didukung oleh SDK klien Firebase AI Logic untuk Web bahkan untuk model yang dihosting di cloud.
  • Panggilan fungsi

    • Segera hadir!
  • Menghitung token

    • Selalu menampilkan error. Jumlahnya akan berbeda antara model yang dihosting di cloud dan di perangkat, sehingga tidak ada penggantian intuitif.
  • Pemantauan AI di konsol Firebase untuk inferensi di perangkat.

    • Perhatikan bahwa inferensi apa pun yang menggunakan model yang dihosting cloud dapat dipantau seperti inferensi lainnya yang menggunakan SDK klien Firebase AI Logic untuk Web.


Berikan masukan tentang pengalaman Anda dengan Firebase AI Logic