Developers API & Widget
API Reference
ES
ES · EspañolEN · EnglishFR · FrançaisCA · CatalàDA · DanskDE · DeutschEL · ΕλληνικάFI · SuomiGA · GaeilgeIT · ItalianoJA · 日本語NL · NederlandsNO · NorskPT · PortuguêsRO · RomânăRU · РусскийZH · 中文

IframePaso 1 de 2

Configura el frontend

Inserta el widget en tu página, muestra el selector de bancos y escucha los mensajes del iframe.

El widget es un iframe que se carga con https://widget.wealthreader.com/js/load.js. Esta página cubre solo el front. El callback y los datos del banco se configuran en backend.

El dominio desde el que sirves esta página tiene que estar autorizado en el área de clientes antes de abrir el widget. Si no lo está, el widget responde que el dominio no está autorizado.

Checklist de integración

0 de 3

Código mínimo

Genera un operation_id nuevo en cada operación. Deja entities_to_display vacío para mostrar todas las entidades de tu api_key. Mantén wait_full_response en true salvo que el equipo técnico te indique lo contrario.

<script>
    const wr_conf = {
        operation_id: crypto.randomUUID(),
        entities_to_display: [],
        wait_full_response: true
    };

    window.addEventListener("message", (event) => {
        if (event.origin !== "https://widget.wealthreader.com") {
            return;
        }

        if (event.data === "flow completed") {
            // El callback de backend ya se envió con éxito.
            // Cierra el selector o redirige a la pantalla de éxito.
            return;
        }

        if (typeof event.data !== "string") {
            return;
        }

        try {
            const message = JSON.parse(event.data);
            if (message.error) {
                console.log(message.error.code, message.error.message);
                // OTP, login incorrecto, callback caído, etc.
            }
        } catch (err) {
            // Ignora otros mensajes del iframe.
        }
    });
</script>

<iframe
    id="wr-iframe"
    title="Wealth Reader widget"
    width="100%"
    frameBorder="0"
    referrerpolicy="origin"
></iframe>
<script src="https://widget.wealthreader.com/js/load.js"></script>

load.js busca el iframe con id="wr-iframe" y le asigna la altura según la ventana. Colócalo de forma que tenga espacio vertical; si lo insertas a mitad de página, puede recortarse.

Mensajes postMessage

El iframe habla con tu página así:

event.data Cuándo Qué hacer
"flow completed" La lectura terminó bien y tu callback respondió 200 + {"status":"ok"} Cerrar el widget o ir a la pantalla de éxito. No viajan los datos del banco en este mensaje.
JSON con error El flujo sigue (2FA, contrato, etc.) o ha fallado Lee error.code y error.message. El callback no se ha enviado.

Comprueba siempre event.origin === "https://widget.wealthreader.com".

Parámetros de wr_conf

Parámetro Requerido Default Qué hace
operation_id Sí — Id que generas tú. Vuelve en el callback para cruzar front y back.
entities_to_display No todas Array de códigos de entidad. Vacío o ausente = todas. Listado: https://api.wealthreader.com/entities/
wait_full_response No true true: productos y transacciones. false: solo el listado de productos.
date_from No ayer Inicio de transacciones, AAAA-MM-DD. Solo aplica si wait_full_response es true.
product_types No los de tu api_key Filtro de productos. Array o lista separada por comas.
default_login No — Código de entidad. Abre directo el formulario de esa entidad.
default_login_entity_country No ES Código ISO de país (ES, FR, …). Solo se usa si hay default_login.
token No — Reautenticación: preselecciona el banco de un token que ya no vale.
psd2 No true Muestra entidades PSD2. Solo si no filtras con entities_to_display.
nonpsd2 No true Muestra entidades por canal no PSD2 (información más completa). Mismo matiz que psd2.
language No el del navegador "es" o "en".
tokenize No el del área de clientes true para obtener un token reutilizable en el callback.
business_account No true Incluye entidades de empresa.
personal_account No true Incluye entidades de particulares.

wait_full_response

Déjalo en true. Apagarlo acorta la espera (segundos) a costa de no recibir transacciones. No lo desactives salvo un motivo claro de UX, y entonces recupera las transacciones después con la API y el token del callback.

date_from

Si no lo envías, el widget usa la fecha de ayer. No es “todo el historial”.

Para rangos de más de 89 días en bancos europeos, la entidad puede pedir un doble factor extra. El usuario lo completa en el widget; la lectura puede tardar varios minutos.

product_types

Valores posibles:

  • accounts — cuentas
  • portfolios — carteras de inversión
  • cards — tarjetas
  • receipts — recibos
  • loans — préstamos
  • deposits — depósitos
  • leases — leasing / renting
  • insurances — seguros
  • factoring
  • confirming
  • properties — inmuebles
  • invoices — facturas
  • files — ficheros (Norma 43, 19, …)

Ejemplo: ["accounts", "cards", "loans"] o "accounts,cards,loans".

Siguiente paso

Cuando el selector se vea bien, sigue con iframe backend.

Última actualización