Guides

Comment ajouter des signatures électroniques à votre application Base44

Écrit par

Contenu

Les applications Base44 gèrent de véritables processus métier : propositions, contrats de service, formulaires d'admission, documents d'intégration. Rien de tout cela ne se conclut proprement sans signature, et Base44 n'en propose pas par défaut. Firma.dev comble ce manque avec une API de signature électronique que vous pouvez intégrer à n'importe quelle application Base44 en un après-midi, et non en un sprint.

Comment ça marche (sans les détails techniques)

Firma.dev vous offre deux façons de connecter une application Base44, et votre choix dépend du nombre d'applications que vous utilisez.

S'il s'agit d'une seule application, vous écrivez une fonction backend : un petit morceau de TypeScript qui appelle l'API REST de Firma.dev pour créer une demande de signature, l'envoyer et écouter la signature qui revient. Base44 garde votre clé API verrouillée dans un secret, de sorte qu'elle ne touche jamais le navigateur.

Si vous gérez un espace de travail avec plusieurs applications, vous enregistrez Firma.dev une seule fois en tant qu'intégration personnalisée à l'aide de sa spécification OpenAPI. Après cela, chaque application de l'espace de travail peut appeler directement les points de terminaison de Firma.dev via le SDK Base44, sans fonction distincte par application.

Les deux chemins mènent au même résultat : un signataire ouvre le document, le signe directement intégré dans votre application, et un webhook informe votre backend dès que c'est fait.

Ce dont vous avez besoin au préalable

  • Un compte Firma.dev avec une clé API

  • Une application Base44 avec le forfait Builder ou supérieur (requis pour les fonctions backend et les intégrations personnalisées)

  • Un modèle Firma.dev avec des champs de signature déjà configurés

Option 1 : fonctions backend

C'est la voie la plus flexible, et celle vers laquelle se tourner si vous connectez une seule application.

Enregistrez la clé. Dans l'éditeur Base44, allez dans Dashboard → Secrets, ajoutez un nouveau secret et nommez-le FIRMA_API_KEY. Ne placez jamais la clé dans le code frontend, seules les fonctions backend doivent pouvoir la voir.

Écrivez la fonction. Sous Dashboard → Code → Functions, créez une nouvelle fonction (ou demandez à l'IA de Base44 d'en générer une). Voici l'exemple exact tiré de la documentation de Firma.dev, qui crée et envoie une demande de signature à partir d'un modèle en un seul appel :

import { createClientFromRequest } from "npm:@base44/sdk";

const FIRMA_API = "https://api.firma.dev/functions/v1/signing-request-api";

Deno.serve(async (req) => {
  const base44 = createClientFromRequest(req);
  const user = await base44.auth.me();

  if (!user) {
    return Response.json({ error: "Unauthorized" }, { status: 401 });
  }

  const { template_id, signer_email, signer_first_name, signer_last_name } =
    await req.json();

  const apiKey = Deno.env.get("FIRMA_API_KEY");

  // Create and send a signing request from a template in one call
  const response = await fetch(
    `${FIRMA_API}/signing-requests/create-and-send`,
    {
      method: "POST",
      headers: {
        Authorization: apiKey,
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        template_id,
        recipients: [
          {
            first_name: signer_first_name,
            last_name: signer_last_name,
            email: signer_email,
            designation: "Signer",
            order: 1,
          },
        ],
      }),
    }
  );

  const data = await response.json();

  if (!response.ok) {
    return Response.json({ error: data }, { status: response.status });
  }

  return Response.json({
    signing_request_id: data.id,
    status: "sent",
  });
});
import { createClientFromRequest } from "npm:@base44/sdk";

const FIRMA_API = "https://api.firma.dev/functions/v1/signing-request-api";

Deno.serve(async (req) => {
  const base44 = createClientFromRequest(req);
  const user = await base44.auth.me();

  if (!user) {
    return Response.json({ error: "Unauthorized" }, { status: 401 });
  }

  const { template_id, signer_email, signer_first_name, signer_last_name } =
    await req.json();

  const apiKey = Deno.env.get("FIRMA_API_KEY");

  // Create and send a signing request from a template in one call
  const response = await fetch(
    `${FIRMA_API}/signing-requests/create-and-send`,
    {
      method: "POST",
      headers: {
        Authorization: apiKey,
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        template_id,
        recipients: [
          {
            first_name: signer_first_name,
            last_name: signer_last_name,
            email: signer_email,
            designation: "Signer",
            order: 1,
          },
        ],
      }),
    }
  );

  const data = await response.json();

  if (!response.ok) {
    return Response.json({ error: data }, { status: response.status });
  }

  return Response.json({
    signing_request_id: data.id,
    status: "sent",
  });
});
import { createClientFromRequest } from "npm:@base44/sdk";

const FIRMA_API = "https://api.firma.dev/functions/v1/signing-request-api";

Deno.serve(async (req) => {
  const base44 = createClientFromRequest(req);
  const user = await base44.auth.me();

  if (!user) {
    return Response.json({ error: "Unauthorized" }, { status: 401 });
  }

  const { template_id, signer_email, signer_first_name, signer_last_name } =
    await req.json();

  const apiKey = Deno.env.get("FIRMA_API_KEY");

  // Create and send a signing request from a template in one call
  const response = await fetch(
    `${FIRMA_API}/signing-requests/create-and-send`,
    {
      method: "POST",
      headers: {
        Authorization: apiKey,
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        template_id,
        recipients: [
          {
            first_name: signer_first_name,
            last_name: signer_last_name,
            email: signer_email,
            designation: "Signer",
            order: 1,
          },
        ],
      }),
    }
  );

  const data = await response.json();

  if (!response.ok) {
    return Response.json({ error: data }, { status: response.status });
  }

  return Response.json({
    signing_request_id: data.id,
    status: "sent",
  });
});

Si vous préférez examiner une demande avant qu'elle ne soit envoyée, la documentation de Firma.dev indique l'alternative : POST /signing-requests pour créer un brouillon, puis POST /signing-requests/{id}/send séparément.

Connectez-la à l'interface utilisateur. Appelez la fonction depuis le frontend avec le SDK Base44 :

import { base44 } from "@/api/base44Client";

const response = await base44.functions.invoke("sendSigningRequest", {
  template_id: "your-template-id",
  signer_email: "alice@example.com",
  signer_first_name: "Alice",
  signer_last_name: "Johnson",
});
import { base44 } from "@/api/base44Client";

const response = await base44.functions.invoke("sendSigningRequest", {
  template_id: "your-template-id",
  signer_email: "alice@example.com",
  signer_first_name: "Alice",
  signer_last_name: "Johnson",
});
import { base44 } from "@/api/base44Client";

const response = await base44.functions.invoke("sendSigningRequest", {
  template_id: "your-template-id",
  signer_email: "alice@example.com",
  signer_first_name: "Alice",
  signer_last_name: "Johnson",
});

Ou dites simplement à l'IA de Base44 ce que vous voulez : « Lorsque l'utilisateur clique sur "Envoyer le contrat", appelle la fonction sendSigningRequest avec l'ID du modèle, l'e-mail du signataire et le nom issus du formulaire. »

Suivez les finalisations à l'aide d'un webhook. Créez une fonction backend pour recevoir l'événement, puis enregistrez-la dans Firma.dev sous Paramètres → Webhooks, en pointant vers https://<your-app-domain>/functions/<function-name>.

import { createClientFromRequest } from "npm:@base44/sdk";

Deno.serve(async (req) => {
  const base44 = createClientFromRequest(req);
  const payload = await req.json();
  const { type, data } = payload;

  if (type === "signing_request.completed") {
    const signingRequestId = data.signing_request.id;

    // Update your app's database or trigger the next step
    // in your workflow using the Base44 entities SDK
  }

  return Response.json({ received: true });
});
import { createClientFromRequest } from "npm:@base44/sdk";

Deno.serve(async (req) => {
  const base44 = createClientFromRequest(req);
  const payload = await req.json();
  const { type, data } = payload;

  if (type === "signing_request.completed") {
    const signingRequestId = data.signing_request.id;

    // Update your app's database or trigger the next step
    // in your workflow using the Base44 entities SDK
  }

  return Response.json({ received: true });
});
import { createClientFromRequest } from "npm:@base44/sdk";

Deno.serve(async (req) => {
  const base44 = createClientFromRequest(req);
  const payload = await req.json();
  const { type, data } = payload;

  if (type === "signing_request.completed") {
    const signingRequestId = data.signing_request.id;

    // Update your app's database or trigger the next step
    // in your workflow using the Base44 entities SDK
  }

  return Response.json({ received: true });
});

Option 2 : intégration OpenAPI au niveau de l'espace de travail

Vous utilisez plusieurs applications Base44 ? Configurez cela une seule fois et chaque application de l'espace de travail en héritera.

Depuis votre icône de profil, allez dans Paramètres → Intégrations → Nouvelle intégration → À partir d'une URL, et collez l'URL de la spécification OpenAPI de Firma.dev (consultez le journal des modifications de l'API de Firma.dev pour obtenir la version actuelle). Choisissez les points de terminaison dont vous avez besoin, jusqu'à 30, généralement :

  • POST /signing-requests — créer une demande de signature à partir d'un modèle ou d'un document

  • POST /signing-requests/create-and-send — créer et envoyer en un seul appel

  • GET /signing-requests/{id} — vérifier le statut

  • GET /signing-requests — lister les demandes de signature

  • POST /templates/{id}/duplicate — dupliquer un modèle dans une demande de signature

  • GET /templates — lister les modèles disponibles

Pour l'authentification, définissez l'URL de base sur https://api.firma.dev/functions/v1/signing-request-api, puis ajoutez un en-tête personnalisé nommé Authorization avec votre clé API Firma.dev comme valeur. Base44 la chiffre et la stocke au niveau de l'espace de travail, elle ne parvient jamais au navigateur.

À partir de là, n'importe quelle application appelle directement Firma.dev :

const result = await base44.integrations.custom.call(
  "firma",
  "post:/signing-requests/create-and-send",
  {
    payload: {
      template_id: templateId,
      recipients: [
        {
          first_name: "Alice",
          last_name: "Johnson",
          email: "alice@example.com",
          designation: "Signer",
          order: 1,
        },
      ],
    },
  }
);
const result = await base44.integrations.custom.call(
  "firma",
  "post:/signing-requests/create-and-send",
  {
    payload: {
      template_id: templateId,
      recipients: [
        {
          first_name: "Alice",
          last_name: "Johnson",
          email: "alice@example.com",
          designation: "Signer",
          order: 1,
        },
      ],
    },
  }
);
const result = await base44.integrations.custom.call(
  "firma",
  "post:/signing-requests/create-and-send",
  {
    payload: {
      template_id: templateId,
      recipients: [
        {
          first_name: "Alice",
          last_name: "Johnson",
          email: "alice@example.com",
          designation: "Signer",
          order: 1,
        },
      ],
    },
  }
);

Demandez également à l'IA de Base44 de connecter les appels Firma.dev ici, elle détecte l'intégration de l'espace de travail et l'utilise de manière autonome.

Signature intégrée

Pour les applications où vous souhaitez que le signataire complète le document sans quitter votre interface utilisateur, récupérez le signing_request_user_id de la réponse de l'API et chargez-le dans une iframe :

<iframe
  src="https://app.firma.dev/signing/{signing_request_user_id}"
  style="width:100%;height:900px;border:0;"
  allow="camera;microphone;clipboard-write"
  title="Document Signing"
></iframe>
<iframe
  src="https://app.firma.dev/signing/{signing_request_user_id}"
  style="width:100%;height:900px;border:0;"
  allow="camera;microphone;clipboard-write"
  title="Document Signing"
></iframe>
<iframe
  src="https://app.firma.dev/signing/{signing_request_user_id}"
  style="width:100%;height:900px;border:0;"
  allow="camera;microphone;clipboard-write"
  title="Document Signing"
></iframe>

Ce que vous obtenez de façon prête à l'emploi

Chaque demande de signature créée de cette manière hérite du véritable produit de Firma.dev, et non d'une simple API simplifiée : un éditeur de modèles intégrable pour créer des documents, des espaces de travail clients si vous exécutez une application Base44 multi-entités, et une validité juridique dans plus de 55 pays sous les normes SES et AES (alignées sur eIDAS ; Firma.dev ne propose pas encore de QES).

Des tarifs adaptés aux développeurs

Les applications Base44 en sont généralement à leurs débuts, ce qui rend les outils de signature facturés par utilisateur inadaptés avant même que vous n'ayez une équipe complète. Firma.dev propose plutôt des tarifs par enveloppe : 0,049 € (~5¢), paiement à l'usage, pas de minimum mensuel, pas de contrat. Par rapport aux tarifs par utilisateur de DocuSign, c'est 97 à 99 % moins cher, quel que soit le volume que vous êtes susceptible d'atteindre pendant votre phase de développement.

Envoyez ceci à votre développeur (ou faites-le vous-même)

Les deux chemins ci-dessus sont prêts à être copiés-collés, et la plupart des créateurs sur Base44 auront cela en fonctionnement en moins d'une heure. Si vous souhaitez que l'IA de Base44 s'occupe de l'intégration, orientez-la vers le guide d'intégration de Base44 de Firma.dev pour qu'elle puisse générer directement les fonctions. Firma.dev dispose également d'un serveur Docs MCP que vous pouvez ajouter sous Paramètres du compte → Connexions MCP afin que l'IA puisse récupérer des détails précis sur l'API pendant que vous développez.

Commencez à utiliser Firma.dev gratuitement, sans carte de crédit requise.

  1. Titre

Articles connexes

Notre plateforme est conçue pour permettre aux entreprises de toutes tailles de travailler plus intelligemment et d'atteindre leurs objectifs avec confiance.

Image de fond

Prêt à ajouter des signatures électroniques à votre application ?

Commencez gratuitement. Aucune carte de crédit requise. Payez seulement 0,049 € par enveloppe lorsque vous serez prêt à lancer votre activité.

Image de fond

Prêt à ajouter des signatures électroniques à votre application ?

Commencez gratuitement. Aucune carte de crédit requise. Payez seulement 0,049 € par enveloppe lorsque vous serez prêt à lancer votre activité.

Image de fond

Prêt à ajouter des signatures électroniques à votre application ?

Commencez gratuitement. Aucune carte de crédit requise. Payez seulement 0,049 € par enveloppe lorsque vous serez prêt à lancer votre activité.