Интеграция Firebase в FlutterFlow предоставляет простой способ улучшить ваше приложение с помощью мощных функций, таких как аутентификация пользователей, облачное хранилище, базы данных в реальном времени и многое другое. Это руководство поможет вам интегрировать Firebase с FlutterFlow, позволяя легко создавать функциональные и масштабируемые приложения.
Создание нового проекта Firebase через FlutterFlow
FlutterFlow позволяет автоматически создать проект Firebase непосредственно из конструктора с помощью быстрого процесса в три шага.
Шаг 1: Настройте проект
Перейдите в Настройки и Интеграции > Настройка проекта > Firebase в FlutterFlow, чтобы начать.
Шаг 2: Выберите регион
Нажмите + Создать проект. Откроется всплывающее окно, в котором вы сможете подтвердить название проекта и выбрать регион Firebase, который лучше всего обслуживает ваших пользователей.
Шаг 3: Подключите учетную запись Google
Выберите Создать или Войти через Google, чтобы связать вашу учетную запись Firebase. Если будет запрошен доступ, вам нужно предоставить его от имени ‘flutterflow.io’, чтобы иметь возможность создавать и настраивать проект Firebase от вашего имени. Здесь можно выбрать Выбрать все и нажать Продолжить.
Как только процесс запущен, FlutterFlow самостоятельно завершит создание проекта в фоновом режиме.
Вот краткое видео:
Как только процесс завершится, вы увидите следующее представление в панели настроек Firebase.
Включение аутентификации Firebase
Если вы хотите использовать аутентификацию Firebase в вашем приложении или в менеджере контента Firebase, вам нужно включить аутентификацию в консоли Firebase и разрешить вход через ‘Email/Password’.
Включение Firebase Storage
Если вы планируете использовать Firebase Storage в вашем приложении, нажмите на Включить Storage на Firebase и активируйте его в консоли Firebase.
Скачайте конфигурационные файлы Firebase
Конфигурационные файлы необходимы для подключения к Firebase. Они содержат различные настройки и ключи, которые позволяют вашему проекту взаимодействовать с сервисами Firebase. Для их генерации нажмите на Автоматически сгенерировать конфигурационные файлы и затем на Генерировать файлы.
Подключение существующего проекта Firebase вручную
Если у вас уже есть проект Firebase и вы хотите подключить его к вашему текущему проекту в FlutterFlow, перейдите в Настройки и Интеграции > Настройка проекта > Firebase и нажмите на Мастер настройки Firebase. Откроется всплывающее окно. Следуйте следующим шагам:
Настройка Firebase
В диалоговом окне прокрутите вниз до Настройка Firebase, отметьте этот пункт и нажмите Следующий шаг. Откроется вторая страница диалога. Прежде чем заполнить дополнительные данные, вам нужно разрешить FlutterFlow доступ к вашему проекту Firebase. Следующая секция расскажет, как это сделать.
Разрешите доступ FlutterFlow к вашему проекту
-
- Перейдите в консоль Firebase вашего существующего проекта, откройте меню слева и выберите Настройки проекта -> Пользователи и права доступа.
- Нажмите Добавить участника в верхнем правом углу.
- Добавьте firebase@flutterflow.io как «Редактор» для вашего проекта и выберите Готово. Затем нажмите Добавить участника.
- На той же странице (т.е. Пользователи и права доступа) выберите Расширенные настройки прав доступа (маленький синий текст под таблицей). Это откроет консоль Google Cloud в новом окне браузера.
- Найдите строку с firebase@flutterflow.io и выберите Редактировать участника (значок карандаша справа).
- Выберите + Добавить еще одну роль.
- В разделе Выберите роль найдите Пользователь учетной записи сервиса (возможно, нужно прокрутить вниз). Выберите Пользователь учетной записи сервиса.
- Выберите + Добавить еще одну роль снова. В разделе Выберите роль найдите Администратор функций Cloud. Выберите Администратор функций Cloud.
Подключение и автогенерация файлов
- В консоли Firebase вашего проекта перейдите в меню слева и выберите Настройки проекта.
- Найдите ID проекта, щелкните правой кнопкой мыши и скопируйте его.
- Вернитесь в FlutterFlow, введите ваш ID проекта Firebase в диалоговом окне и нажмите Подключить. После успешного подключения появится зеленая галочка.
- В разделе Конфигурационные файлы выберите Автоматически сгенерировать файлы и затем нажмите Генерировать файлы.
Подключение Firebase при создании нового проекта FlutterFlow
Если вы знаете, что будете интегрировать Firebase при создании проекта, выполните следующие действия:
Шаг 1: Создайте новый проект и включите Firebase
Сначала создайте новый проект, при этом оставьте включенным пункт Настройка Firebase и нажмите Следующий шаг.
Шаг 2: Подключение к Firebase
Если вы хотите, чтобы FlutterFlow создал для вас проект Firebase, нажмите «+ Создать проект» и следуйте связанным шагам. В качестве альтернативы, если вы хотите вручную подключить существующий проект Firebase, следуйте инструкциям здесь.
Шаг 3: Включение аутентификации
Включите Включить аутентификацию, чтобы позволить пользователям входить в ваше приложение с помощью различных методов, включая email и пароль, социальные сети или номер телефона.
Примечание: этот шаг только включает аутентификацию. Вам нужно будет выполнить дополнительную настройку, чтобы реализовать логику аутентификации позже.
Включение Firestore для доступа к базе данных
Если вы планируете использовать Firestore Database как бэкенд, выполните следующие шаги для включения Firestore. Это позволит вам создавать коллекции и добавлять документы непосредственно из FlutterFlow.
Для настройки Firestore Database:
- В консоли Firebase вашего проекта перейдите в меню слева. В разделе Build выберите Firestore Database и затем выберите Создать базу данных (отмечено желтым на скриншоте).
- Далее вам нужно будет настроить правила безопасности Firebase. Чтобы начать быстро, выберите Начать в тестовом режиме и нажмите Далее.
- Затем вам нужно выбрать место для хранения данных Firestore. В выпадающем списке выберите местоположение и нажмите Включить.
После завершения процесса вы окажетесь на панели управления Cloud Firestore и сможете сразу начать создание коллекций и документов!
Добавление индексов
Развертывание индексов необходимо для выполнения некоторых запросов в базе данных Firestore. Firestore автоматически добавляет индексы для самых базовых запросов. Однако при использовании фильтрации и сортировки одновременно при запросе коллекции необходим индекс, и будет выдано предупреждение о необходимости его добавить.
Мы создаем индексы за вас. Все, что вам нужно сделать, это развернуть их в вашей базе данных Firestore.
Вот шаги для развертывания индексов.
- Нажмите на Firestore в меню навигации (слева на экране).
- Переключитесь на вкладку Настройки.
- Прокрутите вниз до секции Firestore Indexes и нажмите Развернуть.
Включение биллинга для доступа к Cloud Functions
Если вы хотите развернуть функции (например, для оплаты через Braintree или отправки Push-уведомлений), вам нужно включить биллинг для вашего проекта Firebase. Следуйте этим шагам для включения биллинга:
- В консоли Firebase вашего проекта перейдите в меню слева. В разделе Build выберите Functions и затем выберите Обновить проект.
- Нажмите Купить. Если это ваш первый раз при включении биллинга, вы будете перенаправлены на новую страницу для предоставления информации о платеже. В противном случае вы сможете установить бюджет для проекта. Подробности можно посмотреть по этой ссылке.
