Cómo añadir firmas electrónicas a tu aplicación de Base44

Las aplicaciones de Base44 gestionan procesos de negocio reales: propuestas, acuerdos de servicio, formularios de admisión, documentación de incorporación. Nada de eso se cierra limpiamente sin una firma, y Base44 no incluye ninguna. Firma.dev llena ese vacío con una API de firma electrónica que puedes integrar en cualquier aplicación de Base44 en una tarde, no en un sprint.

Cómo funciona (sin los detalles técnicos)

Firma.dev te ofrece dos formas de conectar una aplicación de Base44, y cuál elijas depende de cuántas aplicaciones estés ejecutando.

Si se trata de una sola aplicación, escribes una función de backend: un pequeño fragmento de TypeScript que llama a la API REST de Firma.dev para crear una solicitud de firma, enviarla y escuchar cuando vuelva la firma. Base44 mantiene tu clave API bloqueada en un secreto, por lo que nunca toca el navegador.

Si estás ejecutando un espacio de trabajo con varias aplicaciones, registras Firma.dev una vez como una integración personalizada utilizando su especificación OpenAPI. Después de eso, cada aplicación en el espacio de trabajo puede llamar a los endpoints de Firma.dev directamente a través del SDK de Base44, sin necesidad de una función independiente por aplicación.

Cualquiera de los dos caminos termina de la misma manera: un firmante abre el documento, lo firma incrustado directamente dentro de tu aplicación y un webhook le avisa a tu backend en el momento en que se completa.

Qué necesitas primero

• Una cuenta de Firma.dev con una clave API

• Una aplicación de Base44 en el plan Builder o superior (necesario para funciones de backend e integraciones personalizadas)

• Una plantilla de Firma.dev con campos de firma ya configurados

Camino 1: funciones de backend

Esta es la ruta más flexible, y la ideal si estás conectando una sola aplicación.

Guarda la clave. En el editor de Base44, ve a Dashboard → Secrets, añade un nuevo secreto y nombralo FIRMA_API_KEY. Nunca pongas la clave en el código del frontend, solo las funciones de backend deben verla.

Escribe la función. En Dashboard → Code → Functions, crea una nueva función (o haz que el chat de IA de Base44 genere una). Este es el ejemplo exacto de la documentación de Firma.dev, que crea y envía una solicitud de firma desde una plantilla en una sola llamada:

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 prefieres revisar una solicitud antes de enviarla, la documentación de Firma.dev indica la alternativa: usar POST /signing-requests para crear un borrador y luego POST /signing-requests/{id}/send por separado.

Conéctalo a la interfaz de usuario. Llama a la función desde el frontend con el SDK de 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",
});

O simplemente dile al chat de IA de Base44 lo que quieres: "Cuando el usuario haga clic en 'Enviar contrato', llama a la función sendSigningRequest con el ID de la plantilla, el correo electrónico del firmante y el nombre del formulario".

Realiza el seguimiento de las finalizaciones con un webhook. Crea una función de backend para recibir el evento, luego regístrala en Firma.dev en Configuración → Webhooks, apuntando a https://<tu-dominio-de-app>/functions/<nombre-de-funcion>.

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

Camino 2: integración de OpenAPI a nivel de espacio de trabajo

¿Ejecutas más de una aplicación de Base44? Configura esto una vez y cada aplicación en el espacio de trabajo lo heredará.

Desde tu icono de perfil, ve a Configuración → Integraciones → Nueva integración → Desde URL, y pega la URL de la especificación OpenAPI de Firma.dev (consulta el registro de cambios de la API de Firma.dev para ver la versión actual). Elige los endpoints que necesites, hasta un máximo de 30, que suelen ser:

• POST /signing-requests — crea una solicitud de firma a partir de una plantilla o documento

• POST /signing-requests/create-and-send — crea y envía en una sola llamada

• GET /signing-requests/{id} — comprueba el estado

• GET /signing-requests — lista las solicitudes de firma

• POST /templates/{id}/duplicate — duplica una plantilla en una solicitud de firma

• GET /templates — lista las plantillas disponibles

Para la autenticación, establece la URL base en https://api.firma.dev/functions/v1/signing-request-api, luego añade un encabezado personalizado llamado Authorization con tu clave API de Firma.dev como valor. Base44 lo cifra y almacena a nivel de espacio de trabajo, por lo que nunca llega al navegador.

A partir de ahí, cualquier aplicación puede llamar a Firma.dev directamente:

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

Pídele al chat de IA de Base44 que conecte las llamadas de Firma.dev aquí también, detectará la integración del espacio de trabajo y la utilizará por su cuenta.

Firma incrustada

Para las aplicaciones en las que deseas que el firmante complete el documento sin salir de tu interfaz de usuario, extrae el signing_request_user_id de la respuesta de la API y cárgalo en un 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>

Lo que obtienes de forma nativa

Cada solicitud de firma creada de esta manera hereda el producto real de Firma.dev, no un contenedor de API simplificado: un editor de plantillas incrustable para crear documentos, espacios de trabajo para clientes si ejecutas una aplicación multi-inquilino de Base44 y validez legal en más de 55 países bajo SES y AES (alineados con eIDAS; Firma.dev aún no ofrece QES).

El precio tiene sentido para los creadores

Las aplicaciones de Base44 suelen estar en una fase inicial, lo que hace que las herramientas de firma por usuario no sean adecuadas antes de tener un equipo completo. En su lugar, Firma.dev cobra por sobre: 0,049 € (~5 ¢), pago por uso, sin mínimo mensual, sin contrato. Frente a los precios por usuario de DocuSign, esto resulta entre un 97 % y un 99 % más barato para cualquier volumen que puedas alcanzar mientras construyes.

Envía esto a tu desarrollador (o hazlo tú mismo)

Ambos caminos de arriba se pueden copiar y pegar, y la mayoría de los creadores en Base44 tendrán esto funcionando en menos de una hora. Si quieres que el chat de IA se encargue de la integración, dirígelo a la guía de integración de Base44 de Firma.dev y podrá generar las funciones directamente. Firma.dev también tiene un servidor MCP de Docs que puedes añadir en Configuración de la cuenta → Conexiones MCP para que el chat de IA pueda obtener detalles precisos de la API mientras construyes.

Comienza con Firma.dev de forma gratuita, sin necesidad de tarjeta de crédito.