Облачные функции для Firebase

1. Обзор

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

3b1284f5144b54f6.png

Что ты узнаешь

  • Создавайте облачные функции Google с помощью Firebase SDK.
  • Запускать облачные функции на основе событий Auth, Cloud Storage и Cloud Firestore.
  • Добавьте поддержку Firebase Cloud Messaging в свое веб-приложение.

Что тебе понадобится

  • Кредитная карта. Для облачных функций для Firebase требуется план Firebase Blaze, что означает, что вам нужно будет включить выставление счетов в своем проекте Firebase с помощью кредитной карты.
  • IDE / текстовый редактор по вашему выбору , такие как WebStorm , Atom или возвышенные .
  • Терминал для запуска команд оболочки с установленным NodeJS v9.
  • Такой браузер, как Chrome.
  • Пример кода. См. Следующий шаг для этого.

2. Получите образец кода.

Клон хранилище GitHub из командной строки:

git clone https://github.com/firebase/friendlychat

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

Используя вашу IDE, откройте или импортируйте android_studio_folder.png cloud-functions-start каталог из образца каталога кода. Этот каталог содержит начальный код для codelab, который состоит из полнофункционального веб-приложения Chat.

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

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

В Firebase консоли , щелкните Add Project и назовите его FriendlyChat.

Нажмите Создать проект.

Перейти на план Blaze

Для того , чтобы использовать облачные функции для Firebase, вам придется upgade проект Firebase в плане выставления счетов Blaze . Для этого вам потребуется добавить кредитную карту или другой платежный инструмент в свою учетную запись Google Cloud.

Все проекты Firebase, включая те, которые включены в план Blaze, по-прежнему имеют доступ к квотам бесплатного использования для облачных функций. Шаги, описанные в этой кодовой лаборатории, будут соответствовать ограничениям на использование уровня бесплатного пользования. Тем не менее, вы будете видеть небольшие расходы ( около $ 0,03 ) от Cloud Storage , который используется для размещения своего Облако функции построение изображения.

Если у вас нет доступа к кредитной карте или неудобны продолжением плана Blaze, рассмотреть вопрос об использовании Firebase Emulator Suite , который позволит вам эмулировать облачные функции бесплатно на локальном компьютере.

Включить Google Auth

Чтобы пользователи могли входить в приложение, мы будем использовать аутентификацию Google, которую необходимо включить.

В Firebase консоли откройте раздел сборки> Аутентификация> Вход в вкладке метод (или нажмите здесь , чтобы пойти туда). Затем, включите Google для входа в систему поставщика и нажмите кнопку Сохранить. Это позволит пользователям входить в веб-приложение со своими учетными записями Google.

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

8290061806aacb46.png

Включить облачное хранилище

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

Добавить веб-приложение

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

4. Установите интерфейс командной строки Firebase.

Интерфейс командной строки Firebase (CLI) позволит вам обслуживать веб-приложение локально и развертывать веб-приложение и облачные функции.

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

npm -g install firebase-tools

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

firebase --version

Убедитесь , что версия Firebase CLI выше 4.0.0 , так что она имеет все новейшие функции , необходимые для облачных функций. Если нет, то запустите npm install -g firebase-tools для обновления , как показано выше.

Авторизуйте интерфейс командной строки Firebase, запустив:

firebase login

Убедитесь , что вы находитесь в cloud-functions-start каталога, а затем настроить Firebase CLI использовать Firebase проекта:

firebase use --add

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

5. Разверните и запустите веб-приложение.

Теперь, когда вы импортировали и настроили свой проект, вы готовы впервые запустить веб-приложение! Откройте окно терминала, перейдите на cloud-functions-start папки и развертывания веб - приложений на Firebase хостинг с помощью:

firebase deploy --except functions

Это консольный вывод, который вы должны увидеть:

i deploying database, storage, hosting
✔  database: rules ready to deploy.
i  storage: checking rules for compilation errors...
✔  storage: rules file compiled successfully
i  hosting: preparing ./ directory for upload...
✔  hosting: ./ folder uploaded successfully
✔ storage: rules file compiled successfully
✔ hosting: 8 files uploaded successfully
i starting release process (may take several minutes)...

✔ Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview
Hosting URL: https://friendlychat-1234.firebaseapp.com

Откройте веб-приложение

Последняя строка должна отображать хостинг URL. Теперь веб-приложение должно обслуживаться с этого URL-адреса, который должен иметь вид https: // <project-id> .firebaseapp.com. Открой это. Вы должны увидеть работающий пользовательский интерфейс приложения чата.

Вход в приложение с помощью кнопки ВХОДА С GOOGLE и не стесняйтесь добавлять некоторые сообщения и отправлять изображения:

3b1284f5144b54f6.png

Если вы впервые входите в приложение в новом браузере, убедитесь, что вы разрешили получать уведомления при появлении запроса: 8b9d0c66dc36153d.png

Нам нужно будет включить уведомления позже.

Если вы случайно нажали на блок, вы можете изменить эту настройку, нажав на кнопку 🔒 Secure слева от URL в Chrome Omnibar и переключая бар рядом с Notifications:

e926868b0546ed71.png

Теперь мы добавим некоторые функции с помощью Firebase SDK для облачных функций.

6. Справочник функций

Облачные функции позволяют легко иметь код, работающий в облаке, без необходимости настраивать сервер. Мы рассмотрим, как создавать функции, которые реагируют на события Firebase Auth, Cloud Storage и Firebase Firestore базы данных. Начнем с Auth.

При использовании Firebase SDK для облачных функций, ваш код функции будет жить под functions каталога (по умолчанию). Ваш код функции также Node.js приложение , и поэтому нуждается в package.json , что дает некоторую информацию о вашем приложении и списки зависимостей.

Для того, чтобы сделать его проще для вас, мы уже создали functions/index.js файл , в котором ваш код будет идти. Не стесняйтесь изучить этот файл, прежде чем двигаться дальше.

cd functions
ls

Если вы не знакомы с Node.js , больше узнать об этом , прежде чем продолжить codelab было бы полезно.

package.json файл уже перечислены два необходимых зависимостей: в Firebase SDK для облачных функций и Firebase Admin SDK . Для того, чтобы установить их на месте, перейдите к functions папку и запустите:

npm install

Давайте теперь посмотрим на index.js файла:

index.js

/**
 * Copyright 2017 Google Inc. All Rights Reserved.
 * ...
 */

// TODO(DEVELOPER): Import the Cloud Functions for Firebase and the Firebase Admin modules here.

// TODO(DEVELOPER): Write the addWelcomeMessage Function here.

// TODO(DEVELOPER): Write the blurImages Function here.

// TODO(DEVELOPER): Write the sendNotification Function here.

Мы импортируем необходимые модули, а затем напишем три функции вместо TODO. Начнем с импорта необходимых модулей Node.

7. Импортируйте облачные функции и модули администрирования Firebase.

Два модуля будет необходим в течение этого codelab: firebase-functions позволяет писать Облако Функции триггера и журналы , а firebase-admin позволяет использовать платформу Firebase на сервере с доступом администратора выполнять действия , такие как запись в облаке Firestore или отправка уведомлений ТСМА.

В index.js файле замените первую TODO с нижеследующим:

index.js

/**
 * Copyright 2017 Google Inc. All Rights Reserved.
 * ...
 */

// Import the Firebase SDK for Google Cloud Functions.
const functions = require('firebase-functions');
// Import and initialize the Firebase Admin SDK.
const admin = require('firebase-admin');
admin.initializeApp();

// TODO(DEVELOPER): Write the addWelcomeMessage Function here.

// TODO(DEVELOPER): Write the blurImages Function here.

// TODO(DEVELOPER): Write the sendNotification Function here.

Firebase Администратор SDK может быть сконфигурирован автоматически при развертывании на Functions облачной среде или других контейнеров Google Cloud Platform, и это происходит , когда мы называем admin.initializeApp() без аргументов.

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

8. Приветствуйте новых пользователей

Структура сообщений чата

Сообщения, отправленные в канал чата FriendlyChat, хранятся в Cloud Firestore. Давайте посмотрим на структуру данных, которую мы используем для сообщения. Для этого отправьте в чат новое сообщение с надписью «Hello World»:

11f5a676fbb1a69a.png

Это должно выглядеть так:

fe6d1c020d0744cf.png

В Firebase консоли, нажмите на Firestore базы данных в разделе сборки. Вы должны увидеть коллекцию сообщений и один документ, содержащий написанное вами сообщение:

442c9c10b5e2b245.png

Как вы можете видеть, сообщения чата сохраняются в облаке Firestore в качестве документа с name , profilePicUrl , text и timestamp атрибутов , добавленных в messages коллекции.

Добавление приветственных сообщений

Первое облако Функция добавляет сообщение , которое приглашает новых пользователей в чате. Для этого мы можем использовать триггер functions.auth().onCreate , который запускает функцию каждый раз , когда пользователь входит в первый раз в приложении Firebase. Добавляем addWelcomeMessages функционировать в ваш index.js файл:

index.js

// Adds a message that welcomes new users into the chat.
exports.addWelcomeMessages = functions.auth.user().onCreate(async (user) => {
  functions.logger.log('A new user signed in for the first time.');
  const fullName = user.displayName || 'Anonymous';

  // Saves the new welcome message into the database
  // which then displays it in the FriendlyChat clients.
  await admin.firestore().collection('messages').add({
    name: 'Firebase Bot',
    profilePicUrl: '/images/firebase-logo.png', // Firebase logo
    text: `${fullName} signed in for the first time! Welcome!`,
    timestamp: admin.firestore.FieldValue.serverTimestamp(),
  });
  functions.logger.log('Welcome message written to database.');
});

Добавление этой функции в специальном exports объект путь в Node сделать функцию доступные за пределы текущего файла и требуется для облачных функций.

В приведенной выше функции мы добавляем новое приветственное сообщение, отправленное «Firebase Bot», в список сообщений чата. Мы делаем это с помощью add метода на messages коллекции в облаке Firestore, что где сообщения чата сохраняются.

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

Развертывание облачных функций

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

firebase deploy --only functions

Это консольный вывод, который вы должны увидеть:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
⚠  functions: missing necessary APIs. Enabling now...
i  env: ensuring necessary APIs are enabled...
⚠  env: missing necessary APIs. Enabling now...
i  functions: waiting for APIs to activate...
i  env: waiting for APIs to activate...
✔  env: all necessary APIs are enabled
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: creating function addWelcomeMessages...
✔  functions[addWelcomeMessages]: Successful create operation. 
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlypchat-1234/overview

Проверить функцию

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

  1. Откройте приложение в браузере , используя хостинг URL (в виде https://<project-id>.firebaseapp.com ).
  2. С новым пользователем, войдите в первый раз в вашем приложении , используя кнопку Войти.
  • Если вы уже зарегистрировались в, приложение , которое вы можете открыть аутентификации консоли Firebase и удалить свою учетную запись из списка пользователей. Затем войдите снова.

262535d1b1223c65.png

  1. После входа в систему автоматически должно отображаться приветственное сообщение:

1c70e0d64b23525b.png

9. Модерация изображений.

Пользователи могут загружать в чат все типы изображений, и всегда важно модерировать оскорбительные изображения, особенно на публичных социальных платформах. В FriendlyChat, образы, которые были опубликованы в чате, хранятся в Google Cloud Storage .

С облачными функциями, вы можете обнаружить новую загрузку изображений с помощью functions.storage().onFinalize триггера. Это будет запускаться каждый раз при загрузке или изменении нового файла в облачном хранилище.

Чтобы модерировать изображения, мы пройдем следующий процесс:

  1. Проверьте , если изображение помечено как взрослая или Violent с помощью API Cloud видения .
  2. Если изображение было помечено, загрузите его в запущенном экземпляре функций.
  3. Размытие изображения с помощью ImageMagick .
  4. Загрузите размытое изображение в Cloud Storage.

Включите Cloud Vision API

Поскольку в этой функции мы будем использовать Google Cloud Vision API, вы должны включить API в своем проекте firebase. Следуйте по этой ссылке , а затем выберите Firebase проект и включить API:

5c77fee51ec5de49.png

Установить зависимости

Для умеренных изображений, мы будем использовать библиотеку Google Cloud Видение Client для Node.js, @ Google-облако / зрения , чтобы запустить изображения через API Cloud Vision , чтобы обнаружить неуместные изображения.

Чтобы установить этот пакет в вашей Cloud Функции приложения, выполните следующие npm install --save команду. Убедитесь , что вы делаете это из functions каталога.

npm install --save @google-cloud/vision@2.4.0

Это позволит установить пакет локально и добавить их в качестве объявленной зависимости в вашем package.json файл.

Импорт и настройка зависимостей

Для импорта зависимостей , которые были установлены и некоторые основные Node.js модули ( path , os и fs ) , что мы нужны в этом разделе, добавьте следующие строки в верхней части вашего index.js файла:

index.js

const Vision = require('@google-cloud/vision');
const vision = new Vision.ImageAnnotatorClient();
const {promisify} = require('util');
const exec = promisify(require('child_process').exec);

const path = require('path');
const os = require('os');
const fs = require('fs');

Поскольку ваша функция будет работать в среде Google Cloud, нет необходимости настраивать библиотеки Cloud Storage и Cloud Vision: они будут настроены автоматически для использования вашего проекта.

Обнаружение неприемлемых изображений

Вы будете использовать functions.storage.onChange функции запуска Cloud, который запускает свой код , как только файл или папка создается или изменения в ведре Cloud Storage. Добавьте blurOffensiveImages функцию в ваш index.js файл:

index.js

// Checks if uploaded images are flagged as Adult or Violence and if so blurs them.
exports.blurOffensiveImages = functions.runWith({memory: '2GB'}).storage.object().onFinalize(
    async (object) => {
      const imageUri = `gs://${object.bucket}/${object.name}`;
      // Check the image content using the Cloud Vision API.
      const batchAnnotateImagesResponse = await vision.safeSearchDetection(imageUri);
      const safeSearchResult = batchAnnotateImagesResponse[0].safeSearchAnnotation;
      const Likelihood = Vision.protos.google.cloud.vision.v1.Likelihood;
      if (Likelihood[safeSearchResult.adult] >= Likelihood.LIKELY ||
          Likelihood[safeSearchResult.violence] >= Likelihood.LIKELY) {
        functions.logger.log('The image', object.name, 'has been detected as inappropriate.');
        return blurImage(object.name);
      }
      functions.logger.log('The image', object.name, 'has been detected as OK.');
    });

Обратите внимание, что мы добавили некоторую конфигурацию экземпляра Cloud Functions, который будет запускать функцию. С .runWith({memory: '2GB'}) , мы с просьбой о том , что экземпляр получает 2 ГБ оперативной памяти , а не по умолчанию, так как эта функция является большим объемом памяти.

При срабатывании функции изображение пропускается через Cloud Vision API, чтобы определить, помечено ли оно как взрослое или жестокое. Если изображение определяется как неприемлемое на основании этих критериев, мы смазывание изображения, что делается в blurImage функции , как мы увидим дальше.

Размытие изображения

Добавьте следующий blurImage функцию в index.js файла:

index.js

// Blurs the given image located in the given bucket using ImageMagick.
async function blurImage(filePath) {
  const tempLocalFile = path.join(os.tmpdir(), path.basename(filePath));
  const messageId = filePath.split(path.sep)[1];
  const bucket = admin.storage().bucket();

  // Download file from bucket.
  await bucket.file(filePath).download({destination: tempLocalFile});
  functions.logger.log('Image has been downloaded to', tempLocalFile);
  // Blur the image using ImageMagick.
  await exec(`convert "${tempLocalFile}" -channel RGBA -blur 0x24 "${tempLocalFile}"`);
  functions.logger.log('Image has been blurred');
  // Uploading the Blurred image back into the bucket.
  await bucket.upload(tempLocalFile, {destination: filePath});
  functions.logger.log('Blurred image has been uploaded to', filePath);
  // Deleting the local file to free up disk space.
  fs.unlinkSync(tempLocalFile);
  functions.logger.log('Deleted local file.');
  // Indicate that the message has been moderated.
  await admin.firestore().collection('messages').doc(messageId).update({moderated: true});
  functions.logger.log('Marked the image as moderated in the database.');
}

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

Развернуть функцию

Функция будет активна только после того, как вы ее развернете. В командной строке запустите firebase deploy --only functions :

firebase deploy --only functions

Это консольный вывод, который вы должны увидеть:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: updating function addWelcomeMessages...
i  functions: creating function blurOffensiveImages...
✔  functions[addWelcomeMessages]: Successful update operation.
✔  functions[blurOffensiveImages]: Successful create operation.
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview

Проверить функцию

После успешного развертывания функции:

  1. Откройте приложение в браузере , используя хостинг URL (в виде https://<project-id>.firebaseapp.com ).
  2. После входа в приложение загрузите изображение: 4db9fdab56703e4a.png
  3. Выбери лучший наступательный изображение для загрузки (или вы можете использовать эту плоть едят зомби !) И через несколько секунд вы должны увидеть после обновления с размытой версии изображения: 83dd904fbaf97d2b.png

10. Уведомления о новых сообщениях

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

Использование Firebase Cloud Messaging (ТСМ), вы можете надежно отправлять уведомления пользователей на разных платформах. Чтобы отправить уведомление пользователю, вам понадобится его токен устройства FCM. Веб-приложение чата, которое мы используем, уже собирает токены устройств от пользователей, когда они впервые открывают приложение в новом браузере или на новом устройстве. Эти маркеры сохраняются в облаке Firestore в fcmTokens коллекции.

Если вы хотели бы узнать , как получить маркеры FCM устройств на веб - приложение, вы можете пройти через Firebase Web Codelab .

Отправлять уведомления

Для того, чтобы определить , когда новые сообщения размещены, вы будете использовать в functions.firestore.document().onCreate Облако функция триггер, который запускает свой код , когда новый объект создается на заданном пути Cloud Firestore. Добавляем sendNotifications функционировать в ваш index.js файл:

index.js

// Sends a notifications to all users when a new message is posted.
exports.sendNotifications = functions.firestore.document('messages/{messageId}').onCreate(
  async (snapshot) => {
    // Notification details.
    const text = snapshot.data().text;
    const payload = {
      notification: {
        title: `${snapshot.data().name} posted ${text ? 'a message' : 'an image'}`,
        body: text ? (text.length <= 100 ? text : text.substring(0, 97) + '...') : '',
        icon: snapshot.data().profilePicUrl || '/images/profile_placeholder.png',
        click_action: `https://${process.env.GCLOUD_PROJECT}.firebaseapp.com`,
      }
    };

    // Get the list of device tokens.
    const allTokens = await admin.firestore().collection('fcmTokens').get();
    const tokens = [];
    allTokens.forEach((tokenDoc) => {
      tokens.push(tokenDoc.id);
    });

    if (tokens.length > 0) {
      // Send notifications to all tokens.
      const response = await admin.messaging().sendToDevice(tokens, payload);
      await cleanupTokens(response, tokens);
      functions.logger.log('Notifications have been sent and tokens cleaned up.');
    }
  });

В приведенной выше функции, мы собираем лексемы устройств всех пользователей из базы данных Cloud Firestore и отправки уведомления каждого из них с помощью admin.messaging().sendToDevice функции.

Очистить токены

Наконец, мы хотим удалить токены, которые больше не действительны. Это происходит, когда токен, который мы когда-то получили от пользователя, больше не используется браузером или устройством. Например, это происходит, если пользователь отозвал разрешение на уведомление для сеанса браузера. Чтобы сделать это, добавьте следующие cleanupTokens функции в index.js файла:

index.js

// Cleans up the tokens that are no longer valid.
function cleanupTokens(response, tokens) {
 // For each notification we check if there was an error.
 const tokensDelete = [];
 response.results.forEach((result, index) => {
   const error = result.error;
   if (error) {
     functions.logger.error('Failure sending notification to', tokens[index], error);
     // Cleanup the tokens that are not registered anymore.
     if (error.code === 'messaging/invalid-registration-token' ||
         error.code === 'messaging/registration-token-not-registered') {
       const deleteTask = admin.firestore().collection('fcmTokens').doc(tokens[index]).delete();
       tokensDelete.push(deleteTask);
     }
   }
 });
 return Promise.all(tokensDelete);
}

Развернуть функцию

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

firebase deploy --only functions

Это консольный вывод, который вы должны увидеть:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: updating function addWelcomeMessages...
i  functions: updating function blurOffensiveImages...
i  functions: creating function sendNotifications...
✔  functions[addWelcomeMessages]: Successful update operation.
✔  functions[blurOffensiveImages]: Successful updating operation.
✔  functions[sendNotifications]: Successful create operation.
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview

Проверить функцию

  1. После того , как функция успешно развернуты, откройте приложение в браузере , используя хостинг URL (в виде https://<project-id>.firebaseapp.com ).
  2. Если вы входите в приложение в первый раз, убедитесь, что вы разрешаете получать уведомления при появлении запроса: 8b9d0c66dc36153d.png
  3. Закройте вкладку приложения чата или откройте другую вкладку: уведомления появляются, только если приложение работает в фоновом режиме. Если вы хотели бы узнать , как получать сообщения в то время как ваше приложение находится на переднем плане, посмотрите на нашей документации .
  4. Используя другой браузер (или окно в режиме инкогнито), войдите в приложение и опубликуйте сообщение. Вы должны увидеть уведомление, отображаемое первым браузером: 45282ab12b28b926.png

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

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

Что мы покрыли

  • Создание облачных функций с помощью Firebase SDK для облачных функций.
  • Запускать облачные функции на основе событий Auth, Cloud Storage и Cloud Firestore.
  • Добавьте поддержку Firebase Cloud Messaging в свое веб-приложение.
  • Разверните облачные функции с помощью интерфейса командной строки Firebase.

Следующие шаги

Учить больше