Перейти к основному содержимому

Подключение к Firebase

Интеграция Firebase в FlutterFlow обеспечивает простой способ расширения ваших приложений мощными функциями, такими как аутентификация пользователей, облачное хранилище, базы данных в реальном времени и многое другое. Это руководство по настройке поможет вам интегрировать Firebase с FlutterFlow, что позволит легко создавать функциональные и масштабируемые приложения.

Создание нового проекта Firebase из FlutterFlow

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

Шаг 1: Настройка вашего проекта

Перейдите в Settings & Integration > Project Setup > Firebase в FlutterFlow, чтобы начать.

Шаг 2: Выбор региона

Нажмите + Создать проект. Появится всплывающее окно, где вы можете подтвердить имя проекта и выбрать регион Firebase, который лучше всего подходит для ваших пользователей.

Шаг 3: Подключение вашей учетной записи Google

Выберите Создать или Войти с помощью Google, чтобы связать вашу учетную запись Firebase. При запросе необходимо предоставить доступ, запрошенный от 'flutterflow.io', чтобы иметь возможность создавать и настраивать проект Firebase от вашего имени. Здесь вы можете выбрать Выбрать все и нажать Продолжить.

Alt text

После инициации FlutterFlow обработает остальную часть создания проекта в фоновом режиме.

Вот быстрый обзор:

После завершения процесса вы увидите следующий вид на панели настроек Firebase.

Проект Firebase создан

Включите аутентификацию Firebase

Если вы хотите использовать аутентификацию Firebase в вашем приложении или менеджер контента Firebase, вы должны включить аутентификацию в консоли Firebase и разрешить вход по 'Электронной почте/Паролю'.

Включите хранилище Firebase

Если вы планируете использовать хранилище Firebase в вашем приложении, нажмите Включить хранилище в Firebase и включите его в консоли Firebase.

Загрузите файлы конфигурации Firebase

Файлы конфигурации необходимы при подключении к Firebase. Они содержат различные настройки и ключи, позволяющие вашему проекту общаться с сервисами Firebase. Чтобы сгенерировать эти файлы, нажмите Автоматическая генерация файлов конфигурации, а затем нажмите Сгенерировать файлы.

Подключение существующего проекта Firebase вручную

Если у вас уже есть проект Firebase и вы хотите подключить его к вашему текущему проекту FlutterFlow, перейдите в Settings & Integration > Project Setup > Firebase и нажмите на Мастер настройки Firebase. Появится диалоговое окно. Следуйте этим шагам:

Настройка Firebase

В диалоге прокрутите вниз до Настройка Firebase, установите эту опцию и нажмите Следующий шаг. Откроется вторая страница диалога. Прежде чем заполнять более подробную информацию, вам нужно разрешить FlutterFlow доступ к вашему проекту Firebase. В следующем разделе будет описан этот процесс.

Разрешите FlutterFlow доступ к вашему проекту

  1. Перейдите в консоль Firebase вашего существующего проекта, перейдите в самое левое меню и выберите Настройки проекта -> Пользователи и разрешения.

  2. Выберите Добавить участника в правом верхнем углу.

  3. Добавьте firebase@flutterflow.io как "Редактор" для вашего проекта и выберите Готово. Затем нажмите Добавить участника. firebase-add-member.png

  4. На той же странице (т.е., Пользователи и разрешения), выберите Расширенные настройки разрешений (небольшой синий текст под таблицей). Это откроет консоль Google Cloud в новом окне браузера.

Шаги 2, 3 и 4
  1. Найдите строку с firebase@flutterflow.io и выберите Изменить главного пользователя (карандаш справа от строки).
На странице консоли Google Cloud
  1. Выберите + Добавить другую роль.

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

При выборе роли и поиске Пользователь службы
  1. Выберите + Добавить другую роль снова. Под Выбранные роль ищите Администратор Cloud Functions. Выберите Администратор Cloud Functions.
к сведению

Примечание: Опция для добавления администратора Cloud Functions может отображаться только при наличии плана Firebase Blaze. Кроме того, вам может потребоваться сначала включить функции обработчики. Разрешения администратора Cloud Functions необходимы для нескольких функций FlutterFlow (например, Push-уведомления). Добавление этого администратора Cloud Functions является необязательным, но если вы этого не сделаете, вы не сможете использовать функции, требующие Cloud Functions.

Подключение и автогенерация файлов

  1. Из панели управления Firebase вашего проекта перейдите в самое левое меню и выберите Настройки проекта.

  2. Под Ваш проект найдите Идентификатор проекта, щелкните правой кнопкой мыши и скопируйте.

  3. Вернитесь в FlutterFlow, введите идентификатор вашего проекта Firebase в диалоговом окне и нажмите Подключить. Зеленая галочка появится после успешного подключения.

  4. В разделе Файлы конфигурации выберите Автогенерация файлов и затем нажмите Сгенерировать файлы.

к сведению

Не закрывайте и не обновляйте страницу во время генерации файлов.

Подключение к Firebase при создании нового проекта FlutterFlow

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

Шаг 1: Создайте новый проект и включите Firebase

Сначала создайте новый проект, и при этом оставьте опцию Настройка Firebase включенной и нажмите Далее.

Alt text

Шаг 2: Подключение к Firebase

Если вы хотите, чтобы FlutterFlow создал проект Firebase для вас, нажмите + Создать проект и следуйте связанным шагам. В противном случае, если вы хотите подключить существующий проект Firebase вручную, пожалуйста, следуйте руководству по подключению здесь.

Шаг 3: Включение аутентификации

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

Примечание: этот шаг только включает аутентификацию. Для выполнения последующей настройки логики аутентификации вам потребуется дополнительная настройка.

Включение аутентификации во время создания проекта

Включение Firestore для доступа к базе данных

Если вы планируете использовать базу данных Firestore в качестве бэкенда, следуйте этим дополнительным шагам для включения Firestore. Это позволит вам создавать коллекции и добавлять документы непосредственно из FlutterFlow.

Для настройки базы данных Firestore:

  1. Из панели управления Firebase вашего проекта перейдите в самое левое меню. Под Построение, выберите База данных Firestore, затем выберите Создать базу данных (обозначено желтым на скриншоте).
Alt text
  1. Затем необходимо установить Правила безопасности Firebase. Чтобы начать быстро, можно выбрать Начать в режиме тестирования и нажать Далее.
Alt text
к сведению

Мы рекомендуем обновить правила безопасности Firebase перед развертыванием вашего приложения. См. эту ссылку для дополнительной информации о правилах безопасности Firestore.

  1. Затем вам потребуется выбрать местоположение, где будут храниться данные Firestore. Из выпадающего списка выберите местоположение и затем выберите Включить. Дополнительную информацию о местоположениях Firebase можно найти по этой ссылке.
Alt text

По завершении вы попадете на панель просмотра Cloud Firestore и сможете сразу начать создавать коллекции и документы!

Добавление индексов

Развертывание индексов необходимо для выполнения определенных запросов в вашей базе данных Firestore. Firestore автоматически добавляет индексы для наиболее простых запросов. Однако при использовании фильтрации и сортировки при запросе коллекции необходимо деплоить индекс, и будет выдано предупреждение о необходимости его добавления.

Мы создаем индексы для вас. Вам нужно только их развернуть в вашу базу данных Firestore.

Вот как развернуть индексы.

  • Нажмите на Firestore в меню навигации (слева на вашем экране).
  • Переключитесь на вкладку Settings.
  • Прокрутите вниз до раздела Индексы Firestore и нажмите на Развернуть.
Обратите внимание

Если вы добавляете фильтрацию/сортировку в запрос или изменяете существующие настройки фильтрации/сортировки, вы должны снова развернуть индексы Firestore.

Включение тарификации для доступа к функциям Cloud Functions

Если вы планируете развертывать функции (например, платежи Braintree, Push-уведомления), вам необходимо включить тарификацию для вашего проекта Firebase. Пожалуйста, следуйте этим шагам для включения тарификации:

  1. Из панели управления Firebase вашего проекта перейдите в самое левое меню. Под Построение, выберите Функции, затем выберите Улучшить проект.

  2. Выберите Приобрести. Если это ваше первое включение тарификации, вы будете перенаправлены на новую страницу для ввода данных вашей платежной информации. В противном случае вы можете установить бюджет проекта. Дополнительную информацию о тарификации Firebase можно найти по этой ссылке.

Alt text