פיתוח חוויות היברידיות באמצעות מודלים במכשיר ובענן


פיתוח אפליקציות אינטרנט ותכונות מבוססות-AI עם הסקה היברידית באמצעות Firebase AI Logic. הסקת מסקנות היברידית מאפשרת להריץ הסקת מסקנות באמצעות מודלים במכשיר כשהם זמינים, ולעבור בצורה חלקה למודלים שמתארחים בענן אם לא (ולהיפך).

בדף הזה מוסבר איך מתחילים להשתמש ב-SDK של הלקוח, ומוצגות אפשרויות נוספות להגדרה ויכולות, כמו פלט מובנה.

שימו לב שהסקת מסקנות במכשיר נתמכת באפליקציות אינטרנט שפועלות ב-Chrome במחשב.

מעבר לדוגמאות קוד

תרחישים מומלצים לדוגמה ויכולות נתמכות

תרחישים מומלצים לשימוש:

  • השימוש במודל במכשיר לצורך הסקת מסקנות מציע:

    • פרטיות משופרת
    • הקשר מקומי
    • הסקת מסקנות ללא עלות
    • פונקציונליות אופליין

  • שימוש במוצרים עם פונקציונליות היברידית:

    • הגעה ל-100% מהקהל, ללא קשר לזמינות הדגם במכשיר או לחיבור לאינטרנט

יכולות ותכונות נתמכות להסקת מסקנות במכשיר:

לפני שמתחילים

חשוב לשים לב לנקודות הבאות:

תחילת העבודה ב-localhost

בשלבי ההתחלה האלה מתואר תהליך ההגדרה הכללי שנדרש לכל בקשת הנחיה נתמכת שרוצים לשלוח.

שלב 1: הגדרת Chrome ו-Prompt API להסקת מסקנות במכשיר

  1. חשוב לוודא שאתם משתמשים בגרסה עדכנית של Chrome. עדכון בכתובת chrome://settings/help.
    הסקת מסקנות במכשיר זמינה מ-Chrome גרסה 139 ואילך.

  2. כדי להפעיל את המודל המולטימודאלי במכשיר, מגדירים את הדגל הבא לערך Enabled:

    • chrome://flags/#prompt-api-for-gemini-nano-multimodal-input

  3. מפעילים מחדש את Chrome.

  4. (אופציונלי) מורידים את המודל במכשיר לפני הבקשה הראשונה.

    ממשק ה-API של ההנחיות מוטמע ב-Chrome, אבל המודל במכשיר לא זמין כברירת מחדל. אם עדיין לא הורדתם את המודל לפני הבקשה הראשונה להסקת מסקנות במכשיר, הבקשה תתחיל אוטומטית את הורדת המודל ברקע.

שלב 2: הגדרת פרויקט Firebase וקישור האפליקציה ל-Firebase

  1. נכנסים אל Firebaseהמסוף ובוחרים את הפרויקט ב-Firebase.

  2. במסוף Firebase, עוברים לדף Firebase AI Logic.

  3. לוחצים על Get started (תחילת העבודה) כדי להפעיל תהליך עבודה מודרך שיעזור לכם להגדיר את ממשקי ה-API והמשאבים הנדרשים לפרויקט.

  4. מגדירים את הפרויקט לשימוש בספק Gemini API.

    מומלץ להתחיל להשתמש בGemini Developer API. בכל שלב, תמיד אפשר להגדיר את Vertex AI Gemini API (ואת הדרישה שלו לחיוב).

    במקרה של Gemini Developer API, במסוף יופעלו ממשקי ה-API הנדרשים וייווצר מפתח API ‏Gemini בפרויקט.
    אל תוסיפו את Geminiמפתח ה-API הזה לבסיס הקוד של האפליקציה. מידע נוסף

  5. אם מופיעה בקשה בתהליך העבודה במסוף, פועלים לפי ההוראות במסך כדי לרשום את האפליקציה ולקשר אותה ל-Firebase.

  6. כדי להוסיף את ה-SDK לאפליקציה, ממשיכים לשלב הבא במדריך הזה.

שלב 3: הוספת ה-SDK

הספרייה של Firebase מספקת גישה לממשקי ה-API לאינטראקציה עם מודלים גנרטיביים. הספרייה כלולה כחלק מ-Firebase JavaScript SDK לאינטרנט.

  1. מתקינים את Firebase JS SDK לאינטרנט באמצעות npm:

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

שלב 4: הפעלת השירות ויצירת מופע של מודל

לוחצים על הספק Gemini API כדי לראות את התוכן והקוד הספציפיים לספק בדף הזה.

לפני ששולחים למודל בקשת הנחיה, צריך להגדיר את הדברים הבאים.

  1. מאתחלים את השירות עבור ספק ה-API שבחרתם.

  2. יוצרים מכונת GenerativeModel. חשוב לבצע את הפעולות הבאות:

    1. הפעלת הפונקציה getGenerativeModel אחרי או במהלך אינטראקציה של משתמש קצה (למשל, לחיצה על לחצן). זוהי דרישה מוקדמת לשימוש ב-inferenceMode.

    2. מגדירים את mode לאחד מהערכים הבאים:

      • ‫PREFER_ON_DEVICE: שימוש במודל במכשיר אם הוא זמין, אחרת מעבר למודל שמתארח בענן.

      • ‫ONLY_ON_DEVICE: שימוש במודל במכשיר אם הוא זמין, אחרת הפעלת חריגה.

      • ‫PREFER_IN_CLOUD: אם המודל מתארח בענן, צריך להשתמש בו. אחרת, המערכת תעבור למודל במכשיר.

      • ‫ONLY_IN_CLOUD: אם המודל מתארח בענן, צריך להשתמש בו. אחרת, צריך להפעיל חריגה.

import { initializeApp } from "firebase/app";
import { getAI, getGenerativeModel, GoogleAIBackend, InferenceMode } 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
// Call `getGenerativeModel` after or on an end-user interaction
// Set the mode (for example, use the on-device model if it's available)
const model = getGenerativeModel(ai, { mode: InferenceMode.PREFER_ON_DEVICE });

שלב 5: שליחת בקשת הנחיה למודל

בקטע הזה מוסבר איך לשלוח סוגים שונים של קלט כדי ליצור סוגים שונים של פלט, כולל:

אם רוצים ליצור פלט מובנה (כמו JSON או enums), צריך להשתמש באחת מהדוגמאות הבאות של 'יצירת טקסט' וגם להגדיר את המודל כך שיגיב בהתאם לסכימה שסופקה.

יצירת טקסט מקלט טקסט בלבד

לפני שמנסים את הדוגמה הזו, חשוב לוודא שסיימתם את הקטע תחילת העבודה במדריך הזה.

אתם יכולים להשתמש ב-generateContent() כדי ליצור טקסט מהנחיה שמכילה טקסט:

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

שימו לב ש-Firebase AI Logic תומך גם בסטרימינג של תשובות טקסט באמצעות generateContentStream (במקום generateContent).

יצירת טקסט מקלט של טקסט ותמונה (מולטי-מודאלי)

לפני שמנסים את הדוגמה הזו, חשוב לוודא שסיימתם את הקטע תחילת העבודה במדריך הזה.

אתם יכולים להשתמש ב-generateContent() כדי ליצור טקסט מהנחיה שמכילה קובצי טקסט ותמונות. לשם כך, צריך לספק את mimeType של כל קובץ קלט ואת הקובץ עצמו.

סוגי התמונות הנתמכים כקלט להסקת מסקנות במכשיר הם PNG ו-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();

שימו לב ש-Firebase AI Logic תומך גם בסטרימינג של תשובות טקסט באמצעות generateContentStream (במקום generateContent).

איך מאפשרים למשתמשי קצה לנסות את התכונה

כדי שמשתמשי קצה יוכלו לנסות את התכונה באפליקציה שלכם, אתם צריכים להירשם לניסויי מקור ב-Chrome. שימו לב שגרסאות הניסיון האלה מוגבלות בזמן ובשימוש.

  1. נרשמים לגרסת המקור לניסיון של Prompt API ב-Chrome. יינתן לכם טוקן.

  2. צריך לספק את האסימון בכל דף אינטרנט שרוצים להפעיל בו את תכונת הניסיון. אפשר לבחור באחת מהאפשרויות הבאות:

    • מעבירים את הטוקן כמטא תג בתג <head>: <meta http-equiv="origin-trial" content="TOKEN">

    • מעבירים את הטוקן ככותרת HTTP: Origin-Trial: TOKEN

    • מספקים את הטוקן באמצעות תוכנה.

מה עוד אפשר לעשות?

בקטע הזה נסביר איך להגדיר מצב הסקה, לבטל את מודל ברירת המחדל לגיבוי שמתארח בענן ולהשתמש בהגדרת המודל כדי לשלוט בתשובות (למשל, ליצור פלט מובנה).

הגדרת מצב הסקה

בדוגמאות בהגדרה הכללית נעשה שימוש במצב PREFER_ON_DEVICE, אבל זה רק אחד מארבעת מצבי ההסקה הזמינים.

  • ‫PREFER_ON_DEVICE: שימוש במודל במכשיר אם הוא זמין, אחרת מעבר למודל שמתארח בענן.

    const model = getGenerativeModel(ai, { mode: InferenceMode.PREFER_ON_DEVICE });

  • ‫ONLY_ON_DEVICE: שימוש במודל במכשיר אם הוא זמין, אחרת הפעלת חריגה.

    const model = getGenerativeModel(ai, { mode: InferenceMode.ONLY_ON_DEVICE });

  • ‫PREFER_IN_CLOUD: אם המודל מתארח בענן, צריך להשתמש בו. אחרת, המערכת תעבור למודל במכשיר.

    const model = getGenerativeModel(ai, { mode: InferenceMode.PREFER_IN_CLOUD });

  • ‫ONLY_IN_CLOUD: אם המודל מתארח בענן, צריך להשתמש בו. אחרת, צריך להפעיל חריגה.

    const model = getGenerativeModel(ai, { mode: InferenceMode.ONLY_IN_CLOUD });

קביעה אם נעשה שימוש בהסקת מסקנות במכשיר או בענן

אם משתמשים במצבי ההסקה PREFER_ON_DEVICE או PREFER_IN_CLOUD, כדאי לדעת באיזה מצב נעשה שימוש בבקשות מסוימות. המידע הזה מסופק על ידי המאפיין inferenceSource של כל תגובה (זמין החל מ-JS SDK v12.5.0).

כשניגשים למאפיין הזה, הערך שמוחזר יהיה ON_DEVICE או IN_CLOUD.

// ...

console.log('You used: ' + result.response.inferenceSource);

console.log(result.response.text());

שינוי מודל ברירת המחדל של הגיבוי

מודל ברירת המחדל שמתארח בענן הוא gemini-2.5-flash-lite (החל מ-JS SDK v12.8.0).

המודל הזה הוא מודל חלופי שמתארח בענן כשמשתמשים במצב PREFER_ON_DEVICE. זה גם המודל שמוגדר כברירת מחדל כשמשתמשים במצב ONLY_IN_CLOUD או במצב PREFER_IN_CLOUD.

אפשר להשתמש באפשרות ההגדרה inCloudParams כדי לציין מודל חלופי שמתארח בענן כברירת מחדל.

const model = getGenerativeModel(ai, {
  mode: InferenceMode.INFERENCE_MODE,
  inCloudParams: {
    model: "GEMINI_MODEL_NAME"
  }
});

שמות המודלים של Gemini

שימוש בהגדרות המודל כדי לשלוט בתשובות

בכל בקשה למודל, אפשר לשלוח הגדרת מודל כדי לשלוט באופן שבו המודל יוצר תשובה. מודלים שמארחים בענן ומודלים במכשיר מציעים אפשרויות שונות להגדרה.

ההגדרה נשמרת למשך מחזור החיים של המופע. אם רוצים להשתמש בהגדרה אחרת, צריך ליצור מופע חדש של GenerativeModel עם ההגדרה הזו.

הגדרת מודל שמתארח בענן

משתמשים באפשרות inCloudParams כדי להגדיר מודל Gemini שמתארח בענן. מידע על הפרמטרים הזמינים

const model = getGenerativeModel(ai, {
  mode: InferenceMode.INFERENCE_MODE,
  inCloudParams: {
    model: "GEMINI_MODEL_NAME"
    temperature: 0.8,
    topK: 10
  }
});

הגדרת מודל במכשיר

שימו לב: כדי להסיק מסקנות באמצעות מודל במכשיר, נעשה שימוש ב-Prompt API מ-Chrome.

משתמשים באפשרות onDeviceParams כדי להגדיר מודל במכשיר. מידע על הפרמטרים הזמינים

const model = getGenerativeModel(ai, {
  mode: InferenceMode.INFERENCE_MODE,
  onDeviceParams: {
    createOptions: {
      temperature: 0.8,
      topK: 8
    }
  }
});

הגדרת הפלט המובנה (כמו JSON)

אפשר ליצור פלט מובנה (כמו JSON ו-enums) להסקת מסקנות באמצעות מודלים שמתארחים בענן ומודלים שפועלים במכשיר.

כדי להגדיר את המודל כך שיגיב עם פלט מובנה, צריך להשתמש ב-inCloudParams וב-onDeviceParams. במצבים האחרים, משתמשים רק בתצורה הרלוונטית.

  • בשדה inCloudParams: מציינים את responseMimeType המתאים (בדוגמה הזו, application/json) ואת responseSchema שרוצים שהמודל ישתמש בו.

  • במקרה של onDeviceParams: מציינים את responseConstraint שרוצים שהמודל ישתמש בו.

פלט JSON

בדוגמה הבאה מותאמת דוגמה כללית לפלט JSON להסקת מסקנות היברידית:

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: InferenceMode.INFERENCE_MODE,
  inCloudParams: {
    model: "gemini-2.5-flash"
    generationConfig: {
      responseMimeType: "application/json",
      responseSchema: jsonSchema
    },
  }
  onDeviceParams: {
    promptOptions: {
      responseConstraint: jsonSchema
    }
  }
});
פלט של טיפוסים בני מנייה (enum)

כמו בדוגמה הקודמת, אבל עם התאמה של התיעוד בנושא פלט enum להסקת מסקנות היברידית:

// ...

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

const model = getGenerativeModel(ai, {

// ...

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

// ...
});

// ...

תכונות שעדיין לא זמינות להסקת מסקנות במכשיר

בגרסה הניסיונית הזו, לא כל היכולות של Web SDK זמינות להסקת מסקנות במכשיר. התכונות הבאות עדיין לא נתמכות בהסקת מסקנות במכשיר (אבל הן בדרך כלל זמינות להסקת מסקנות מבוססת-ענן).

  • יצירת טקסט מקבצים של תמונות בפורמטים שאינם JPEG ו-PNG

    • אפשר לעבור למודל שמתארח בענן, אבל במצב ONLY_ON_DEVICE תוצג שגיאה.

  • יצירת טקסט מקלט, מסרטונים וממסמכים (כמו קובצי PDF)

    • אפשר לעבור למודל שמתארח בענן, אבל במצב ONLY_ON_DEVICE תוצג שגיאה.

  • יצירת תמונות באמצעות מודלים של Gemini או Imagen

    • אפשר לעבור למודל שמתארח בענן, אבל במצב ONLY_ON_DEVICE תוצג שגיאה.

  • העברת קבצים באמצעות כתובות URL בבקשות מולטימודאליות. צריך לספק קבצים כנתונים מוטבעים למודלים במכשיר.

  • שיחה עם זיכרון

    • אפשר לעבור למודל שמתארח בענן, אבל במצב ONLY_ON_DEVICE תוצג שגיאה.

  • שידור דו-כיווני עם Gemini Live API

  • אספקת כלים למודל כדי לעזור לו ליצור את התשובה (כמו קריאה לפונקציה, הפעלת קוד, הקשר של כתובת URL ועיגון באמצעות חיפוש Google)

  • ספירת טוקנים

    • תמיד מחזירה שגיאה. המספר יהיה שונה בין מודלים שמארחים בענן לבין מודלים שפועלים במכשיר, ולכן אין מעבר אינטואיטיבי למודל חלופי.

  • מעקב אחרי AI במסוף Firebase להסקת מסקנות במכשיר.

    • שימו לב שאפשר לעקוב אחרי כל מסקנה שמתקבלת באמצעות המודלים שמארחים בענן, בדיוק כמו אחרי מסקנות אחרות שמתקבלות באמצעות Firebase AI Logic client SDK for Web.


רוצה לספר לנו על חוויית השימוש ב-Firebase AI Logic?