IframePasso 1 di 2

Configura il frontend

Inserite il widget nella vostra pagina, mostrate il selettore delle banche e ascoltate i messaggi dell’iframe.

Il widget è un iframe caricato con https://widget.wealthreader.com/js/load.js. Questa pagina copre solo il frontend. Il callback e i dati bancari si configurano in backend.

Il dominio che serve questa pagina deve essere autorizzato nell’area clienti prima di aprire il widget. Altrimenti il widget segnala che il dominio non è autorizzato.

Checklist di integrazione

0 di 3

Confermate con chi ha completato la registrazione di aver ricevuto l’e-mail di benvenuto e che il dominio è già autorizzato.
Dove deve comparire il selettore di istituti, inserite il codice qui sotto.
Aprite l’applicazione: dovete vedere il selettore di banche. Se non compare, controllate la console del browser e contattate il supporto.

Codice minimo

Generate un nuovo operation_id per ogni operazione. Lasciate entities_to_display vuoto per mostrare tutti gli istituti della vostra api_key. Mantenete wait_full_response impostato su true salvo diversa indicazione del team tecnico.

<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") {
            // The backend callback has already been sent successfully.
            // Close the selector or redirect to the success screen.
            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, wrong login, callback down, etc.
            }
        } catch (err) {
            // Ignore other iframe messages.
        }
    });
</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 cerca l’iframe con id="wr-iframe" e ne imposta l’altezza in base alla finestra. Lasciategli spazio verticale; se lo inserite a metà pagina potrebbe essere tagliato.

Messaggi `postMessage`

L’iframe comunica con la vostra pagina così:

`event.data`	Quando	Cosa fare
`"flow completed"`	La lettura è terminata con successo e il vostro callback ha restituito `200` + `{"status":"ok"}`	Chiudere il widget o passare alla schermata di successo. I dati bancari non viaggiano in questo messaggio.
JSON con `error`	Il flusso è ancora in corso (2FA, contratto, ecc.) oppure è fallito	Leggere `error.code` e `error.message`. Il callback non è stato inviato.

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

Parametri di `wr_conf`

Parametro	Obbligatorio	Predefinito	Funzione
`operation_id`	Sì	—	Id che generate voi. Torna nel callback per collegare frontend e backend.
`entities_to_display`	No	tutti	Array di codici istituto. Vuoto o omesso = tutti. Elenco: https://api.wealthreader.com/entities/
`wait_full_response`	No	`true`	`true`: prodotti e transazioni. `false`: solo l’elenco dei prodotti.
`date_from`	No	ieri	Inizio delle transazioni, `AAAA-MM-GG`. Si applica solo quando `wait_full_response` è `true`.
`product_types`	No	quelli della vostra `api_key`	Filtro prodotti. Array o elenco separato da virgole.
`default_login`	No	—	Codice istituto. Apre direttamente il modulo di quell’istituto.
`default_login_entity_country`	No	`ES`	Codice paese ISO (`ES`, `FR`, …). Usato solo se è impostato `default_login`.
`token`	No	—	Riautenticazione: preseleziona la banca di un token non più valido.
`psd2`	No	`true`	Mostra gli istituti PSD2. Solo se non filtrate con `entities_to_display`.
`nonpsd2`	No	`true`	Mostra gli istituti del canale non PSD2 (dati più ricchi). Stessa avvertenza di `psd2`.
`language`	No	la lingua del browser	`"es"` o `"en"`.
`tokenize`	No	l’impostazione dell’area clienti	`true` per ricevere un `token` riutilizzabile nel callback.
`business_account`	No	`true`	Includere gli istituti business.
`personal_account`	No	`true`	Includere gli istituti per privati.

`wait_full_response`

Lasciatelo su true. Disattivarlo accorcia l’attesa (secondi) al prezzo di non ricevere le transazioni. Non disattivatelo se non avete un motivo UX chiaro, e in quel caso recuperate le transazioni in seguito con l’API e il token del callback.

`date_from`

Se lo omettete, il widget usa la data di ieri. Non è «tutto lo storico».

Per intervalli superiori a 89 giorni presso banche europee, l’istituto può chiedere un passaggio extra di autenticazione a due fattori. L’utente lo completa nel widget; la lettura può richiedere diversi minuti.

`product_types`

Valori possibili:

accounts — conti correnti
portfolios — portafogli di investimento
cards — carte
receipts — addebiti diretti
loans — prestiti
deposits — depositi
leases — leasing / noleggio
insurances — assicurazioni
factoring
confirming
properties — immobili
invoices — fatture
files — file (Norma 43, 19, …)

Esempio: ["accounts", "cards", "loans"] oppure "accounts,cards,loans".

Passo successivo

Quando il selettore si presenta correttamente, proseguite con iframe backend.

Ultimo aggiornamento 2026-08-15

Checklist di integrazione

Codice minimo

Messaggi postMessage

Parametri di wr_conf

wait_full_response

date_from

product_types