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 des fonctions Cloud 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'IDE/éditeur de texte 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'exemple de code. Ce répertoire contient le code de départ de l'atelier de programmation qui consiste en une application Web Chat entièrement fonctionnelle.
3. Créez un projet Firebase et configurez votre application
Créer un projet
Dans la console Firebase , cliquez sur Add Project et appelez-le FriendlyChat .
Cliquez sur Créer un projet .
Mise à niveau vers le plan Blaze
Afin d'utiliser Cloud Functions pour Firebase, vous devrez mettre à niveau 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 respecteront les limites d'utilisation de l'offre gratuite. Cependant, vous verrez de petits frais ( environ 0,03 $ ) provenant de Cloud Storage qui est utilisé pour héberger vos images de build 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 la suite d'émulateurs Firebase qui vous permettra d'émuler gratuitement les fonctions Cloud 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 Construire > 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 cloud
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 Commencer . 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 le Web comme plate-forme et cochez la case de configuration de 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 (CLI) Firebase vous permettra de servir l'application Web localement et de déployer votre application Web et vos fonctions Cloud.
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 Firebase CLI 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 mettre à niveau comme indiqué ci-dessus.
Autorisez la CLI Firebase en exécutant :
firebase login
Assurez-vous que vous êtes 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éployez et exécutez 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 servie à 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 l'Omnibar Chrome et en basculant la barre à côté de Notifications :
Nous allons maintenant ajouter quelques 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 expliquerons 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 dossier avant de continuer.
cd functions
ls
Si vous n'êtes pas familier avec Node.js , il serait utile d'en apprendre davantage avant de poursuivre l'atelier de programmation.
Le fichier package.json répertorie déjà deux dépendances obligatoires : 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
Jetons maintenant un œil au 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 importerons les modules requis, puis écrirons 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 requis 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 argument.
Ajoutons maintenant une fonction qui s'exécute lorsqu'un utilisateur se connecte pour la première fois à l'application de chat, et nous ajouterons un message de discussion pour souhaiter la bienvenue à l'utilisateur.
8. Bienvenue aux nouveaux utilisateurs
Structure des messages de discussion
Les messages publiés sur le flux de discussion FriendlyChat sont stockés dans Cloud Firestore. Jetons un coup d'œil à la structure de données que nous utilisons pour un message. Pour ce faire, postez un nouveau message sur le chat indiquant « Hello World » :
Cela devrait apparaître comme suit :
Dans la console Firebase, cliquez sur Firestore Database sous la section Build . Vous devriez voir la collection de messages et un document contenant le message que vous avez écrit :
Comme vous pouvez le constater, les messages de discussion sont stockés dans Cloud Firestore en tant que document avec name , profilePicUrl , text et timestamp ajoutés à la collection messages .
Ajout de 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 est le moyen utilisé par Node pour 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 posté par « Firebase Bot » à la liste des messages de discussion. Nous faisons cela en utilisant la méthode add sur la collection messages dans Cloud Firestore, où sont stockés les messages du chat.
Puisqu'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'après leur déploiement. 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
Tester la fonction
Une fois la fonction déployée avec succès, vous devrez avoir 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 de
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 l'authentification de la console Firebase et supprimer votre compte de la liste des utilisateurs. Ensuite, connectez-vous à nouveau.
- Une fois connecté, un message de bienvenue devrait s'afficher automatiquement :
9. Modération des images
Les utilisateurs peuvent télécharger tout type 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 nouveaux téléchargements d'images à l'aide du déclencheur functions.storage().onFinalize . Cela s'exécutera chaque fois qu'un nouveau fichier est téléchargé ou modifié dans Cloud Storage.
Pour modérer les images, nous allons suivre le processus suivant :
- Vérifiez si l'image est marqué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.
- Flou l'image en utilisant ImageMagick .
- Téléchargez l'image floue sur Cloud Storage.
Activer l'API Cloud Vision
Puisque 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 des 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 les dépendances
Pour importer les dépendances qui ont été installées et certains modules principaux 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');
Puisque 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 configurées automatiquement pour utiliser votre projet.
Détection des 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 est gourmande en 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 la floutons, ce qui se 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, l'image binaire est téléchargée depuis Cloud Storage. L'image est ensuite floue à l'aide de l'outil convert d'ImageMagick, et la version floue est à nouveau téléchargé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 car la même instance Cloud Functions peut être réutilisée et si les fichiers ne sont pas nettoyés, elle pourrait manquer d'espace disque. Enfin, nous ajoutons un booléen au message de discussion indiquant que l'image a été modérée, ce qui 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
Tester 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 de
https://<project-id>.firebaseapp.com). - Une fois connecté à l'application, téléchargez 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 ajouterez une fonction Cloud qui envoie des notifications aux participants du chat lorsqu'un nouveau message est publié.
Grâce à Firebase Cloud Messaging (FCM), vous pouvez envoyer de manière fiable des notifications aux utilisateurs sur toutes les plateformes. 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 de périphérique FCM sur une application Web, vous pouvez consulter 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 les jetons d'appareil de tous les 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 souhaitons supprimer les tokens 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
Tester 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 de
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 apprendre à 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 des fonctions Cloud 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
- Découvrez les autres types de déclencheurs Cloud Function .
- Utilisez Firebase et Cloud Functions avec votre propre application.