So fügen Sie elektronische Signaturen zu Ihrer Base44-App hinzu

Base44-Apps verarbeiten echte Geschäftsprozesse: Angebote, Servicevereinbarungen, Aufnahmeformulare, Onboarding-Dokumente. Nichts davon lässt sich ohne Unterschrift sauber abschließen, und Base44 liefert keine mit. Firma.dev schließt diese Lücke mit einer E-Signatur-API, die Sie an einem Nachmittag und nicht in einem Sprint in jede Base44-App einbinden können.

Wie es funktioniert (ohne die technischen Details)

Firma.dev bietet Ihnen zwei Möglichkeiten, eine Base44-App zu verbinden, und für welche Sie sich entscheiden, hängt davon ab, wie viele Apps Sie betreiben.

Wenn es sich um eine einzelne App handelt, schreiben Sie eine Backend-Funktion: ein kleines Stück TypeScript, das die REST-API von Firma.dev aufruft, um eine Signaturanforderung zu erstellen, sie zu senden und auf die zurückkommende Signatur zu warten. Base44 hält Ihren API-Schlüssel in einem Secret verschlossen, sodass er niemals mit dem Browser in Berührung kommt.

Wenn Sie einen Workspace mit mehreren Apps betreiben, registrieren Sie Firma.dev einmal als benutzerdefinierte Integration unter Verwendung der OpenAPI-Spezifikation. Danach kann jede App im Workspace die Endpunkte von Firma.dev direkt über das Base44-SDK aufrufen, ohne dass eine separate Funktion pro App erforderlich ist.

Beide Wege führen zum selben Ziel: Ein Unterzeichner öffnet das Dokument, unterzeichnet es direkt in Ihre App eingebettet, und ein Webhook benachrichtigt Ihr Backend, sobald es fertig ist.

Was Sie zuerst benötigen

• Ein Firma.dev-Konto mit einem API-Schlüssel

• Eine Base44-App im Builder-Tarif oder höher (erforderlich für Backend-Funktionen und benutzerdefinierte Integrationen)

• Eine Firma.dev-Vorlage mit bereits eingerichteten Signaturfeldern

Weg 1: Backend-Funktionen

Dies ist der flexiblere Weg und derjenige, den Sie wählen sollten, wenn Sie eine einzelne App anbinden.

Speichern Sie den Schlüssel. Gehen Sie im Base44-Editor zu Dashboard → Secrets, fügen Sie ein neues Secret hinzu und nennen Sie es FIRMA_API_KEY. Fügen Sie den Schlüssel niemals in den Frontend-Code ein, nur Backend-Funktionen sollten ihn jemals sehen.

Schreiben Sie die Funktion. Erstellen Sie unter Dashboard → Code → Functions eine neue Funktion (oder lassen Sie eine vom Base44-KI-Chat generieren). Dies ist das genaue Beispiel aus der Dokumentation von Firma.dev, das eine Signaturanforderung aus einer Vorlage in einem einzigen Aufruf erstellt und sendet:

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",
  });
});

Wenn Sie eine Anforderung lieber überprüfen möchten, bevor sie versendet wird, weisen die Dokumente von Firma.dev auf die Alternative hin: POST /signing-requests, um einen Entwurf zu erstellen, und dann separat POST /signing-requests/{id}/send.

Verbinden Sie es mit der UI. Rufen Sie die Funktion vom Frontend aus mit dem Base44-SDK auf:

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",
});

Oder sagen Sie dem Base44-KI-Chat einfach, was Sie möchten: „Wenn der Benutzer auf ‚Vertrag senden‘ klickt, rufen Sie die Funktion sendSigningRequest mit der Vorlagen-ID, der E-Mail des Unterzeichners und dem Namen aus dem Formular auf.“

Verfolgen Sie Fertigstellungen mit einem Webhook. Erstellen Sie eine Backend-Funktion, um das Ereignis zu empfangen, und registrieren Sie sie dann in Firma.dev unter Einstellungen → Webhooks, indem Sie auf https://<ihre-app-domain>/functions/<funktionsname> verweisen.

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 });
});

Weg 2: OpenAPI-Integration auf Workspace-Ebene

Betreiben Sie mehr als eine Base44-App? Richten Sie dies einmal ein, und jede App im Workspace erbt es.

Gehen Sie über Ihr Profilsymbol zu Einstellungen → Integrationen → Neue Integration → Von URL und fügen Sie die OpenAPI-Spezifikations-URL von Firma.dev ein (überprüfen Sie das API-Changelog von Firma.dev auf die aktuelle Version). Wählen Sie die Endpunkte aus, die Sie benötigen, bis zu 30, üblicherweise:

• POST /signing-requests — Erstellt eine Signaturanforderung aus einer Vorlage oder einem Dokument

• POST /signing-requests/create-and-send — Erstellt und sendet in einem einzigen Aufruf

• GET /signing-requests/{id} — Überprüft den Status

• GET /signing-requests — Listet Signaturanforderungen auf

• POST /templates/{id}/duplicate — Dupliziert eine Vorlage in eine Signaturanforderung

• GET /templates — Listet verfügbare Vorlagen auf

Setzen Sie für die Authentifizierung die Basis-URL auf https://api.firma.dev/functions/v1/signing-request-api und fügen Sie dann einen benutzerdefinierten Header namens Authorization mit Ihrem Firma.dev-API-Schlüssel als Wert hinzu. Base44 verschlüsselt und speichert ihn auf Workspace-Ebene, er gelangt niemals in den Browser.

Von dort aus ruft jede App Firma.dev direkt auf:

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,
        },
      ],
    },
  }
);

Bitten Sie den Base44-KI-Chat, auch hier die Aufrufe von Firma.dev einzurichten; er erkennt die Workspace-Integration und verwendet sie selbstständig.

Eingebettetes Unterzeichnen

Für Apps, bei denen der Unterzeichner das Dokument ausfüllen soll, ohne Ihre Benutzeroberfläche zu verlassen, rufen Sie die signing_request_user_id aus der API-Antwort ab und laden Sie sie in einem 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>

Was Sie sofort einsatzbereit erhalten

Jede auf diese Weise erstellte Signaturanforderung erbt das tatsächliche Produkt von Firma.dev, nicht nur einen abgespeckten API-Wrapper: einen einbettbaren Vorlagen-Editor zum Erstellen von Dokumenten, Customer Workspaces, wenn Sie eine mandantenfähige Base44-App betreiben, und Rechtsgültigkeit in über 55 Ländern unter SES und AES (eIDAS-konform; Firma.dev bietet derzeit noch keine QES an).

Die Preisgestaltung ist für Entwickler sinnvoll

Base44-Apps befinden sich meist in einer frühen Phase, was Tools zur Unterzeichnung pro Arbeitsplatz unpassend macht, noch bevor Sie ein vollständiges Team haben. Firma.dev berechnet stattdessen pro Umschlag: 0,049 € (~5 ¢), Pay-as-you-go, ohne monatlichen Mindestumsatz, ohne Vertrag. Verglichen mit der Preisgestaltung pro Benutzer von DocuSign ist das bei jedem Volumen, das Sie beim Aufbau wahrscheinlich erreichen werden, um 97–99 % günstiger.

Senden Sie dies an Ihren Entwickler (oder machen Sie es selbst)

Beide oben genannten Wege können kopiert und eingefügt werden, und die meisten Base44-Entwickler werden dies in weniger als einer Stunde am Laufen haben. Wenn Sie möchten, dass der KI-Chat die Verknüpfung übernimmt, verweisen Sie ihn auf das Base44-Integrationshandbuch von Firma.dev, damit er die Funktionen direkt generieren kann. Firma.dev verfügt außerdem über einen Docs-MCP-Server, den Sie unter Kontoeinstellungen → MCP-Verbindungen hinzufügen können, sodass der KI-Chat während der Entwicklung genaue API-Details abrufen kann.

Starten Sie kostenlos mit Firma.dev, keine Kreditkarte erforderlich.