Больше
Как интегрировать генеративный ИИ в ваше Flutter-приложение с использованием Firebase Vertex AI

11min
Введение
Генеративный ИИ быстро становится обычным делом в современных приложениях; он позволяет разработчикам создавать умные и интерактивные интерфейсы. Будь то генерация текста, анализ контента или создание медиа, Firebase Vertex AI предлагает довольно мощный набор инструментов для реализации этих функций в вашем приложении Flutter. В этом руководстве мы покажем вам, как внедрить генеративный ИИ в ваше приложение Flutter, используя пакет firebase_vertexai. К концу этого руководства, по крайней мере, у вас будет работающее приложение, которое может использовать API Gemini для выполнения всех видов задач генеративного ИИ.
Предварительные требования
Чтобы завершить это руководство, вам потребуется:
Аккаунт Firebase и настроенный проект Firebase. Вы можете зарегистрироваться бесплатно на Firebase.
Настроенная среда разработки Flutter на вашем локальном компьютере. Следуйте руководству по установке Flutter, если вы еще не настроили её.
Базовые знания о Firebase и Flutter. Если вы новичок в Firebase, ознакомьтесь с руководством по Firebase для Flutter.
Шаг 1 – Настройка Firebase и Vertex AI
Создайте проект Firebase: Войдите в Консоль Firebase, создайте новый проект и включите необходимые API для Vertex AI.
Включите проверку приложений Firebase: Перейдите в настройки вашего проекта в Firebase и включите проверку приложений Firebase, чтобы убедиться, что все вызовы API поступают из вашего приложения.
Добавьте Firebase в ваше приложение Flutter: Следуйте инструкциям, чтобы подключить ваше приложение Flutter к вашему проекту Firebase. Обычно это включает в себя загрузку файла google-services.json для Android или GoogleService-Info.plist для iOS и размещение его в правильной директории вашего проекта Flutter.
Шаг 2 – Добавление необходимых зависимостей
Откройте ваш pubspec.yaml файл и добавьте следующие зависимости:
YAML
dependencies:
  flutter:
    sdk: flutter
  firebase_core: latest_version
  firebase_vertexai: latest_version
dependencies:
  flutter:
    sdk: flutter
  firebase_core: latest_version
  firebase_vertexai: latest_version
﻿
    2. Запустите flutter pub get для установки зависимостей.
Шаг 3 – Инициализация Firebase и Vertex AI
В lib/main.dart, импортируйте необходимые пакеты Firebase:
Dart
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_vertexai/firebase_vertexai.dart';
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_vertexai/firebase_vertexai.dart';
﻿
    2. Инициализируйте Firebase и Vertex AI в функции main :
Dart
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();

  runApp(MyApp());
}
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();

  runApp(MyApp());
}
﻿
    3. В вашем MyApp виджете создайте функцию для инициализации генеративной модели:
Dart
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Generative AI with Firebase')),
        body: Center(
          child: ElevatedButton(
            onPressed: () async {
              final result = await generateContent();
              print(result);
            },
            child: Text('Generate Content'),
          ),
        ),
      ),
    );
  }

  Future<String> generateContent() async {
    // Initialize the generative model
    final vertexAI = FirebaseVertexAI.instance;
    final generativeModel = vertexAI.getGenerativeModel(
      modelName: 'projects/YOUR_PROJECT_ID/locations/YOUR_LOCATION/models/YOUR_MODEL_NAME',
    );

    // Construct your prompt
    final prompt = VertexAITextPrompt(text: 'Write a story about a magic backpack');

    // Optionally, you can set generation configurations
    final generationConfig = VertexAIGenerationConfig(
      temperature: 0.7,
      responseMimeType: 'application/json',
    );

    // Generate content
    final response = await generativeModel.generateContent(
      prompt: prompt,
      generationConfig: generationConfig,
    );

    return response.generatedText;
  }
}
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Generative AI with Firebase')),
        body: Center(
          child: ElevatedButton(
            onPressed: () async {
              final result = await generateContent();
              print(result);
            },
            child: Text('Generate Content'),
          ),
        ),
      ),
    );
  }

  Future<String> generateContent() async {
    // Initialize the generative model
    final vertexAI = FirebaseVertexAI.instance;
    final generativeModel = vertexAI.getGenerativeModel(
      modelName: 'projects/YOUR_PROJECT_ID/locations/YOUR_LOCATION/models/YOUR_MODEL_NAME',
    );

    // Construct your prompt
    final prompt = VertexAITextPrompt(text: 'Write a story about a magic backpack');

    // Optionally, you can set generation configurations
    final generationConfig = VertexAIGenerationConfig(
      temperature: 0.7,
      responseMimeType: 'application/json',
    );

    // Generate content
    final response = await generativeModel.generateContent(
      prompt: prompt,
      generationConfig: generationConfig,
    );

    return response.generatedText;
  }
}
﻿
Замените 'YOUR_PROJECT_ID', 'YOUR_LOCATION', и 'YOUR_MODEL_NAME' на ваши фактические данные проекта. Функция generateContent создает запрос, отправляет его в модель Vertex AI и возвращает сгенерированный контент.
Шаг 4 – Составление запросов и обработка ответов
Создание пользовательского запроса: Вы можете создавать более сложные запросы, комбинируя различные типы данных (текст, изображения, аудио и т. д.). Например:
Dart
final prompt = VertexAITextPrompt(
  text: 'Summarize the following text: "The history of AI is fascinating..."',
);
final prompt = VertexAITextPrompt(
  text: 'Summarize the following text: "The history of AI is fascinating..."',
);
﻿
    2. Обработка больших файлов: Если ваш запрос включает большие файлы, храните файлы в Firebase Storage и включите URL-адрес Cloud Storage файла в ваш запрос.
Dart
final prompt = VertexAITextPrompt(
  text: 'Analyze the content of this document',
  fileUrl: 'gs://your-bucket-name/your-file.pdf',
);
final prompt = VertexAITextPrompt(
  text: 'Analyze the content of this document',
  fileUrl: 'gs://your-bucket-name/your-file.pdf',
);
﻿
    3. Потоковые ответы: Если вы хотите получать вывод ИИ по мере его появления, вы можете использовать метод generateContentStream :
Dart
await for (final partialResponse in generativeModel.generateContentStream(prompt: prompt)) {
  print(partialResponse.generatedText);
}
await for (final partialResponse in generativeModel.generateContentStream(prompt: prompt)) {
  print(partialResponse.generatedText);
}
﻿
Шаг 5 – Тестирование и развертывание приложения
Запустите ваше приложение с помощью flutter run и протестируйте функции генерации ИИ. Вы должны увидеть сгенерированный контент, напечатанный в консоли.
После того как вы подтвердите, что все работает, вы можете развернуть ваше приложение или продолжить его улучшение с помощью дополнительных функций.
Заключение
В этом учебном пособии вы узнали, как включить генеративный ИИ в ваше приложение Flutter с помощью Firebase Vertex AI Package. Вы можете использовать Gemini для обеспечения отличных возможностей искусственного интеллекта в приложении для генерации текста, анализа данных контента и многих других функций, управляемых ИИ. Благодаря гибкости Firebase Vertex AI вы можете по своему усмотрению изменять ответы ИИ, что делает его идеальным для разработки интеллектуальных и интерактивных приложений.

Смотрите pub.dev для Firebase Vertex AI, FlutterFire и других пакетов Flutter. Удачного кодирования!
Обновлено 23 Jan 2025
Помогла ли вам эта страница?
Как использовать обработку данных в Flutter с использованием List.generate и Back4app
Как использовать Flutter Completers с бэкендом на Back4app