> For the complete documentation index, see [llms.txt](https://docs.afipsdk.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.afipsdk.com/integracion/ai-builders/lovable.md).

# Lovable

### Requisitos previos

Para poder seguir esta guía, primero necesitarás:

* [Obtener un access\_token de Afip SDK](https://app.afipsdk.com)
* Tener un proyecto en Lovable
* Definir el CUIT que vas a usar
* Elegir el Web Service ID, por ejemplo `wsfe` para factura electrónica

### 1. Configuración

Lovable puede generar la pantalla y el backend desde un prompt, pero el access token de Afip SDK tiene que quedar guardado como secret del proyecto.

Agregá estas variables en la configuración de Lovable:

{% tabs %}
{% tab title="Secrets" %}

```bash
AFIPSDK_ACCESS_TOKEN=TU_ACCESS_TOKEN
AFIPSDK_TAX_ID=20409378472
AFIPSDK_WSID=wsfe
```

{% endtab %}
{% endtabs %}

{% hint style="warning" %}
No uses el access token en componentes frontend, variables públicas, HTML o código visible desde el navegador.
{% endhint %}

### 2. Crear la integración en Lovable

Pedile a Lovable que cree una pantalla y una función backend para llamar a Afip SDK. La pantalla solo debe enviar los datos de la consulta a tu backend; el backend es el único lugar donde se lee `AFIPSDK_ACCESS_TOKEN`.

{% tabs %}
{% tab title="Prompt" %}

```
Integrá un web service de ARCA usando Afip SDK en esta app de Lovable.

Quiero una pantalla llamada "ARCA Web Service" con:
- Un formulario para ingresar CUIT sin guiones.
- Un selector de ambiente: dev o prod.
- Un campo para Web Service ID, por ejemplo wsfe.
- Un textarea para cargar el payload JSON del método del web service.
- Un botón para ejecutar la consulta.
- Estados visibles de loading, success y error.
- Un panel para mostrar el resultado JSON.

Backend:
- Creá una función backend o endpoint propio para toda la lógica de Afip SDK.
- Leé el token desde un secret llamado AFIPSDK_ACCESS_TOKEN.
- Si falta AFIPSDK_ACCESS_TOKEN, devolvé un error claro de configuración.
- Primero obtené el Ticket de Acceso llamando a POST https://app.afipsdk.com/api/v1/afip/auth.
- Enviá Authorization: Bearer TU_ACCESS_TOKEN.
- Enviá body JSON con environment, tax_id y wsid.
- Usá token y sign devueltos por Afip SDK para llamar al método del web service elegido.
- Devolvé al frontend solo el resultado final y errores claros.

Reglas:
- No hardcodees tokens, certificados ni keys.
- No uses secrets en componentes frontend.
- No inventes endpoints, campos ni estructuras de respuesta.
- Usá solo esta documentación:
  - https://docs.afipsdk.com/integracion/api
  - https://docs.afipsdk.com/siguientes-pasos/web-services/
  - https://docs.afipsdk.com/siguientes-pasos/web-services/otro-web-service
  - https://afipsdk.com/docs/api-reference/introduction/

Si falta información del método del web service, dejá un TODO claro indicando qué dato hay que completar según la documentación.
```

{% endtab %}
{% endtabs %}

### 3. Llamar al método del Web Service que necesites

Con el backend creado ya podés realizar llamadas a los Web Services que necesites.

{% content-ref url="/pages/mVTz5YrKc8PCEeJKHt0W" %}
[Web services](/siguientes-pasos/web-services.md)
{% endcontent-ref %}

Si el Web Service que necesitás no se encuentra en la lista de la documentación, podés llamarlo siguiendo esta guía:

{% content-ref url="/pages/4zlCsTNGo99FZGfrhpZn" %}
[Otro web service](/siguientes-pasos/web-services/otro-web-service.md)
{% endcontent-ref %}

Podés usar la referencia de la API para obtener ejemplos de cómo usar los métodos de todos los web services de ARCA.

{% embed url="<https://afipsdk.com/docs/api-reference/introduction/>" %}

También podés usar las guías del blog de Afip SDK para Lovable:

{% embed url="<https://afipsdk.com/blog/category/Lovable/>" %}

***

### Usar tu propio certificado <sup><sub>(Opcional)<sub></sup>

Primero, obtenemos el certificado siguiendo esta guía.

{% embed url="<https://afipsdk.com/blog/como-obtener-certificado-para-web-services-arca/>" fullWidth="false" %}

Y luego pedile a Lovable que agregue `cert` y `key` solo en la función backend.

{% tabs %}
{% tab title="Prompt adicional" %}

```
Actualizá la función backend de Afip SDK para permitir usar certificado propio.

Reglas:
- El certificado y la key deben leerse desde secrets privados.
- Usá los nombres AFIPSDK_CERT y AFIPSDK_KEY.
- Nunca envíes cert, key ni AFIPSDK_ACCESS_TOKEN al frontend.
- Al llamar a POST /api/v1/afip/auth, agregá cert y key en el body junto con environment, tax_id y wsid.
```

{% endtab %}
{% endtabs %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.afipsdk.com/integracion/ai-builders/lovable.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
