Comment envoyer et recevoir des SMS avec Firebase Functions (Tutoriel)

Cet article a été mis à jour en octobre 2025

La plateforme Firebase permet aux développeurs de construire rapidement un backend d'application. Elle est également agréable à utiliser. Pour ce tutoriel, je voulais commencer à l'utiliser pour envoyer des SMS avec Vonage. Ci-dessous, je vous montrerai comment recevoir et envoyer des SMS à l'aide de Firebase. Après avoir terminé ces étapes, vous serez en mesure de créer un journal de messages SMS et une réponse à l'expéditeur en utilisant. Firebase Cloud Functions et la base de données en temps réel avec l'API SMS de Vonage.

Cet article de blog utilise la Gen 1 de Firebase ; vous pouvez également apprendre à envoyer des SMS avec Cloud Functions for Firebase Gen 2 ici.

Vous pouvez voir le code complet sur GitHub.

Vous pouvez également trouver ce tutoriel sous forme de vidéo :

Avant de commencer

Vous aurez besoin de quelques éléments pour commencer - prenez donc un moment pour vous assurer que vous avez ces deux éléments prêts à l'emploi.

• A compte Firebase Account.

Ce tutoriel comporte trois sections principales :

• Tout d'abord, nous allons vous montrer comment configurer Firebase pour votre projet.

• Ensuite, nous allons vous montrer comment créer une fonction pour recevoir des SMS dans Firebase.

• Enfin, nous verrons comment créer une fonction qui envoie des SMS dans Firebase.

Mise en place de Firebase

La première étape consiste à créer un projet Firebase. Ce qui suit vous montrera comment configurer un nouveau projet en utilisant la console Firebase.

Créer le projet Firebase

1. Accédez à la console Firebase

2. Cliquez sur Ajouter un projet, ajoutez un nom de projet et cliquez sur Continuer.

Create a Project

1. Nous n'utiliserons pas Google Analytics pour ce projet, mais n'hésitez pas à l'ajouter si vous le souhaitez, puis cliquez sur Créer un projet (si vous l'avez ajouté).

Add analytics

3. Attendez un peu que le projet soit créé - cela prend moins d'une minute.

4. Définissez le type de facturation sous ⚙️ -> Utilisation et facturation -> Détails et paramètres à Blaze. Le plan "Pay-as-you-go" est nécessaire pour utiliser une API tierce. Plus d'informations sur la facturation avec Google.

1. Change Billing

2. Fixer le Google Cloud Platform (GCP) resource location dans ⚙️ -> Project Settings.

   Update Location

Installer les outils Firebase

Presque tout ce que vous aurez besoin de faire avec Firebase peut être fait directement à partir de la ligne de commande avec l'ensemble des outils qu'ils fournissent.

1. Installez les outils Firebase avec npm.

1. Connectez-vous à Firebase en utilisant firebase login. Le processus de connexion ouvrira votre navigateur pour l'authentification.

Configuration de l'environnement local

L'écriture de fonctions Cloud pour Firebase nécessite un travail d'initialisation pour démarrer, mais il est en grande partie réalisé à l'aide des commandes Firebase Tools.

1. Créer un dossier de projet mkdir vonage-project && cd vonage-project.

2. Initialiser les fonctions cloud pour Firebase firebase init functions.

######## #### ########  ######## ########     ###     ######  ########
     ##        ##  ##     ## ##       ##     ##  ##   ##  ##       ##
     ######    ##  ########  ######   ########  #########  ######  ######
     ##        ##  ##    ##  ##       ##     ## ##     ##       ## ##
     ##       #### ##     ## ######## ########  ##     ##  ######  ########

You're about to initialize a Firebase project in this directory:

 /your_folders/your-project-name


=== Project Setup

First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now, we'll just set up a default project.

? Please select an option: (Use arrow keys)
❯ Use an existing project
 Create a new project
 Add Firebase to an existing Google Cloud Platform project
 Don't set up a default project

Puisque vous avez déjà créé un projet dans le tableau de bord, vous pouvez sélectionner Use an existing project qui vous invitera à choisir le projet souhaité. Si vous ne l'avez pas encore fait, utilisez Create a new project et donnez-lui un nom unique pour en créer un. Vous devrez toujours aller dans la console pour mettre à jour l'emplacement et la facturation, mais c'est une autre option pour créer des projets Firebase.

1. Sélectionnez le nom du projet que vous avez créé.

2. Sélectionnez JavaScript.

3. Choisissez Y pour ESLint si vous le souhaitez (je le recommande).

4. Installer toutes les dépendances maintenant.

Ces étapes vont créer les dossiers et les fichiers nécessaires à la construction de Firebase Functions et à l'installation de toutes les dépendances. Une fois que NPM a terminé, allez dans le répertoire functions et ouvrez index.js dans votre éditeur préféré pour commencer à ajouter du code.

Créer une fonction Firebase pour recevoir des SMS

La première fonction que vous créez agira comme un webhook pour capturer et enregistrer les SMS entrants en provenance de Vonage. Cette fonction vous permettra de recevoir des SMS entrants via Firebase.

Le fichier index.js contient des exemples de code dont vous n'aurez pas besoin. Supprimez tout et commencez par le haut pour ajouter le code suivant :

const functions = require("firebase-functions/v1");

const admin = require("firebase-admin");

const serviceAccount = require("./serviceAccountKey.json");

// Initialize Firebase app for database access
admin.initializeApp({
  credential: admin.credential.cert(serviceAccount),
  databaseURL: "https://name_of_the_database.europe-west1.firebasedatabase.app",
});

L'appel admin.initializeApp(); permet aux fonctions de lire et d'écrire dans la base de données Firebase Real-Time.

Vous devez également créer un Account de service pour votre projet et ajouter votre databaseURL qui se trouve dans l'onglet "Realtime Database" de votre projet Firebase.

Ensuite, utilisez la méthode suivante pour créer votre fonction.

// This function will serve as the webhook for incoming SMS messages,
// and will log the message into the Firebase Realtime Database
exports.inboundSMS = functions.https.onRequest(async (req, res) => {
  let params;
  if (Object.keys(req.query).length === 0) {
    params = req.body;
  } else {
    params = req.query;
  }
  await admin.database().ref('/msgq').push(params);
  res.sendStatus(200);
});

La méthode inboundSMS est à l'écoute des requêtes HTTPS - ce qui est précisément ce dont le webhook de Vonage a besoin. La fonction Firebase capturera l'élément req.body au cas où il s'agirait d'un POST Method ou le req.query au cas où il s'agirait d'un GET Method. Elle l'envoie ensuite à l'objet /msgq de la base de données en temps réel en tant que journal.

Maintenant que vous avez écrit du code, assurez-vous de sauvegarder votre fichier et de déployer la fonction sur Firebase :

firebase deploy --only functions

=== Deploying to 'vonage-project'...

i deploying functions
Running command: npm --prefix "$RESOURCE_DIR""

> functions@ lint /Users/kellyjandrews/Google Drive/Apps/vonage-project/functions
> eslint .

✔ functions: Finished running predeploy script.
i functions: ensuring necessary APIs are enabled...
✔ functions: all necessary APIs are enabled
i functions: preparing functions directory for uploading...
i functions: packaged functions (38.78 KB) for uploading
✔ functions: functions folder uploaded successfully
i functions: creating Node.js 18 function inboundSMS(us-central1)...
✔ functions[inboundSMS(us-central1)]: Successful create operation.
Function URL (inboundSMS): https://us-central1-vonage-project.cloudfunctions.net/inboundSMS

✔ Deploy complete!

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

L'élément essentiel de la sortie est Function URL (inboundSMS). Cette URL est nécessaire pour configurer le webhook dans Vonage, ce que vous ferez ensuite.

À partir des paramètres du tableau de bord de paramètres du tableau de bord de Vonageassurez-vous que vous utilisez l SMS APIchoisissez post et copiez l'URL de la fonction de sortie (SMS entrant) à partir de la console de terminal, et collez-la dans le webhook sur Vonage.

Vonage Dashboard SettingsPrenez votre téléphone et envoyez un message au numéro de téléphone. Ouvrez la console Firebase et naviguez jusqu'à la page database Vous devriez voir quelque chose comme ceci :

Real-time Database Vonage Message Entry

Maintenant qu'il existe un moyen d'enregistrer les messages entrants, vous pouvez écrire une fonction pour faire quelque chose avec le message entrant.

Créer une fonction Firebase pour envoyer des SMS

Jusqu'à présent, vous avez créé une fonction Firebase liée à un numéro de téléphone Vonage pour capturer les SMS entrants. Les fonctions Firebase peuvent également réagir aux mises à jour de la base de données. Lors d'une nouvelle entrée, le code envoie un écho du texte original.

Ci-dessous, nous allons vous montrer comment créer une fonction dans Firebase qui envoie des SMS.

Commencez par ajouter Vonage à la liste des dépendances - assurez-vous de le faire dans le répertoire functions dans le répertoire

Ensuite, ajoutez dotenv à la liste des dépendances.

Créer un fichier .env et ajoutez les variables d'environnement dans le répertoire functions et ajouter les variables d'environnement dans le répertoire

Vous pouvez utiliser dot env ou ajouter les variables d'environnement suivantes à la configuration de Firebase :

Ensuite, ouvrez index.js ajouter @vonage/server-sdk aux exigences en haut de la page, et importez les variables d'environnement pour initialiser Vonage :

require("dotenv").config();

const functions = require("firebase-functions/v1");
const admin = require("firebase-admin");
const { Vonage } = require("@vonage/server-sdk");

const serviceAccount = require("./serviceAccountKey.json");

admin.initializeApp({
  credential: admin.credential.cert(serviceAccount),
  databaseURL: "https://name_of_the_database.region.firebasedatabase.app",
});

// If you are using .env
const vonage = new Vonage({
  apiKey: process.env.VONAGE_API_KEY,
  apiSecret: process.env.VONAGE_API_SECRET,
});

// If you are using the Firebase Environment Variables
const {
  api_key,
  api_secret
} = functions.config().vonage;

Vous pouvez maintenant créer la nouvelle fonction pour que Firebase envoie la réponse :

// This function listens for updates to the Firebase Realtime Database
// and sends a message back to the original sender
exports.sendSMS = functions.database
  .ref("/msgq/{pushId}")
  .onCreate(async (message) => {
    const { msisdn, text, to } = message.val();

    const resultSnapshot = await message.ref.parent
      .child("result")
      .once("value");
    if (resultSnapshot.exists()) {
      console.log("Result already exists. Exiting function.");
      return;
    }

    try {
      const responseData = await vonage.sms.send({
        to: to,
        from: msisdn,
        text: `You sent the following text: ${text}`,
      });

      if (responseData.messages && responseData.messages[0].status === "0") {
        const result = `You sent the following text: 
 ${responseData.messages[0]["message-id"]}`;
        await message.ref.parent.child("result").set(result);
        console.log(result);
        return result;
      } else {
        const errorText =
          (responseData.messages && responseData.messages[0]["error-text"]) ||
          "Unknown error";
        const errorMessage = `Message failed with error: ${errorText}`;
        console.error(errorMessage);
        return errorMessage;
      }
    } catch (err) {
      console.error("Vonage error:", err);
      return `Vonage error: ${err.message}`;
    }
  });

La nouvelle fonction surveillera les nouveaux messages ajoutés à l'objet de base de données /msgq de la base de données. Lorsqu'elle est déclenchée, l'objet Vonage complet est transmis en tant que message. Cet objet comprend msisdnqui est le numéro de téléphone d'origine - le vôtre dans ce cas, et le to qui est le numéro virtuel Vonage que vous avez acheté.

Avec les numéros de téléphone en main, ainsi que le message texte, vous pouvez maintenant faire un certain nombre de choses. Vous pouvez créer une table de recherche pour répondre avec des données spécifiques basées sur le mot-clé, le transmettre à un autre système ou, dans notre cas, envoyer le message original.

Déployez à nouveau les fonctions Firebase à partir de la ligne de commande :

firebase deploy --only functions

Prenez votre téléphone, envoyez un autre message et vous devriez recevoir une réponse qui ressemble à ceci You sent the following text: A text message sent using the Vonage SMS API.

Synthèse

Vous avez maintenant terminé toutes les étapes de ce tutoriel. Vous pouvez voir le code complet sur GitHub.

Maintenant que les premières étapes de l'envoi et de la réception de messages sont terminées, mes prochains articles développeront ce concept pour contrôler une partie de ma domotique par le biais de messages textuels.

Pour en savoir plus

• Détails sur Fonctionnalité SMS de Vonage

• Démarrer avec Fonctions Firebase

• Ajouter 2FA à une application React en utilisant Firebase Function

• Voir la version Video de ce tutoriel

• Envoyer et recevoir des SMS avec des fonctions en nuage