Быстро добавляйте новые функции в свое веб-приложение с помощью расширений Firebase.

1. Введение

Цели

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

Что вы построите

В этой лабораторной работе вы добавите следующие функции в веб-приложение онлайн-торговой площадки:

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

Чему вы научитесь

• Как найти расширения для распространенных случаев использования
• Как установить и настроить расширение в вашем проекте
• Как обслуживать (мониторить, обновлять и удалять) расширения в вашем проекте

Эта практическая работа посвящена расширениям Firebase. Подробную информацию о других продуктах Firebase, упомянутых в этой практической работе, можно найти в документации Firebase и других практических работах .

Что вам понадобится

• Компьютер с установленным современным веб-браузером (рекомендуется Chrome)
• Аккаунт Google

2. Создайте и настройте проект Firebase.

Создать проект Firebase

1. Войдите в консоль Firebase, используя свою учетную запись Google.
2. Нажмите кнопку, чтобы создать новый проект, а затем введите название проекта (например, FriendlyMarket ).
   
3. Нажмите «Продолжить» .
4. При появлении соответствующего запроса ознакомьтесь с условиями Firebase и примите их, а затем нажмите кнопку «Продолжить» .
5. (Необязательно) Включите помощь ИИ в консоли Firebase (так называемая «Gemini в Firebase»).
6. Для этой лабораторной работы вам не понадобится Google Analytics, поэтому отключите опцию Google Analytics.
7. Нажмите «Создать проект» , дождитесь завершения подготовки проекта, а затем нажмите «Продолжить» .

Приложение, которое вы создадите, использует несколько продуктов Firebase, доступных для веб-приложений:

• Аутентификация Firebase для легкой идентификации ваших пользователей
• База данных Firebase Realtime для сохранения структурированных данных в облаке и мгновенного получения уведомлений об обновлении данных
• Облачное хранилище для Firebase для сохранения изображений в облаке

Теперь вы включите и настроите эти продукты Firebase с помощью консоли Firebase.

Обновите свой тарифный план Firebase

Чтобы использовать Firebase Extensions и их базовые облачные сервисы, а также Cloud Storage для Firebase, ваш проект Firebase должен быть включен в тарифный план с оплатой по мере использования (Blaze) , что означает, что он должен быть связан с учетной записью Cloud Billing .

• Для учетной записи Cloud Billing требуется способ оплаты, например кредитная карта.
• Если вы новичок в Firebase и Google Cloud, проверьте, имеете ли вы право на кредит в размере 300 долларов США и бесплатную пробную учетную запись Cloud Billing .
• Если вы выполняете эту практическую работу в рамках мероприятия, узнайте у организатора, доступны ли какие-либо облачные кредиты.

Чтобы обновить свой проект до плана Blaze, выполните следующие действия:

1. В консоли Firebase выберите обновление вашего плана .
2. Выберите тарифный план Blaze. Следуйте инструкциям на экране, чтобы подключить аккаунт Cloud Billing к своему проекту.
   Если вам потребовалось создать учетную запись Cloud Billing в рамках этого обновления, вам может потребоваться вернуться к процессу обновления в консоли Firebase, чтобы завершить обновление.

Включить вход по электронной почте

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

1. В консоли Firebase нажмите «Разработка» на левой панели.
2. Нажмите «Аутентификация» , а затем нажмите вкладку «Способ входа» (или нажмите здесь, чтобы перейти непосредственно на вкладку «Способ входа »).
3. Нажмите «Электронная почта/Пароль» в списке поставщиков входа , установите переключатель «Включить» в положение «Вкл.», а затем нажмите « Сохранить ».

Включить базу данных в реальном времени

Приложение использует базу данных Firebase Realtime для сохранения товаров, выставленных на продажу.

1. На левой панели консоли Firebase разверните «Сборка» и выберите «База данных реального времени» .
2. Нажмите Создать базу данных .
3. Выберите местоположение вашей базы данных, затем нажмите «Далее» .
   Для настоящего приложения вам нужно выбрать местоположение, близкое к вашим пользователям.
4. Нажмите «Начать в тестовом режиме» . Ознакомьтесь с отказом от ответственности о правилах безопасности.
   На следующих этапах этой лабораторной работы вы добавите правила безопасности для защиты своих данных. Не распространяйте и не публикуйте приложение, не добавив правила безопасности для своей базы данных .
5. Нажмите «Создать» .

Установите правила безопасности для вашей базы данных

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

1. В верхней части панели управления Realtime Database выберите вкладку Правила .

2. Скопируйте и вставьте следующий набор правил в поле правил на вкладке «Правила» :

   {
     "rules": {
       ".read": false,
       ".write": false,
         "drafts": {
           ".indexOn": "seller",
           ".read": "auth.uid !== null",
           ".write": "auth.uid !== null"
       },
       "sellers": {
           ".read": "auth.uid !== null",
           ".write": "auth.uid !== null"
       },
         "forsale": {
           ".read": true,
           ".write": "auth.uid !== null"
         }
     }
   }
   

3. Нажмите «Опубликовать» .

Настройка облачного хранилища для Firebase

Приложение использует облачное хранилище Firebase для сохранения изображений продаваемых товаров.

Вот как настроить облачное хранилище для Firebase в вашем проекте Firebase:

1. На левой панели консоли Firebase разверните Сборка , а затем выберите Хранилище .
2. Нажмите « Начать» .
3. Выберите местоположение для контейнера хранения по умолчанию.
   Бакеты в US-WEST1 , US-CENTRAL1 и US-EAST1 могут воспользоваться тарифом «Всегда бесплатно» для Google Cloud Storage. Бакеты во всех остальных регионах следуют тарифам и условиям использования Google Cloud Storage .
4. Нажмите «Начать в тестовом режиме» . Ознакомьтесь с отказом от ответственности о правилах безопасности.
   На следующих этапах этой лабораторной работы вы добавите правила безопасности для защиты своих данных. Не распространяйте и не публикуйте приложение, не добавив правила безопасности для вашего контейнера хранилища .
5. Нажмите «Создать» .

Настройте правила безопасности для вашего хранилища

Теперь вам нужно настроить правила безопасности, необходимые для этого приложения. Эти правила позволяют публиковать новые изображения только авторизованным пользователям, но просматривать изображения для выбранного товара могут все желающие.

1. В верхней части панели управления хранилищем выберите вкладку Правила .

2. Скопируйте и вставьте следующий набор правил в поле правил на вкладке «Правила» :

   rules_version = '2';
   service firebase.storage {
     match /b/{bucket}/o {
       match /friendlymarket/{ImageId} {
         allow read;
         allow write: if request.auth != null;
       }
     }
   }
   

3. Нажмите «Опубликовать» .

3. Запустите пример приложения.

Форк проекта StackBlitz

В этой лабораторной работе вы создадите и развернёте приложение с помощью StackBlitz — онлайн-редактора, в который интегрировано несколько рабочих процессов Firebase. Stackblitz не требует установки программного обеспечения или специальной учётной записи StackBlitz.

StackBlitz позволяет вам делиться проектами с другими. Другие пользователи, у которых есть URL вашего проекта StackBlitz, могут видеть ваш код и создавать ответвления, но не могут редактировать ваш проект StackBlitz.

1. Перейдите по этому URL-адресу для получения начального кода: https://stackblitz.com/edit/friendlymarket-codelab .
2. В верхней части страницы StackBlitz нажмите кнопку Fork .

Теперь у вас есть копия начального кода в вашем собственном проекте StackBlitz. Поскольку вы не вошли в систему, ваша «учётная запись» называется @anonymous , но это нормально. У проекта уникальное имя и уникальный URL-адрес. Все ваши файлы и изменения сохраняются в этом проекте StackBlitz.

Добавьте Firebase Web App в проект

1. В StackBlitz откройте файл src/firebase-config.js . В него нужно добавить объект конфигурации Firebase.
2. Вернувшись в консоль Firebase, перейдите на страницу обзора вашего проекта, нажав «Обзор проекта» в левом верхнем углу.
3. В центре страницы обзора вашего проекта нажмите на значок Интернета. для создания нового веб-приложения Firebase.
4. Зарегистрируйте приложение под именем FriendlyMarket Codelab .
5. Для этой практической работы не устанавливайте флажок « Также настроить хостинг Firebase для этого приложения» . Вместо этого вы будете использовать панель предварительного просмотра StackBlitz.
6. Нажмите «Зарегистрировать приложение» .
7. Скопируйте объект конфигурации Firebase вашего приложения в буфер обмена. Не копируйте теги <script> . Примечание: если вам понадобится найти конфигурацию позже, следуйте инструкциям здесь .

8. Нажмите «Продолжить», чтобы перейти на консоль .

Добавьте конфигурацию вашего проекта в ваше приложение:

1. Вернитесь в StackBlitz и перейдите к файлу src/firebase-config.js .
2. Вставьте фрагмент конфигурации в файл. После этого он должен выглядеть примерно так (но со значениями вашего проекта в объекте конфигурации):

Какова отправная точка этого приложения?

Взгляните на интерактивный предварительный просмотр в правой части экрана StackBlitz:

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

Попробуйте приложение:

1. Войдите, нажав кнопку в верхней части главного экрана. Вы можете использовать поддельный адрес электронной почты, имя и пароль.
2. Нажмите кнопку «Продать что-нибудь» в правом нижнем углу, чтобы создать объявление.
3. В поле «Название» введите Xylophone .
4. В поле «Запрашиваемая цена» введите 50 .
5. В поле «Описание товара» введите следующее: This high quality xylophone can be used to play music.
6. Загрузите это изображение ксилофона на свой компьютер и загрузите его с помощью кнопки ФОТОГРАФИЯ ВАШЕГО ПРЕДМЕТА .

file_download Загрузить изображение

7. После того, как вы заполните все поля и загрузите изображение, нажмите кнопку «Опубликовать» .
8. Найдите новое объявление. Нажмите на товар, чтобы открыть экран с подробной информацией, а затем разверните панель с контактной информацией продавца .
9. Вернитесь в консоль Firebase. В панели управления базой данных вы увидите запись о товаре, который вы разместили в узле forsale . В панели управления хранилищем вы также найдете изображение, загруженное вами в папку friendlymarket .

4. Найдите и установите расширение.

Проблема

Проведя исследование пользователей вашего приложения, вы обнаружили, что большинство пользователей посещают ваш сайт со смартфонов, а не с компьютеров. Однако ваша статистика также показывает, что мобильные пользователи, как правило, покидают ваш сайт («уходят») уже через несколько секунд.

Любопытно, что вы тестируете свой сайт на скорости мобильного соединения. (Узнайте, как это сделать здесь .) Вы обнаруживаете, что изображения загружаются очень долго и вообще не кэшируются в браузере. Эта долгая загрузка происходит при каждом просмотре страницы!

Решение

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

• Сжимайте изображения. Даже мобильные телефоны делают снимки с гораздо более высоким разрешением, чем необходимо для этого приложения. Уменьшение размера файла ускорит загрузку без заметного снижения разрешения в приложении.
• Кэширование . По умолчанию объекты Cloud Storage имеют заголовки, которые сообщают браузерам не кэшировать изображения, что означает, что браузер пользователя будет снова и снова загружать одно и то же изображение! К счастью, эти заголовки можно изменить, чтобы разрешить кэширование. И клиентский Cloud Storage SDK , и Firebase Admin SDK позволяют устанавливать эти заголовки.

Для сжатия изображений вам потребуется либо ограничить качество загружаемых файлов, либо реализовать серверный процесс, изменяющий размер изображений. Рассмотрим компромиссы:

• На стороне клиента . Для обработки на стороне клиента можно просто ограничить размер загружаемых изображений. Это означает, что вам не нужно писать или поддерживать какую-либо новую серверную логику. Однако это также означает, что вашим продавцам придётся разбираться, как изменять размер своих изображений, что является сложным и неинтуитивным препятствием для создания нового объявления.
• На стороне сервера . Если вы используете Cloud Functions для Firebase, вы можете запустить функцию , которая автоматически изменяет размер изображения при загрузке. Это означает, что продавцы могут загружать изображения любого размера (без дополнительных усилий с их стороны), а ваша бэкенд-функция сможет автоматически изменять размер изображения. Для этой функции даже доступен пример !

Похоже, что серверная часть — это выход. Но эта идея всё ещё предполагает клонирование примера , выполнение инструкций по настройке и последующее развёртывание функции с помощью Firebase CLI. Изменение размера изображений — довольно распространённый вариант. Неужели нет более простого решения?

Более простое решение

Вам повезло. Есть более простое решение: расширения Firebase! Давайте посмотрим каталог доступных расширений на сайте Firebase .

Посмотрите-ка! Есть расширение «Изменение размера изображений». Выглядит многообещающе.

Давайте используем это расширение в вашем приложении!

Установить расширение

1. Нажмите «Подробнее» , чтобы узнать больше об этом расширении. В разделе «Что можно настроить » расширение позволяет задать желаемые размеры и даже задать заголовок кэша. Отлично!
2. Нажмите кнопку «Установить в консоли» на странице сведений о расширении . Вы перейдете на страницу консоли Firebase со списком всех ваших проектов.
3. Выберите проект FriendlyMarket , который вы создали для этой лабораторной работы.
4. Следуйте инструкциям на экране, пока не дойдете до шага «Настройка расширения» . В инструкциях будет представлена ​​общая информация о расширении, а также о всех создаваемых им ресурсах и необходимых ролях доступа.
5. В поле заголовка ** Cache-Control ** для изображений с измененным размером введите следующее:

public, max-age=31536000

6. Оставьте остальные параметры по умолчанию.
7. Нажмите Установить расширение .

Пока вы ждете завершения установки...

Установка с помощью интерфейса командной строки Firebase

Если вам удобнее работать с командной строкой, расширения можно устанавливать и управлять ими через Firebase CLI! Просто используйте команду firebase ext , доступную в последней версии CLI. Подробнее см. здесь .

(Необязательно) Узнайте больше о заголовках Cache-Control

Значение заголовка Cache-Control public, max-age=31536000 означает, что изображение будет кэшироваться до 1 года. Подробнее о заголовке Cache-Control см. в этой документации .

Обновить клиентский код

Установленное вами расширение записывает изменённое изображение в тот же контейнер, что и исходное. К имени файла изменённого изображения добавляются заданные параметры. Таким образом, если исходный путь к файлу выглядел как friendlymarket/user1234-car.png , то путь к изменённому изображению будет выглядеть как friendlymarket/user1234-car_200x200.png .

Давайте обновим приложение так, чтобы оно загружало изображения измененного размера вместо полноразмерных.

1. В StackBlitz откройте файл src/firebase-refs.js .
2. Замените существующую функцию getImageRef следующим кодом, чтобы создать ссылку на измененное изображение:

export function getImageRef(storage, imagePath) {
  const xDimension = 200;
  const yDimension = 200;

  // find the '.' in 'file.jpg', 'file.png', etc
  const fileExtensionIndex = imagePath.lastIndexOf('.');

  const pathNameWithoutExtension = imagePath.substring(0, fileExtensionIndex);
  const dimensions = `${xDimension}x${yDimension}`;
  const fileExtension = imagePath.substring(fileExtensionIndex);

  return {
    resized: storage().ref(
      `${pathNameWithoutExtension}_${dimensions}${fileExtension}`
    ),
    original: storage().ref(imagePath)
  };
}

Проверьте это

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

Создайте новый пост, чтобы увидеть расширение в действии:

1. Нажмите «Friendly Market» в верхней панели приложения, чтобы перейти на главный экран.
2. Нажмите кнопку «Продать что-нибудь» в правом нижнем углу приложения, чтобы создать объявление.
3. В поле «Название» введите Coffee .
4. Для запрашиваемой цены введите 1
5. В поле «Описание товара» введите следующее: Selling one cafe latte. It has foam art in the shape of a bear .
6. Загрузите это изображение чашки кофе на свой компьютер и загрузите его с помощью кнопки ФОТО ВАШЕГО ТОВАРА . file_download Загрузить изображение
7. Заполнив все поля и загрузив изображение, нажмите «Опубликовать» . Информация о кофе появится под ксилофоном!
8. На панели функций консоли Firebase откройте вкладку «Журналы» . Вы должны увидеть журналы выполнения функции.

9. Перейдите на панель управления хранилищем , чтобы увидеть как исходное изображение кофе, так и его измененную версию в пути friendlymarket .
10. В панели предварительного просмотра StackBlitz перезагрузите главный экран приложения несколько раз. Вы заметите, что изображение кофе загружается значительно быстрее, чем изображение ксилофона.

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

5. Перенастройте расширение

Проблема

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

Решение

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

Помните каталог расширений Firebase? Возможно, для этой ситуации уже есть решение. Давайте установим расширение Limit Child Nodes , чтобы автоматически сохранять не более пяти черновиков. Расширение будет удалять самый старый черновик при каждом добавлении нового.

1. Нажмите кнопку «Установить» на странице сведений о расширении .
2. Выберите проект Firebase, который вы используете для своего веб-приложения Marketplace.
3. Следуйте инструкциям на экране, пока не дойдете до шага «Настройка расширения» .
4. В поле «Путь к базе данных реального времени» введите drafts . Это путь в базе данных, где сохраняются черновики.
5. В поле «Максимальное количество сохраняемых узлов» введите 5 Это означает, что для каждого элемента списка будет сохранено пять черновиков, а при добавлении ещё одного черновика самый старый будет автоматически удалён.
6. Нажмите Установить расширение .

Пока вы ждете завершения установки...

Мониторинг расширений

При установке расширения создаётся несколько функций. Вы можете проверить частоту их запуска, а также просмотреть журналы и частоту ошибок. Подробную информацию о мониторинге расширения см. в разделе «Управление установленными расширениями» . Следуйте инструкциям в документации, чтобы просмотреть функции, созданные расширением Resize Images на предыдущем этапе.

Удаление расширений

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

При удалении удаляются все ресурсы (например, функции расширения) и учётная запись службы, созданная для этого экземпляра расширения. Однако все артефакты, созданные расширением (например, изменённые изображения), останутся в вашем проекте после удаления расширения.

Установка нескольких копий расширения в одном проекте

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

Посмотрите на это в действии

1. Убедитесь, что вы вошли в систему с помощью учетной записи, которую вы использовали для публикации ксилофона или латте.
2. Создайте несколько черновиков:
3. Нажмите кнопку «Продать что-нибудь» в правом нижнем углу приложения.
4. Измените заголовок на «Черновик 1».
5. Прокрутите вниз до раздела «Черновики» и посмотрите количество черновиков. Их должно быть не менее двух.
6. Нажмите кнопку «ДРУЖЕСТВЕННЫЙ РЫНОК» на верхней панели приложения. Таким образом, у вас будет сохранённый черновик, но вам не придётся его публиковать.
7. Повторите то же самое для «Черновика 2», «Черновика 3» и так далее до «Черновика 6».
8. При создании «Черновика 6» обратите внимание, что «Черновик 1» исчезает из раздела «Черновики» .
9. Как и в случае с расширением Resize Images, вы можете проверить журналы функций, чтобы узнать, какие функции были запущены.

Упс, лимит сохраняемых черновиков слишком мал

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

Как это исправить? Давайте перенастроим установленное расширение!

1. На левой панели консоли Firebase нажмите «Расширения» .
2. На карточке установленного расширения нажмите «Управление» .
3. В правом верхнем углу нажмите Перенастроить расширение .
4. Измените максимальное количество узлов на 50000 .
5. Нажмите «Сохранить» .

И это всё, что вам нужно сделать! Пока расширение обновляется, вы можете связаться со службой поддержки и сообщить, что исправление уже внедряется.

6. Автоматически удалять данные пользователя

Проблема

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

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

Решение

Вы настроите расширение Delete User Data для автоматического удаления узла users/uid в базе данных, когда пользователь удаляет свою учетную запись.

1. Нажмите кнопку «Установить» на странице сведений о расширении .
2. Выберите проект Firebase, который вы используете для своего веб-приложения Marketplace.
3. Следуйте инструкциям на экране, пока не дойдете до шага «Настройка расширения» .
4. Для путей к базе данных реального времени введите sellers/{UID} . Часть sellers — это узел, дочерние элементы которого содержат адреса электронной почты пользователей, а {UID} — подстановочный знак. При такой настройке расширение будет знать, что когда пользователь с UID 1234 удаляет свою учётную запись, расширение должно удалить sellers/1234 из базы данных.
5. Нажмите Установить расширение .

Пока вы ждете завершения установки...

Давайте поговорим о настраиваемости

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

Однако расширения не могут решить все проблемы, и проблема удаления пользовательских данных — хороший пример. Хотя расширение Delete User Data решает текущую проблему, связанную с тем, что электронные письма остаются видимыми после удаления пользователем своей учётной записи, оно не удаляет все данные. Например, список товаров остаётся доступным, а все изображения в Cloud Storage также сохраняются. Расширение Delete User Data позволяет настроить путь к удалению в Cloud Storage, но поскольку пользователи могут загружать множество разных файлов с разными именами, вы не сможете настроить это расширение на автоматическое удаление этих артефактов. В подобных ситуациях Cloud Functions for Firebase может оказаться более подходящим решением, поскольку позволяет писать код, соответствующий модели данных вашего приложения.

Расширения и выставление счетов

Расширения Firebase сами по себе бесплатны (плата взимается только за используемые базовые ресурсы), но некоторые из них могут быть платными. Эта лабораторная работа разработана для выполнения без платёжной учётной записи. Однако, настроив тарифный план Flame или Blaze, вы получите доступ ко множеству действительно интересных расширений Firebase.

Например, вы можете сокращать URL-адреса , активировать отправку писем , экспортировать коллекции в BigQuery и многое другое! Полный каталог расширений можно посмотреть здесь .

Если вам нужно расширение, но оно сейчас недоступно, мы будем рады узнать о нём! Отправьте запрос на добавление функции в службу поддержки Firebase , чтобы мы предложили новое расширение.

Посмотрите на это в действии

После завершения установки расширения удалите пользователя и посмотрите, что произойдет:

1. В консоли Firebase перейдите на панель управления Realtime Database .
2. Разверните узел sellers .
3. Информация о каждом продавце привязана к его уникальному идентификатору пользователя. Выберите уникальный идентификатор пользователя.
4. В консоли Firebase перейдите на панель аутентификации и найдите UID пользователя.
5. Разверните меню справа от UID и выберите Удалить учетную запись .

6. Вернитесь в панель управления Realtime Database . Информация о продавце исчезнет!

7. Поздравляем!

Несмотря на то, что в этой лабораторной работе вы написали не так много кода, вы добавили важные функции в свое приложение Marketplace.

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

Что дальше?

Ознакомьтесь с некоторыми из этих других расширений:

• Перевод текстовых строк в Cloud Firestore (требуется платежный аккаунт)
• Добавьте новых пользователей в списки адресов электронной почты Mailchimp (требуется платежный аккаунт)
• Сократить URL-адреса (требуется платежный аккаунт)

Нужен дополнительный пользовательский серверный код?

• Ознакомьтесь с практической работой по облачным функциям для Firebase

Другие полезные документы

Управление расширениями:

• Попробуйте управлять расширениями с помощью Firebase CLI
• Установить оповещения о бюджете
• Проверьте, как часто запускается установленное расширение.
• Обновить установленное расширение до новой версии
• Удалить расширение

Подробности о расширениях:

• Посмотрите исходный код и документацию для каждого расширения на GitHub.
• Узнайте о разрешениях и доступе, предоставленных расширению