IframePas 1 de 2

Munta la part frontal

Incrusta el widget a la teva pàgina, mostra el selector del banc i escolta els missatges de l'iframe.

El widget és un iframe que carrega amb https://widget.wealthreader.com/js/load.js. Aquesta pàgina només cobreix la portada. La devolució de la trucada i les dades bancàries estan configurades com a backend.

El domini des del qual serveixes aquesta pàgina ha d'estar autoritzat a l'àrea del client abans d'obrir el widget. Si no ho és, el widget respon que el domini no està autoritzat.

Checklist d'integració

0 de 3

Confirma amb la persona que s'ha registrat que has rebut el correu de benvinguda i que el domini ja està autoritzat.
On hauria d'aparèixer el selector d'entitats, inseriu el codi a continuació.
Obre l'aplicació: hauries de veure el selector del banc. Si no apareix, comprova la consola del navegador i contacta amb suport.

Codi mínim

Genera'n un operation_id de nou en cada operació. Deixa entities_to_display buit per mostrar totes les entitats del teu api_key. Mantingues-te wait_full_response true segur que l'equip tècnic et digui el contrari.

<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 l'iframe amb id="wr-iframe" i li assigna l'alçada segons la finestra. Col·loca'l de manera que tingui espai vertical; Si l'insereixes al mig de la pàgina, es pot retallar.

Missatges `postMessage`

L'iframe parla a la teva pàgina així:

`event.data`	Quan	Coses a fer
`"flow completed"`	La lectura va acabar bé i la teva trucada va `200` respondre + `{"status":"ok"}`	Tanca el widget o ves a la pantalla d'èxit. No les dades bancàries d'aquest missatge.
JSON amb `error`	El flux continua (2FA, contracte, etc.) o ha fallat	Llegeix `error.code` i `error.message`. La trucada no s'ha enviat.

Comprova sempre event.origin === "https://widget.wealthreader.com".

Paràmetres de `wr_conf`

Paràmetre	Obligatòria	Per defecte	Què fa
`operation_id`	Sí	—	Això que generis. Torna a la crida per creuar davant i darrere.
`entities_to_display`	Sí	Tots	Matriu de codis d'entitat. Buit o absent = tots. Llistat: https://api.wealthreader.com/entities/
`wait_full_response`	Sí	`true` `true`	: productes i transaccions. `false`: només la llista de productes.
`date_from`	Sí	ahir	Inici de transaccions, `AAAA-MM-DD`. Només s'aplica si `wait_full_response` és `true`.
`product_types`	Sí	`api_key` Teva	Filtre de producte. Array o llista separada per comes.
`default_login`	Sí	—	Codi d'entitat. Obre el formulari d'aquesta entitat directament.
`default_login_entity_country`	Sí	`ES`	Codi de país ISO (`ES`, `FR`, ...). Només s'utilitza si hi ha `default_login`.
`token`	Sí	—	Reautenticació: Preselecciona el banc a partir d'un token que ja no és vàlid.
`psd2`	Sí	`true`	Mostra entitats PSD2. Només si no filtres amb `entities_to_display`.
`nonpsd2`	Sí	`true`	Mostra les entitats per canal no PSD2 (informació més completa). La mateixa matisació que `psd2`.
`language`	Sí	El que té el navegador	`"es"` o `"en"`.
`tokenize`	Sí	el que hi ha a la zona de clients	`true` per aconseguir un `token` reutilitzable a la devolució de trucada.
`business_account`	Sí	`true`	Inclou entitats empresarials.
`personal_account`	Sí	`true`	Inclou entitats d'individus.

`wait_full_response`

Deixa-ho a true. Desactivar-lo redueix l'espera (segons) a canvi de no rebre transaccions. No la desactivis tret que hi hagi una raó clara per la UX, i després recupera les transaccions més endavant amb l'API i la token callback.

`date_from`

Si no l'envies, el widget utilitza la data d'ahir. No és "tota la història."

Per a intervals de més de 89 dies als bancs europeus, l'entitat pot sol·licitar un factor doble addicional. L'usuari la completa al widget; Pot trigar diversos minuts a llegir-se.

`product_types`

Valors possibles:

accounts — Comptes
portfolios — Carteres d'inversió
cards — Cartes
receipts — rebuts
loans — préstecs
deposits — Dipòsits
leases — lloguer / lloguer
insurances — Assegurances
factoring
confirming
properties — Béns immobles
invoices — factures
files — fitxers (Regla 43, 19, ...)

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

Següent pas

Quan el selector sembli bé, segueix amb iframe backend.

Última actualització 2026-08-15

Checklist d'integració

Codi mínim

Missatges postMessage

Paràmetres de wr_conf

wait_full_response

date_from

product_types