Создавайте гибридные решения с использованием моделей на устройствах и в облаке


Создавайте приложения и функции на базе ИИ с помощью гибридного вывода с помощью Firebase AI Logic . Гибридный вывод позволяет выполнять вывод с использованием моделей на устройстве (при их наличии) и легко переходить к моделям, размещенным в облаке, в противном случае.

В этом выпуске доступен гибридный вывод с использованием клиентского SDK Firebase AI Logic для веб-сайтов с поддержкой вывода на устройстве для Chrome на настольных компьютерах.

Перейти к примерам кода

Рекомендуемые варианты использования и поддерживаемые возможности

Рекомендуемые варианты использования:

  • Использование модели на устройстве для вывода результатов:

    • Повышенная конфиденциальность
    • Местный контекст
    • Вывод бесплатно
    • Оффлайн функциональность

  • Использование гибридной функциональности обеспечивает:

    • Охватите 100% своей аудитории независимо от доступности модели на устройстве

Поддерживаемые возможности и функции для вывода на устройстве:

  • Однократная генерация контента, потоковая и непотоковая передача
  • Генерация текста из текстового ввода
  • Генерация текста из входных данных текста и изображения, в частности, из входных типов изображений JPEG и PNG
  • Генерация структурированного вывода, включая JSON и перечисления

Начать

В этом руководстве показано, как начать использовать Firebase AI Logic SDK for Web для выполнения гибридного вывода.

Вывод с использованием модели на устройстве использует API Prompt из Chrome ; тогда как вывод с использованием модели, размещенной в облаке, использует выбранного вами поставщика API Gemini (либо API Gemini Developer , либо API Vertex AI Gemini ).

Шаг 1 : Настройте Chrome и API Prompt для вывода данных на устройстве

  1. Загрузите последнюю версию Chrome Beta .

    Вывод на устройстве доступен в Chrome v138 и более поздних версиях.

  2. Включите Prompt API для вашего экземпляра Chrome, установив следующие флаги:

    • chrome://flags/#optimization-guide-on-device-model : установите значение «Включено» .
    • chrome://flags/#prompt-api-for-gemini-nano : Установите значение «Включено» .

    Подробнее об использовании API на локальном хосте читайте в документации Chrome. При желании вы можете присоединиться к программе раннего ознакомления Chrome (EPP) и оставить отзыв.

  3. Включите многомодальную модель на устройстве, установив следующий флаг:

    • chrome://flags/#prompt-api-for-gemini-nano-multimodal-input : Установите значение «Включено» .

  4. Проверьте API локально:

    1. Перезапустите Chrome.

    2. Откройте Инструменты разработчика > Консоль .

    3. Выполните следующее:

      await LanguageModel.availability();

    4. Убедитесь, что вывод available , downloading или downloadable .

    5. Если выходные данные downloadable , можно начать загрузку модели, выполнив await LanguageModel.create(); ;. В противном случае первый запрос на вывод на устройстве запустит загрузку модели в фоновом режиме, что может занять несколько минут.

Шаг 2 : Настройте проект Firebase и подключите свое приложение к Firebase.

  1. Войдите в консоль Firebase и выберите свой проект Firebase.

    Если у вас еще нет проекта Firebase, нажмите «Создать проект» , а затем воспользуйтесь одним из следующих вариантов:

    • Вариант 1 : создайте совершенно новый проект Firebase (и его базовый проект Google Cloud автоматически), введя имя нового проекта на первом этапе рабочего процесса «Создание проекта».

    • Вариант 2 : «Добавить Firebase» в существующий проект Google Cloud , выбрав имя проекта Google Cloud в раскрывающемся меню на первом этапе рабочего процесса «Создание проекта».

    Обратите внимание, что при появлении соответствующего запроса вам не нужно настраивать Google Analytics для использования Firebase AI Logic SDK.

  2. В консоли Firebase перейдите на страницу Firebase AI Logic .

  3. Нажмите «Начать» , чтобы запустить пошаговый рабочий процесс, который поможет вам настроить необходимые API и ресурсы для вашего проекта.

  4. Выберите поставщика Gemini API , который вы хотите использовать с Firebase AI Logic SDK. Для начинающих пользователей рекомендуется использовать Gemini Developer API . При желании вы всегда сможете добавить биллинг или настроить Vertex AI Gemini API позже.

    • API разработчика Gemini — оплата необязательна (доступно в бесплатном тарифном плане Spark, при желании можно перейти на более поздний вариант)
      Консоль включит необходимые API и создаст ключ API Gemini в вашем проекте.
      Не добавляйте этот ключ API Gemini в кодовую базу вашего приложения. Подробнее.

    • Vertex AI Gemini API — требуется выставление счетов (требуется тарифный план Blaze с оплатой по мере использования)
      Консоль поможет вам настроить биллинг и включить необходимые API в вашем проекте.

  5. При появлении соответствующего запроса в рабочем процессе консоли следуйте инструкциям на экране, чтобы зарегистрировать свое приложение и подключить его к Firebase.

  6. Перейдите к следующему шагу этого руководства, чтобы добавить SDK в свое приложение.

Шаг 3 : Добавьте SDK

Библиотека Firebase предоставляет доступ к API для взаимодействия с генеративными моделями. Она входит в состав Firebase JavaScript SDK for Web.

  1. Установите Firebase JS SDK для Web с помощью npm:

    npm install --save-exact firebase@eap-ai-hybridinference

    Гибридная функция выпущена под другим тегом npm, поэтому обязательно включите ее в команду установки.

    Теги реализованы как версии патчей, поэтому флаг --save-exact сообщает NPM не выполнять автоматическое обновление при появлении новой, возможно, не связанной версии.

  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 : Инициализация службы и создание экземпляра модели

Щелкните своего поставщика API Gemini , чтобы просмотреть специфичный для этого поставщика контент и код на этой странице.

Перед отправкой запроса модели Gemini инициализируйте службу для выбранного вами поставщика API и создайте экземпляр GenerativeModel .

Установите один из mode :

  • prefer_on_device : настраивает SDK на использование модели на устройстве, если она доступна, или на возврат к модели, размещенной в облаке.

  • only_on_device : настраивает SDK на использование модели на устройстве или выдачу исключения.

  • only_in_cloud : Настраивает SDK так, чтобы он никогда не использовал модель на устройстве.

По умолчанию при использовании prefer_on_device или only_in_cloud облачной моделью является gemini-2.0-flash-lite , но вы можете переопределить модель по умолчанию . 

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

Отправьте оперативный запрос модели

В этом разделе приведены примеры того, как отправлять различные типы входных данных для генерации различных типов выходных данных, включая:

Если вы хотите сгенерировать структурированный вывод (типа JSON или перечислений), то используйте один из следующих примеров «генерации текста» и дополнительно настройте модель для ответа в соответствии с предоставленной схемой .

Генерация текста из введенных данных

Прежде чем приступить к работе с этим образцом, убедитесь, что вы ознакомились с разделом « Начало работы» данного руководства.

Вы можете использовать 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();

Генерация текста из текстово-изображенного (мультимодального) ввода

Прежде чем приступить к работе с этим образцом, убедитесь, что вы ознакомились с разделом « Начало работы» данного руководства.

Вы можете использовать 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();

Что еще вы можете сделать?

В дополнение к приведенным выше примерам вы также можете использовать альтернативные режимы вывода , переопределять резервную модель по умолчанию и использовать конфигурацию модели для управления ответами .

Используйте альтернативные режимы вывода

В примерах выше использовался режим prefer_on_device для настройки SDK на использование модели на устройстве (при её наличии) или переход к модели, размещённой в облаке. SDK предлагает два альтернативных режима вывода : only_on_device и only_in_cloud .

  • Используйте режим only_on_device , чтобы SDK мог использовать только модель, установленную на устройстве. В такой конфигурации API выдаст ошибку, если модель, установленная на устройстве, недоступна.

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

  • Используйте режим only_in_cloud , чтобы SDK мог использовать только модель, размещенную в облаке.

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

Переопределить резервную модель по умолчанию

При использовании режима prefer_on_device SDK будет использовать модель, размещённую в облаке, если модель, размещённая на устройстве, недоступна. Резервная модель, размещённая в облаке по умолчанию, — gemini-2.0-flash-lite . Эта модель, размещённая в облаке, также используется по умолчанию при использовании режима only_in_cloud .

Вы можете использовать параметр конфигурации inCloudParams , чтобы указать альтернативную модель размещения в облаке по умолчанию: 

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

Найдите названия всех поддерживаемых моделей Gemini .

Используйте конфигурацию модели для управления ответами

В каждом запросе к модели вы можете отправлять конфигурацию модели, чтобы контролировать её генерацию ответа. Модели, размещённые в облаке, и модели, размещённые на устройстве, предлагают различные варианты конфигурации.

Конфигурация сохраняется на протяжении всего жизненного цикла экземпляра. Если вы хотите использовать другую конфигурацию, создайте новый экземпляр GenerativeModel с этой конфигурацией.

Настройте конфигурацию для модели, размещенной в облаке

Используйте параметр inCloudParams для настройки модели Gemini, размещенной в облаке. Узнайте о доступных параметрах . 

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

Настройте конфигурацию для модели на устройстве

Обратите внимание, что для вывода с использованием модели на устройстве используется API Prompt от Chrome .

Используйте параметр onDeviceParams для настройки модели на устройстве. Узнайте о доступных параметрах . 

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

Настройте конфигурацию для структурированного вывода

Поддерживается генерация структурированного вывода (вроде JSON и перечислений) для вывода с использованием как облачных, так и локальных моделей.

Для гибридного вывода используйте как 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: 'prefer_on_device',
  inCloudParams: {
    model: "gemini-2.5-flash"
    generationConfig: {
      responseMimeType: "application/json",
      responseSchema: jsonSchema
    },
  }
  onDeviceParams: {
    promptOptions: {
      responseConstraint: jsonSchema
    }
  }
});
Выход 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

    • Обратите внимание, что это не поддерживается клиентским SDK Firebase AI Logic для Web даже для моделей, размещенных в облаке .

  • Использование «инструментов», включая вызов функций и привязку к Google Search

    • Вскоре!

  • Подсчет токенов

    • Всегда выдаёт ошибку. Количество будет разным для моделей, размещённых в облаке и на устройстве, поэтому интуитивно понятного способа отката не предусмотрено.

  • Мониторинг ИИ в консоли Firebase для получения выводов на устройстве.

    • Обратите внимание, что любой вывод с использованием размещенных в облаке моделей можно отслеживать так же, как и любой другой вывод с использованием клиентского SDK Firebase AI Logic для Web.


Оставьте отзыв о своем опыте работы с Firebase AI Logic