Google se compromete a impulsar la igualdad racial para las comunidades afrodescendientes. Obtén información al respecto.

Cloud Functions para Firebase

En este laboratorio de código, aprenderá a usar el SDK de Firebase para Google Cloud Functions para mejorar una aplicación web de chat y cómo usar Cloud Functions para enviar notificaciones a los usuarios de la aplicación de chat.

3b1284f5144b54f6.png

Lo que aprenderás

  • Cree Google Cloud Functions con el SDK de Firebase.
  • Active Cloud Functions en función de los eventos de autenticación, almacenamiento en la nube y Cloud Firestore.
  • Agrega compatibilidad con Firebase Cloud Messaging a tu aplicación web.

Lo que necesitarás

  • Una tarjeta de crédito. Cloud Functions para Firebase requiere el plan Firebase Blaze, lo que significa que tendrá que habilitar la facturación en su proyecto de Firebase con una tarjeta de crédito.
  • El IDE / editor de texto de su elección, como WebStorm , Atom o Sublime .
  • Un terminal para ejecutar comandos de shell con NodeJS v8 instalado.
  • Un navegador como Chrome.
  • El código de muestra. Vea el siguiente paso para esto.

Clona el repositorio de GitHub desde la línea de comando:

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

Importar la aplicación de inicio

Con su IDE, abra o importe el android_studio_folder.png directorio cloud-functions-start directorio de código de muestra. Este directorio contiene el código de inicio para el laboratorio de código que consiste en una aplicación web de chat completamente funcional.

Crear proyecto

En la consola de Firebase, haga clic en Agregar proyecto y llámelo FriendlyChat .

Haga clic en Crear proyecto .

Actualice al plan Blaze

Para usar Cloud Functions para Firebase, deberá actualizar su proyecto de Firebase al plan de facturación de Blaze . Esto requerirá que agregue una tarjeta de crédito u otro instrumento de facturación a su cuenta de Google Cloud.

Todos los proyectos de Firebase, incluidos los del plan Blaze, aún tienen acceso a las cuotas de uso gratuitas para Cloud Functions. Los pasos descritos en este codelab estarán dentro de los límites de uso del nivel gratuito. Sin embargo, verá pequeños cargos ( alrededor de $ 0.03 ) de Cloud Storage que se usa para alojar sus imágenes de compilación de Cloud Functions.

Si no tiene acceso a una tarjeta de crédito o no se siente cómodo para continuar con el plan Blaze, considere usar Firebase Emulator Suite, que le permitirá emular Cloud Functions de forma gratuita en su máquina local.

Habilitar la autenticación de Google

Para permitir que los usuarios inicien sesión en la aplicación, usaremos la autenticación de Google, que debe estar habilitada.

En Firebase Console, abra la sección Desarrollar > Autenticación > pestaña MÉTODO DE INICIO DE SESIÓN (o haga clic aquí para ir allí), debe habilitar el Proveedor de inicio de sesión de Google y hacer clic en GUARDAR . Esto permitirá a los usuarios iniciar sesión en la aplicación web con sus cuentas de Google.

También siéntase libre de establecer el nombre público de su aplicación en Chat amistoso :

8290061806aacb46.png

Habilitar almacenamiento en la nube

La aplicación usa Cloud Storage para cargar fotos. Para habilitar Cloud Storage en su proyecto de Firebase, visite la sección Almacenamiento y haga clic en el botón Comenzar . Luego, haga clic en Entendido cuando reciba el descargo de responsabilidad sobre las reglas de seguridad.

842ad84821323ef5.png

La interfaz de línea de comandos de Firebase (CLI) te permitirá entregar la aplicación web de forma local e implementar tu aplicación web y Cloud Functions.

Para instalar o actualizar la CLI, ejecute el siguiente comando npm:

npm -g install firebase-tools

Para verificar que la CLI se haya instalado correctamente, abra una consola y ejecute:

firebase --version

Asegúrate de que la versión de Firebase CLI sea superior a 4.0.0 para que tenga todas las funciones más recientes necesarias para Cloud Functions. De lo contrario, ejecute npm install -g firebase-tools para actualizar como se muestra arriba.

Autorice Firebase CLI ejecutando:

firebase login

Asegúrate de estar en el directorio cloud-functions-start luego configura Firebase CLI para usar tu proyecto Firebase:

firebase use --add

Luego, seleccione su ID de proyecto y siga las instrucciones. Cuando se le solicite, puede elegir cualquier alias, como codelab por ejemplo.

Ahora que ha importado y configurado su proyecto, está listo para ejecutar la aplicación web por primera vez. Abra una consola en la carpeta cloud-functions-start y ejecute firebase deploy --except functions esto solo implementará la aplicación web en el alojamiento de Firebase:

firebase deploy --except functions

Esta es la salida de la consola que debería ver:

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

Abra la aplicación web

La última línea debería mostrar la URL de alojamiento. La aplicación web ahora debería servirse desde esta URL, que debería tener el formato https: // <project-id> .firebaseapp.com. Abrelo. Debería ver la interfaz de usuario en funcionamiento de una aplicación de chat.

Inicie sesión en la aplicación mediante el botón INICIAR SESIÓN CON GOOGLE y no dude en agregar algunos mensajes y publicar imágenes:

3b1284f5144b54f6.png

Si inicia sesión en la aplicación por primera vez en un nuevo navegador, asegúrese de permitir las notificaciones cuando se le solicite: 8b9d0c66dc36153d.png

Necesitaremos que tengas habilitadas las notificaciones en un momento posterior.

Si ha hecho clic accidentalmente en Bloquear , puede cambiar esta configuración haciendo clic en el botón 🔒 Seguro a la izquierda de la URL en Chrome Omnibar y seleccionando Notificaciones> Permitir siempre en este sitio :

e926868b0546ed71.png

Ahora agregaremos algunas funciones con el SDK de Firebase para Cloud Functions.

Cloud Functions le permite tener fácilmente código que se ejecuta en la nube sin tener que configurar un servidor. Le mostraremos cómo crear funciones que reaccionen a los eventos de Firebase Auth, Cloud Storage y Firebase Realtime Database. Comencemos con Auth.

Cuando usas el SDK de Firebase para Cloud Functions, tu código de Functions residirá en el directorio de functions (de forma predeterminada). Su código de Functions también es una aplicación Node.js y, por lo tanto, necesita un package.json que brinde información sobre su aplicación y enumere las dependencias.

Para facilitarle las cosas, ya hemos creado el archivo functions/index.js donde irá su código. Siéntase libre de inspeccionar este archivo antes de seguir adelante.

cd functions
ls

Si no está familiarizado con Node.js , será útil aprender más sobre él antes de continuar con el laboratorio de código.

El archivo package.json ya enumera dos dependencias necesarias: el SDK de Firebase para Cloud Functions y el SDK de Firebase Admin . Para instalarlos localmente, ejecute npm install desde la carpeta de functions :

npm install

Echemos ahora un vistazo al archivo 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.

Primero importaremos los módulos requeridos y luego escribiremos tres funciones en lugar de las tareas pendientes. Primero, importemos los módulos de nodo requeridos.

Se requerirán dos módulos durante este codelab, el módulo firebase-functions nos permite escribir las reglas de activación de Cloud Functions, mientras que el módulo firebase-admin nos permite usar la plataforma Firebase en un servidor con acceso de administrador, por ejemplo, para escribir en el Cloud Firestore o envía notificaciones de FCM.

En el archivo index.js , reemplace el primer TODO con lo siguiente:

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.

El SDK de Firebase Admin se puede configurar automáticamente cuando se implementa en un entorno de Cloud Functions u otros contenedores de Google Cloud Platform. Esto es lo que hacemos arriba cuando admin.initializeApp(); a admin.initializeApp();

Ahora agreguemos una función que se ejecuta cuando un usuario inicia sesión por primera vez en su aplicación de chat y agregaremos un mensaje de chat para darle la bienvenida al usuario.

Estructura de mensajes de chat

Los mensajes publicados en el feed de chat de FriendlyChat se almacenan en Cloud Firestore. Echemos un vistazo a la estructura de datos que usamos para un mensaje. Para hacer esto, publique un nuevo mensaje en el chat que diga "Hola mundo":

11f5a676fbb1a69a.png

Esto debería aparecer como:

fe6d1c020d0744cf.png

En la consola de la aplicación Firebase, haga clic en Base de datos en la sección Desarrollar . Debería ver la colección de mensajes y un documento que contiene el mensaje que escribió:

442c9c10b5e2b245.png

Como puede ver, los mensajes de chat se almacenan en Cloud Firestore como un documento con los profilePicUrl name , profilePicUrl , text y timestamp agregados a la colección de messages .

Agregar mensajes de bienvenida

La primera función en la nube agrega un mensaje que da la bienvenida a nuevos usuarios al chat. Para esto, podemos usar el trigger functions.auth().onCreate que ejecuta la función cada vez que un usuario functions.auth().onCreate por primera vez en su aplicación Firebase. Agregue la función addWelcomeMessages en su archivo index.js :

index.js

// Adds a message that welcomes new users into the chat.
exports.addWelcomeMessages = functions.auth.user().onCreate(async (user) => {
  console.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(),
  });
  console.log('Welcome message written to database.');
});

Agregar esta función al objeto de exports especiales es la forma en que Node hace que la función sea accesible fuera del archivo actual y es necesaria para Cloud Functions.

En la función anterior, estamos agregando un nuevo mensaje de bienvenida publicado por "Firebase Bot" a la lista de mensajes de chat. Lo hacemos mediante el método add en la colección de messages en Cloud Firestore, que es donde se almacenan los mensajes del chat.

Dado que se trata de una operación asincrónica, debemos devolver la Promesa que indica cuándo ha finalizado la escritura de Cloud Firestore, para que Functions no salga de la ejecución demasiado pronto.

Implementar la función

La función solo estará activa después de que la haya implementado. En la línea de comando, ejecute firebase deploy --only functions :

firebase deploy --only functions

Esta es la salida de la consola que debería ver:

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

Prueba la función

Una vez que la función se haya implementado correctamente, deberá tener un usuario que inicie sesión por primera vez.

  1. Abra su aplicación en su navegador usando la URL de alojamiento (en forma de https://<project-id>.firebaseapp.com ).
  2. Con un nuevo usuario, inicie sesión por primera vez en su aplicación con el botón Iniciar sesión .

262535d1b1223c65.png

  1. Después de iniciar sesión, se debe mostrar un mensaje de bienvenida automáticamente:

1c70e0d64b23525b.png

Los usuarios pueden subir todo tipo de imágenes en el chat, y siempre es importante moderar las imágenes ofensivas, especialmente en las plataformas sociales públicas. En FriendlyChat, las imágenes que se publican en el chat se almacenan en Google Cloud Storage .

Con Cloud Functions, puede detectar nuevas cargas de imágenes mediante el activador functions.storage().onFinalize . Esto se ejecutará cada vez que se cargue o modifique un archivo nuevo en Cloud Storage.

Para moderar imágenes pasaremos por el siguiente proceso:

  1. Verifique si la imagen está marcada como para adultos o violenta con la API de Cloud Vision
  2. Si la imagen se ha marcado, descárguela en la instancia de Functions en ejecución
  3. Difuminar la imagen con ImageMagick
  4. Sube la imagen borrosa a Cloud Storage

Habilita la API de Cloud Vision

Dado que usaremos la API de Google Cloud Vision en esta función, debe habilitar la API en su proyecto de base de fuego. Siga este enlace , seleccione su proyecto de Firebase y habilite la API:

5c77fee51ec5de49.png

Instalar dependencias

Para moderar las imágenes, necesitaremos algunos paquetes de Node.js:

  • La biblioteca cliente de Google Cloud Vision para Node.js: @ google-cloud / vision para ejecutar la imagen a través de la API de Cloud Vision para detectar imágenes inapropiadas.
  • Una biblioteca Node.js que nos permite ejecutar procesos: child-process-promise para ejecutar ImageMagick ya que la herramienta de línea de comandos ImageMagick viene preinstalada en todas las instancias de Functions.

Para instalar estos dos paquetes en su aplicación Cloud Functions, ejecute el siguiente npm install --save . Asegúrese de hacer esto desde el directorio de functions .

npm install --save @google-cloud/vision@0.12.0 child-process-promise@2.2.1

Esto instalará los dos paquetes localmente y los agregará como dependencias declaradas en su archivo package.json .

Importar y configurar dependencias

Para importar las dos dependencias que se instalaron y algunos módulos principales de Node.js ( path , os y fs ) que necesitaremos en esta sección, agregue las siguientes líneas en la parte superior de su archivo index.js :

index.js

const Vision = require('@google-cloud/vision');
const vision = new Vision();
const spawn = require('child-process-promise').spawn;

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

Dado que su función se ejecutará dentro de un entorno de Google Cloud, no es necesario configurar las bibliotecas de Cloud Storage y Cloud Vision: se configurarán automáticamente para usar su proyecto.

Detectando imágenes inapropiadas

Utilizará el activador functions.storage.onChange Cloud Functions que ejecuta su código tan pronto como se crea o modifica un archivo o carpeta en un depósito de Cloud Storage. Agregue la función blurOffensiveImages en su archivo 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 image = {
        source: {imageUri: `gs://${object.bucket}/${object.name}`},
      };

      // Check the image content using the Cloud Vision API.
      const batchAnnotateImagesResponse = await vision.safeSearchDetection(image);
      const safeSearchResult = batchAnnotateImagesResponse[0].safeSearchAnnotation;
      const Likelihood = Vision.types.Likelihood;
      if (Likelihood[safeSearchResult.adult] >= Likelihood.LIKELY ||
          Likelihood[safeSearchResult.violence] >= Likelihood.LIKELY) {
        console.log('The image', object.name, 'has been detected as inappropriate.');
        return blurImage(object.name);
      }
      console.log('The image', object.name, 'has been detected as OK.');
    });

Tenga en cuenta que agregamos alguna configuración de la instancia de Cloud Functions que ejecutará la función, con .runWith({memory: '2GB'}) estamos solicitando que la instancia obtenga 2GB de memoria en lugar de la predeterminada, esto ayudará ya que esto la función consume mucha memoria.

Cuando se activa la función, la imagen se ejecuta a través de la API de Cloud Vision para detectar si está marcada como adulta o violenta. Si la imagen se detecta como inapropiada en función de estos criterios, estamos difuminando la imagen, lo que se hace en la función blurImage que veremos a continuación.

Difuminar la imagen

Agregue la siguiente función blurImage en su archivo 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});
  console.log('Image has been downloaded to', tempLocalFile);
  // Blur the image using ImageMagick.
  await spawn('convert', [tempLocalFile, '-channel', 'RGBA', '-blur', '0x24', tempLocalFile]);
  console.log('Image has been blurred');
  // Uploading the Blurred image back into the bucket.
  await bucket.upload(tempLocalFile, {destination: filePath});
  console.log('Blurred image has been uploaded to', filePath);
  // Deleting the local file to free up disk space.
  fs.unlinkSync(tempLocalFile);
  console.log('Deleted local file.');
  // Indicate that the message has been moderated.
  await admin.firestore().collection('messages').doc(messageId).update({moderated: true});
  console.log('Marked the image as moderated in the database.');
}

En la función anterior, la imagen binaria se descarga de Cloud Storage. Luego, la imagen se difumina con la herramienta de convert de ImageMagick y la versión borrosa se vuelve a cargar en Storage Bucket. Luego borramos el archivo en la instancia de Cloud Functions para liberar algo de espacio en el disco, hacemos esto porque la misma instancia de Cloud Functions puede volver a usarse y si los archivos no se limpian, podría quedarse sin disco. Finalmente agregamos un booleano al mensaje de chat que indica que la imagen fue moderada, esto activará una actualización del mensaje en el cliente.

Implementar la función

La función solo estará activa después de que la haya implementado. En la línea de comando, ejecute firebase deploy --only functions :

firebase deploy --only functions

Esta es la salida de la consola que debería ver:

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

Prueba la función

Una vez que la función se haya implementado correctamente:

  1. Abra su aplicación en su navegador usando la URL de alojamiento (en forma de https://<project-id>.firebaseapp.com ).
  2. Una vez que haya iniciado sesión en la aplicación, cargue una imagen: 4db9fdab56703e4a.png
  3. Elige tu mejor imagen ofensiva para subir (¡o puedes usar este zombi carnívoro !) Y después de unos momentos deberías ver tu publicación actualizarse con una versión borrosa de la imagen: 83dd904fbaf97d2b.png

En esta sección, agregará una función de nube que envía notificaciones a los participantes del chat cuando se publica un nuevo mensaje.

Con Firebase Cloud Messaging (FCM), puede enviar notificaciones a sus usuarios de una manera multiplataforma y confiable. Para enviar una notificación a un usuario, necesita su token de dispositivo FCM. La aplicación web de chat que estamos usando ya recopila tokens de dispositivo de los usuarios cuando abren la aplicación por primera vez en un nuevo navegador o dispositivo. Estos tokens se almacenan en Cloud Firestore en la colección fcmTokens .

Si desea aprender cómo obtener tokens de dispositivo FCM en una aplicación web, puede ir a Firebase Web Codelab .

Enviar notificaciones

Para detectar cuándo se publican mensajes nuevos, utilizará el functions.firestore.document().onCreate Cloud Functions, que ejecuta su código cuando se crea un nuevo objeto en una ruta determinada de Cloud Firestore. Agregue la función sendNotifications en su archivo 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);
      console.log('Notifications have been sent and tokens cleaned up.');
    }
  });

En la función anterior, recopilamos los tokens de dispositivos de todos los usuarios de la base de datos de Cloud Firestore y enviamos una notificación a cada uno de ellos mediante la función admin.messaging().sendToDevice .

Limpiar las fichas

Por último, queremos eliminar los tokens que ya no son válidos. Esto sucede cuando el navegador o dispositivo ya no usa el token que una vez obtuvimos del usuario. Por ejemplo, esto sucede si el usuario ha revocado el permiso de notificación para su sesión de navegador. Para hacer esto, agregue la siguiente función cleanupTokens en su archivo 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) {
     console.error('Failure sending notification to', tokens[index], error);
     // Cleanup the tokens who 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);
}

Implementar la función

La función solo estará activa después de que la haya implementado. En la línea de comando, ejecute firebase deploy --only functions :

firebase deploy --only functions

Esta es la salida de la consola que debería ver:

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

Prueba la función

  1. Una vez que la función se haya implementado correctamente, abra su aplicación en su navegador usando la URL de alojamiento (en forma de https://<project-id>.firebaseapp.com ).
  2. Si inicia sesión en la aplicación por primera vez, asegúrese de permitir las notificaciones cuando se le solicite: 8b9d0c66dc36153d.png
  3. Cierre la pestaña de la aplicación de chat o muestre una pestaña diferente: las notificaciones aparecen solo si la aplicación está en segundo plano. Si desea saber cómo recibir mensajes mientras su aplicación está en primer plano, consulte nuestra documentación .
  4. Con un navegador diferente (o una ventana de incógnito), inicie sesión en la aplicación y publique un mensaje. Debería ver una notificación mostrada por el primer navegador: 45282ab12b28b926.png

Usó el SDK de Firebase para Cloud Functions y agregó componentes del lado del servidor a una aplicación de chat.

Lo que hemos cubierto

  • Creación de Cloud Functions con el SDK de Firebase para Cloud Functions.
  • Active Cloud Functions en función de los eventos de autenticación, almacenamiento en la nube y Cloud Firestore.
  • Agrega compatibilidad con Firebase Cloud Messaging a tu aplicación web.
  • Implementó Cloud Functions con Firebase CLI.

Próximos pasos

Aprende más