1. Vue d'ensemble
Dans cet atelier de programmation, vous apprendrez à utiliser Cloud Functions pour Firebase pour ajouter des fonctionnalités à une application Web de chat en envoyant des notifications aux utilisateurs de l'application de chat.
Ce que vous apprendrez
- Créez des fonctions Google Cloud à l'aide du SDK Firebase.
- Déclenchez Cloud Functions en fonction des événements Auth, Cloud Storage et Cloud Firestore.
- Ajoutez la prise en charge de Firebase Cloud Messaging à votre application Web.
Ce dont vous aurez besoin
- Une carte de crédit. Cloud Functions pour Firebase nécessite le plan Firebase Blaze, ce qui signifie que vous devrez activer la facturation sur votre projet Firebase à l'aide d'une carte de crédit.
- L'éditeur de texte/IDE de votre choix tel que WebStorm , Atom ou Sublime .
- Un terminal pour exécuter des commandes shell avec NodeJS v9 installé.
- Un navigateur tel que Chrome.
- L'exemple de code. Voir l'étape suivante pour cela.
2. Obtenez l'exemple de code
Clonez le dépôt GitHub à partir de la ligne de commande :
git clone https://github.com/firebase/friendlychat
Importer l'application de démarrage
À l'aide de votre IDE, ouvrez ou importez le 
répertoire cloud-functions-start à partir du répertoire d'exemples de code. Ce répertoire contient le code de démarrage du laboratoire de programmation qui consiste en une application Web de chat entièrement fonctionnelle.
3. Créez un projet Firebase et configurez votre application
Créer un projet
Dans la console Firebase , cliquez sur Ajouter un projet et appelez-le FriendlyChat .
Cliquez sur Créer un projet .
Passez au forfait Blaze
Afin d'utiliser Cloud Functions pour Firebase, vous devrez mettre à jour votre projet Firebase vers le plan de facturation Blaze . Cela vous obligera à ajouter une carte de crédit ou un autre instrument de facturation à votre compte Google Cloud.
Tous les projets Firebase, y compris ceux du plan Blaze, ont toujours accès aux quotas d'utilisation gratuits pour Cloud Functions. Les étapes décrites dans cet atelier de programmation s'inscriront dans les limites d'utilisation de l'offre gratuite. Cependant, vous verrez de petits frais ( environ 0,03 $ ) de Cloud Storage qui est utilisé pour héberger vos images de compilation Cloud Functions.
Si vous n'avez pas accès à une carte de crédit ou si vous n'êtes pas à l'aise avec le plan Blaze, envisagez d'utiliser Firebase Emulator Suite qui vous permettra d'émuler gratuitement Cloud Functions sur votre ordinateur local.
Activer l'authentification Google
Pour permettre aux utilisateurs de se connecter à l'application, nous utiliserons l'authentification Google qui doit être activée.
Dans la console Firebase, ouvrez la section Build > Authentification > onglet Méthode de connexion (ou cliquez ici pour y accéder). Ensuite, activez le fournisseur de connexion Google et cliquez sur Enregistrer . Cela permettra aux utilisateurs de se connecter à l'application Web avec leurs comptes Google.
N'hésitez pas non plus à définir le nom public de votre application sur Friendly Chat :
Activer le stockage en nuage
L'application utilise Cloud Storage pour télécharger des images. Pour activer Cloud Storage sur votre projet Firebase, visitez la section Stockage et cliquez sur le bouton Démarrer . Suivez les étapes ici, et pour l'emplacement Cloud Storage, il y aura une valeur par défaut à utiliser. Cliquez ensuite sur Terminé .
Ajouter une application Web
Sur la console Firebase, ajoutez une application Web. Pour ce faire, accédez à Paramètres du projet et faites défiler jusqu'à Ajouter une application . Choisissez Web comme plate-forme et cochez la case pour configurer Firebase Hosting, puis enregistrez l'application et cliquez sur Suivant pour le reste des étapes, en cliquant enfin sur Continuer vers la console .
4. Installez l'interface de ligne de commande Firebase
L'interface de ligne de commande Firebase (CLI) vous permettra de servir l'application Web localement et de déployer votre application Web et Cloud Functions.
Pour installer ou mettre à niveau la CLI, exécutez la commande npm suivante :
npm -g install firebase-tools
Pour vérifier que la CLI a été correctement installée, ouvrez une console et exécutez :
firebase --version
Assurez-vous que la version de la CLI Firebase est supérieure à 4.0.0 afin qu'elle dispose de toutes les dernières fonctionnalités requises pour Cloud Functions. Sinon, exécutez npm install -g firebase-tools pour effectuer la mise à niveau comme indiqué ci-dessus.
Autorisez la CLI Firebase en exécutant :
firebase login
Assurez-vous d'être dans le répertoire cloud-functions-start , puis configurez la CLI Firebase pour utiliser votre projet Firebase :
firebase use --add
Ensuite, sélectionnez votre ID de projet et suivez les instructions. Lorsque vous y êtes invité, vous pouvez choisir n'importe quel alias, tel que codelab .
5. Déployer et exécuter l'application Web
Maintenant que vous avez importé et configuré votre projet, vous êtes prêt à exécuter l'application Web pour la première fois ! Ouvrez une fenêtre de terminal, accédez au dossier cloud-functions-start et déployez l'application Web sur l'hébergement Firebase en utilisant :
firebase deploy --except functions
Voici la sortie de la console que vous devriez voir :
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
Ouvrez l'application Web
La dernière ligne doit afficher l' URL d'hébergement. L'application Web doit maintenant être diffusée à partir de cette URL, qui doit être au format https://<project-id>.firebaseapp.com. Ouvrez-le. Vous devriez voir l'interface utilisateur fonctionnelle d'une application de chat.
Connectez-vous à l'application en utilisant le bouton CONNEXION AVEC GOOGLE et n'hésitez pas à ajouter des messages et à publier des images :
Si vous vous connectez à l'application pour la première fois sur un nouveau navigateur, assurez-vous d'autoriser les notifications lorsque vous y êtes invité : 
Nous devrons activer les notifications ultérieurement.
Si vous avez accidentellement cliqué sur Bloquer , vous pouvez modifier ce paramètre en cliquant sur le bouton 🔒 Sécurisé à gauche de l'URL dans Chrome Omnibar et en basculant la barre à côté de Notifications :
Nous allons maintenant ajouter des fonctionnalités à l'aide du SDK Firebase pour Cloud Functions.
6. Le répertoire des fonctions
Cloud Functions vous permet d'avoir facilement du code qui s'exécute dans le Cloud sans avoir à configurer de serveur. Nous verrons comment créer des fonctions qui réagissent aux événements de base de données Firebase Auth, Cloud Storage et Firebase Firestore. Commençons par Auth.
Lorsque vous utilisez le SDK Firebase pour Cloud Functions, votre code Functions résidera dans le répertoire functions (par défaut). Votre code Functions est également une application Node.js et nécessite donc un package.json qui donne des informations sur votre application et répertorie les dépendances.
Pour vous faciliter la tâche, nous avons déjà créé le fichier functions/index.js où ira votre code. N'hésitez pas à inspecter ce fichier avant d'aller de l'avant.
cd functions
ls
Si vous n'êtes pas familier avec Node.js , il serait utile d'en savoir plus avant de poursuivre l'atelier de programmation.
Le fichier package.json répertorie déjà deux dépendances requises : le SDK Firebase pour Cloud Functions et le SDK Firebase Admin . Pour les installer localement, allez dans le dossier functions et exécutez :
npm install
Regardons maintenant le fichier 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.
Nous allons importer les modules requis, puis écrire trois fonctions à la place des TODO. Commençons par importer les modules Node requis.
7. Importez les modules Cloud Functions et Firebase Admin
Deux modules seront nécessaires au cours de cet atelier de programmation : firebase-functions permet d'écrire des déclencheurs et des journaux Cloud Functions, tandis que firebase-admin permet d'utiliser la plate-forme Firebase sur un serveur avec un accès administrateur pour effectuer des actions telles que l'écriture sur Cloud Firestore ou l'envoi de notifications FCM.
Dans le fichier index.js , remplacez le premier TODO par ce qui suit :
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.
Le SDK Firebase Admin peut être configuré automatiquement lorsqu'il est déployé dans un environnement Cloud Functions ou d'autres conteneurs Google Cloud Platform, et cela se produit lorsque nous appelons admin.initializeApp() sans arguments.
Maintenant, ajoutons une fonction qui s'exécute lorsqu'un utilisateur se connecte pour la première fois dans l'application de chat, et nous ajouterons un message de chat pour souhaiter la bienvenue à l'utilisateur.
8. Bienvenue aux nouveaux utilisateurs
Structure des messages de discussion
Les messages publiés sur le fil de discussion FriendlyChat sont stockés dans Cloud Firestore. Examinons la structure de données que nous utilisons pour un message. Pour ce faire, publiez un nouveau message sur le chat indiquant "Hello World":
Cela devrait apparaître comme suit :
Dans la console Firebase, cliquez sur Firestore Database dans la section Build . Vous devriez voir la collection de messages et un document contenant le message que vous avez écrit :
Comme vous pouvez le voir, les messages de chat sont stockés dans Cloud Firestore en tant que document avec name , profilePicUrl , text et timestamp ajoutés à la collection messages .
Ajouter des messages de bienvenue
La première fonction Cloud ajoute un message qui souhaite la bienvenue aux nouveaux utilisateurs dans le chat. Pour cela, nous pouvons utiliser le déclencheur functions.auth().onCreate , qui exécute la fonction chaque fois qu'un utilisateur se connecte pour la première fois dans l'application Firebase. Ajoutez la fonction addWelcomeMessages dans votre fichier 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.');
});
L'ajout de cette fonction à l'objet exports spécial permet à Node de rendre la fonction accessible en dehors du fichier actuel et est requis pour Cloud Functions.
Dans la fonction ci-dessus, nous ajoutons un nouveau message de bienvenue publié par "Firebase Bot" à la liste des messages de chat. Pour ce faire, nous utilisons la méthode add sur la collection messages dans Cloud Firestore, où les messages du chat sont stockés.
Comme il s'agit d'une opération asynchrone, nous devons renvoyer la promesse indiquant quand Cloud Firestore a fini d'écrire afin que les fonctions Cloud ne s'exécutent pas trop tôt.
Déployer des fonctions cloud
Les fonctions Cloud ne seront actives qu'une fois que vous les aurez déployées. Pour ce faire, exécutez ceci sur la ligne de commande :
firebase deploy --only functions
Voici la sortie de la console que vous devriez voir :
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
Testez la fonction
Une fois la fonction déployée avec succès, vous aurez besoin d'un utilisateur qui se connecte pour la première fois.
- Ouvrez votre application dans votre navigateur à l'aide de l'URL d'hébergement (sous la forme
https://<project-id>.firebaseapp.com). - Avec un nouvel utilisateur, connectez-vous pour la première fois à votre application à l'aide du bouton Se connecter .
- Si vous êtes déjà connecté à l'application, vous pouvez ouvrir Firebase Console Authentication et supprimer votre compte de la liste des utilisateurs. Ensuite, reconnectez-vous.
- Une fois connecté, un message de bienvenue devrait s'afficher automatiquement :
9. Modération des images
Les utilisateurs peuvent télécharger tous les types d'images dans le chat, et il est toujours important de modérer les images offensantes, en particulier sur les plateformes sociales publiques. Dans FriendlyChat, les images publiées sur le chat sont stockées dans Google Cloud Storage .
Avec Cloud Functions, vous pouvez détecter de nouvelles importations d'images à l'aide du déclencheur functions.storage().onFinalize . Cette opération s'exécutera chaque fois qu'un nouveau fichier sera importé ou modifié dans Cloud Storage.
Pour modérer les images, nous suivrons le processus suivant :
- Vérifiez si l'image est signalée comme adulte ou violente à l'aide de l' API Cloud Vision .
- Si l'image a été signalée, téléchargez-la sur l'instance Functions en cours d'exécution.
- Flouter l'image avec ImageMagick .
- Importez l'image floue dans Cloud Storage.
Activer l'API Cloud Vision
Étant donné que nous utiliserons l'API Google Cloud Vision dans cette fonction, vous devez activer l'API sur votre projet Firebase. Suivez ce lien , puis sélectionnez votre projet Firebase et activez l'API :
Installer les dépendances
Pour modérer les images, nous utiliserons la bibliothèque cliente Google Cloud Vision pour Node.js, @google-cloud/vision , pour exécuter les images via l'API Cloud Vision afin de détecter les images inappropriées.
Pour installer ce package dans votre application Cloud Functions, exécutez la commande npm install --save suivante. Assurez-vous de le faire à partir du répertoire functions .
npm install --save @google-cloud/vision@2.4.0
Cela installera le package localement et les ajoutera en tant que dépendance déclarée dans votre fichier package.json .
Importer et configurer des dépendances
Pour importer les dépendances qui ont été installées et certains modules de base de Node.js ( path , os et fs ) dont nous aurons besoin dans cette section, ajoutez les lignes suivantes en haut de votre fichier 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');
Étant donné que votre fonction s'exécutera dans un environnement Google Cloud, il n'est pas nécessaire de configurer les bibliothèques Cloud Storage et Cloud Vision : elles seront automatiquement configurées pour utiliser votre projet.
Détecter les images inappropriées
Vous utiliserez le déclencheur functions.storage.onChange Cloud Functions, qui exécute votre code dès qu'un fichier ou un dossier est créé ou modifié dans un bucket Cloud Storage. Ajoutez la fonction blurOffensiveImages dans votre fichier 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.');
});
Notez que nous avons ajouté une configuration de l'instance Cloud Functions qui exécutera la fonction. Avec .runWith({memory: '2GB'}) , nous demandons que l'instance obtienne 2 Go de mémoire plutôt que la valeur par défaut, car cette fonction consomme beaucoup de mémoire.
Lorsque la fonction est déclenchée, l'image est exécutée via l'API Cloud Vision pour détecter si elle est signalée comme adulte ou violente. Si l'image est détectée comme inappropriée sur la base de ces critères, nous floutons l'image, ce qui est fait dans la fonction blurImage comme nous le verrons ensuite.
Brouiller l'image
Ajoutez la fonction blurImage suivante dans votre fichier 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.');
}
Dans la fonction ci-dessus, le fichier binaire de l'image est téléchargé à partir de Cloud Storage. L'image est ensuite floutée à l'aide de l'outil convert d'ImageMagick, et la version floue est rechargée sur le compartiment de stockage. Ensuite, nous supprimons le fichier sur l'instance Cloud Functions pour libérer de l'espace disque, et nous le faisons parce que la même instance Cloud Functions peut être réutilisée et si les fichiers ne sont pas nettoyés, il pourrait manquer d'espace disque. Enfin, nous ajoutons un booléen au message de chat indiquant que l'image a été modérée, et cela déclenchera un rafraîchissement du message sur le client.
Déployer la fonction
La fonction ne sera active qu'après l'avoir déployée. Sur la ligne de commande, exécutez firebase deploy --only functions :
firebase deploy --only functions
Voici la sortie de la console que vous devriez voir :
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
Testez la fonction
Une fois la fonction déployée avec succès :
- Ouvrez votre application dans votre navigateur à l'aide de l'URL d'hébergement (sous la forme
https://<project-id>.firebaseapp.com). - Une fois connecté à l'application, importez une image :
- Choisissez votre meilleure image offensante à télécharger (ou vous pouvez utiliser ce zombie mangeur de chair !) et après quelques instants, vous devriez voir votre message s'actualiser avec une version floue de l'image :
10. Notifications de nouveaux messages
Dans cette section, vous allez ajouter une fonction Cloud qui envoie des notifications aux participants du chat lorsqu'un nouveau message est publié.
À l'aide de Firebase Cloud Messaging (FCM), vous pouvez envoyer des notifications de manière fiable aux utilisateurs sur toutes les plates-formes. Pour envoyer une notification à un utilisateur, vous avez besoin de son jeton d'appareil FCM. L'application Web de chat que nous utilisons collecte déjà les jetons d'appareil des utilisateurs lorsqu'ils ouvrent l'application pour la première fois sur un nouveau navigateur ou appareil. Ces jetons sont stockés dans Cloud Firestore dans la collection fcmTokens .
Si vous souhaitez savoir comment obtenir des jetons d'appareil FCM sur une application Web, vous pouvez passer par le Firebase Web Codelab .
Envoyer des notifications
Pour détecter la publication de nouveaux messages, vous utiliserez le déclencheur functions.firestore.document().onCreate Cloud Functions, qui exécute votre code lorsqu'un nouvel objet est créé sur un chemin donné de Cloud Firestore. Ajoutez la fonction sendNotifications dans votre fichier 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.');
}
});
Dans la fonction ci-dessus, nous rassemblons tous les jetons d'appareil des utilisateurs à partir de la base de données Cloud Firestore et envoyons une notification à chacun d'eux à l'aide de la fonction admin.messaging().sendToDevice .
Nettoyer les jetons
Enfin, nous voulons supprimer les jetons qui ne sont plus valides. Cela se produit lorsque le jeton que nous avons obtenu de l'utilisateur n'est plus utilisé par le navigateur ou l'appareil. Par exemple, cela se produit si l'utilisateur a révoqué l'autorisation de notification pour la session du navigateur. Pour ce faire, ajoutez la fonction cleanupTokens suivante dans votre fichier 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);
}
Déployer la fonction
La fonction ne sera active qu'après l'avoir déployée, et pour la déployer, exécutez ceci en ligne de commande :
firebase deploy --only functions
Voici la sortie de la console que vous devriez voir :
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
Testez la fonction
- Une fois la fonction déployée avec succès, ouvrez votre application dans votre navigateur à l'aide de l'URL d'hébergement (sous la forme
https://<project-id>.firebaseapp.com). - Si vous vous connectez à l'application pour la première fois, assurez-vous d'autoriser les notifications lorsque vous y êtes invité :
- Fermez l'onglet de l'application de chat ou affichez un autre onglet : les notifications n'apparaissent que si l'application est en arrière-plan. Si vous souhaitez savoir comment recevoir des messages lorsque votre application est au premier plan, consultez notre documentation .
- À l'aide d'un autre navigateur (ou d'une fenêtre de navigation privée), connectez-vous à l'application et publiez un message. Vous devriez voir une notification affichée par le premier navigateur :
11. Félicitations !
Vous avez utilisé le SDK Firebase pour Cloud Functions et ajouté des composants côté serveur à une application de chat.
Ce que nous avons couvert
- Création de fonctions Cloud à l'aide du SDK Firebase pour Cloud Functions.
- Déclenchez Cloud Functions en fonction des événements Auth, Cloud Storage et Cloud Firestore.
- Ajoutez la prise en charge de Firebase Cloud Messaging à votre application Web.
- Déployez Cloud Functions à l'aide de la CLI Firebase.
Prochaines étapes
- En savoir plus sur les autres types de déclencheurs Cloud Function .
- Utilisez Firebase et Cloud Functions avec votre propre application.