IframeÉtape 1 sur 2

Configurez le frontend

Intégrez le widget sur votre page, affichez le sélecteur de banque, et écoutez les messages de l’iframe.

Le widget est un iframe qui se charge avec https://widget.wealthreader.com/js/load.js. Cette page ne couvre que le front. Le rappel et les données bancaires sont définis comme Backend.

Le domaine depuis lequel vous servez cette page doit être autorisé dans l’espace client avant d’ouvrir le widget. Si ce n’est pas le cas, le widget répond que le domaine n’est pas autorisé.

Checklist d'intégration

0 sur 3

Confirmez auprès de la personne qui s’est enregistrée que vous avez reçu l’email de bienvenue et que le domaine est déjà autorisé.
Là où le sélecteur d’entité doit apparaître, insérez le code ci-dessous.
Ouvrez votre application : Vous devriez voir le sélecteur de banque. S’il n’apparaît pas, vérifiez la console de votre navigateur et Contactez le support.

Code minimum

Générez un nouveau operation_id pour chaque opération. Laissez entities_to_display vide pour afficher toutes les entités de votre api_key. Gardez wait_full_response à true sauf indication contraire de l’équipe technique.

<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 trouve l’iframe avec id="wr-iframe" et lui attribue la hauteur selon la fenêtre. Positionnez-le de façon à ce qu’il ait de l’espace vertical ; si vous l’insérez au centre de la page, il peut être recadré.

Messages `postMessage`

L’iframe s’adresse à votre page ainsi :

`event.data`	Quand	Que faire
`"flow completed"`	La lecture s’est bien terminée et votre callback a répondu `200` + `{"status":"ok"}`	Fermez le widget ou allez à l’écran de réussite. Les données bancaires ne sont pas transmises dans ce message.
JSON avec `error`	Le flux continue (2FA, contrat, etc.) ou a échoué	Lisez `error.code` et `error.message`. Le rappel n’a pas été envoyé.

Vérifiez toujours event.origin === "https://widget.wealthreader.com".

`wr_conf` Paramètres

Paramètre	Obligatoire	Par défaut	Ce que ça fait
`operation_id`	Oui	—	Identifiant généré par votre système. Il revient dans le callback pour relier frontend et backend.
`entities_to_display`	Non	Tous	Tableau des codes d’entité. Vide ou absent = tous. Liste : https://api.wealthreader.com/entities/
`wait_full_response`	Non	`true`	`true`- Produits et transactions. `false`- Seulement l’annonce des produits.
`date_from`	Non	Hier	Date de début des transactions, `AAAA-MM-DD`. Ne s’applique que si `wait_full_response` est `true`.
`product_types`	Non	Ceux de votre `api_key`	Filtre produit. Tableau ou liste séparée par virgules.
`default_login`	Non	—	Code de l’entité. Ouvre le formulaire directement pour cette entité.
`default_login_entity_country`	Non	`ES`	Code pays ISO (`ES`, `FR`, ...). Utilisé uniquement s’il y a `default_login`.
`token`	Non	—	Réauthentification : Pré-sélectionnez la banque à partir d’un jeton qui n’est plus valide.
`psd2`	Non	`true`	Affiche les entités PSD2. Seulement si vous ne filtrez pas avec `entities_to_display`.
`nonpsd2`	Non	`true`	Affiche les entités par canal, pas PSD2 (informations plus complètes). Même nuance que `psd2`.
`language`	Non	Le navigateur	`"es"` ou `"en"`.
`tokenize`	Non	Celui de la zone client	`true` d’obtenir un `token` réutilisable lors du rappel.
`business_account`	Non	`true`	Inclut les entités d’entreprise.
`personal_account`	Non	`true`	Elle inclut des entités individuelles.

`wait_full_response`

Laissez-le à true. Le désactiver réduit l’attente (secondes) au prix de ne pas recevoir les transactions. Ne le désactivez pas à moins qu’il y ait une raison UX claire, puis récupérez les transactions plus tard avec l’API et le token du rappel.

`date_from`

Si vous ne l’envoyez pas, le widget utilise la date d’hier. Ce n’est pas « toute l’histoire ».

Pour des plages de plus de 89 jours dans les banques européennes, l’entité peut demander un double facteur supplémentaire. L’utilisateur le complète dans le widget ; la lecture peut prendre plusieurs minutes.

`product_types`

Valeurs possibles :

accounts — Comptes
portfolios — portefeuilles d’investissement
cards — cartes
receipts — reçus
loans — prêts
deposits — Dépôts
leases — crédit-bail / location
insurances — Assurance
factoring
confirming
properties — immobilier
invoices — factures
files — fichiers (Norma 43, Norma 19, ...)

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

Étape suivante

Quand le sélecteur est bon, suivez avec Backend iframe.

Dernière mise à jour 2026-09-10

Checklist d'intégration

Code minimum

Messages postMessage

wr_conf Paramètres

wait_full_response

date_from

product_types