IframePasso 1 de 2

Configure o frontend

Insira o widget na sua página, mostre o seletor de bancos e escute as mensagens do iframe.

O widget é um iframe carregado com https://widget.wealthreader.com/js/load.js. Esta página cobre apenas o frontend. O callback e os dados bancários configuram-se em backend.

O domínio que serve esta página tem de estar autorizado na área de clientes antes de abrir o widget. Caso contrário, o widget indica que o domínio não está autorizado.

Checklist de integração

0 de 3

Confirme com quem concluiu o registo que receberam o e-mail de boas-vindas e que o domínio já está autorizado.
No sítio onde o seletor de instituições deve aparecer, insira o código abaixo.
Abra a sua aplicação: deve ver o seletor de bancos. Se não aparecer, verifique a consola do navegador e contacte o suporte.

Código mínimo

Gere um novo operation_id em cada operação. Deixe entities_to_display vazio para mostrar todas as instituições da sua api_key. Mantenha wait_full_response definido como true, salvo indicação em contrário da equipa técnica.

<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>

O load.js procura o iframe com id="wr-iframe" e define-lhe a altura a partir da janela. Dê-lhe espaço vertical; se o colocar a meio da página, pode ficar cortado.

Mensagens `postMessage`

O iframe comunica com a sua página assim:

`event.data`	Quando	O que fazer
`"flow completed"`	A leitura terminou com sucesso e o seu callback devolveu `200` + `{"status":"ok"}`	Fechar o widget ou ir para o ecrã de sucesso. Os dados bancários não viajam nesta mensagem.
JSON com `error`	O fluxo ainda está a decorrer (2FA, contrato, etc.) ou falhou	Ler `error.code` e `error.message`. O callback não foi enviado.

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

Parâmetros de `wr_conf`

Parâmetro	Obrigatório	Predefinição	Função
`operation_id`	Sim	—	Id que gera. Volta no callback para cruzar frontend e backend.
`entities_to_display`	Não	todas	Array de códigos de instituição. Vazio ou omisso = todas. Lista: https://api.wealthreader.com/entities/
`wait_full_response`	Não	`true`	`true`: produtos e transações. `false`: apenas a lista de produtos.
`date_from`	Não	ontem	Início das transações, `AAAA-MM-DD`. Só se aplica quando `wait_full_response` é `true`.
`product_types`	Não	os da sua `api_key`	Filtro de produtos. Array ou lista separada por vírgulas.
`default_login`	Não	—	Código da instituição. Abre diretamente o formulário dessa instituição.
`default_login_entity_country`	Não	`ES`	Código de país ISO (`ES`, `FR`, …). Usado apenas quando `default_login` está definido.
`token`	Não	—	Reautenticação: pré-seleciona o banco de um token que já não é válido.
`psd2`	Não	`true`	Mostrar instituições PSD2. Apenas se não filtrar com `entities_to_display`.
`nonpsd2`	Não	`true`	Mostrar instituições do canal não PSD2 (dados mais ricos). A mesma ressalva que `psd2`.
`language`	Não	o idioma do navegador	`"es"` ou `"en"`.
`tokenize`	Não	a definição da área de clientes	`true` para receber um `token` reutilizável no callback.
`business_account`	Não	`true`	Incluir instituições empresariais.
`personal_account`	Não	`true`	Incluir instituições de particulares.

`wait_full_response`

Deixe-o a true. Desativá-lo encurta a espera (segundos) à custa de não receber transações. Não o desative sem um motivo de UX claro e, nesse caso, obtenha as transações mais tarde com a API e o token do callback.

`date_from`

Se o omitir, o widget usa a data de ontem. Isso não é «todo o histórico».

Para intervalos superiores a 89 dias em bancos europeus, a instituição pode pedir um passo extra de autenticação de dois fatores. O utilizador conclui-o no widget; a leitura pode demorar vários minutos.

`product_types`

Valores possíveis:

accounts — contas à ordem
portfolios — carteiras de investimento
cards — cartões
receipts — débitos diretos
loans — empréstimos
deposits — depósitos
leases — leasing / renting
insurances — seguros
factoring
confirming
properties — imóveis
invoices — faturas
files — ficheiros (Norma 43, 19, …)

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

Passo seguinte

Quando o seletor estiver correto, continue com iframe backend.

Última atualização 2026-08-15

Checklist de integração

Código mínimo

Mensagens postMessage

Parâmetros de wr_conf

wait_full_response

date_from

product_types