IframePasul 1 din 2
Configurați frontend-ul
Inserați widgetul în pagina dumneavoastră, afișați selectorul de bănci și ascultați mesajele iframe-ului.
Widgetul este un iframe încărcat cu https://widget.wealthreader.com/js/load.js. Această pagină acoperă doar frontend-ul. Callback-ul și datele bancare se configurează în backend.
Domeniul care servește această pagină trebuie autorizat în zona de clienți înainte de a deschide widgetul. Altfel widgetul raportează că domeniul nu este autorizat.
Checklist de integrare
0 din 3Cod minim
Generați un operation_id nou pentru fiecare operațiune. Lăsați entities_to_display gol pentru a afișa toate instituțiile de pe api_key. Păstrați wait_full_response setat la true, dacă echipa tehnică nu vă spune altfel.
<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 găsește iframe-ul cu id="wr-iframe" și îi setează înălțimea după fereastra de vizualizare. Acordați-i spațiu vertical; dacă îl plasați la mijlocul paginii, poate fi tăiat.
Mesaje postMessage
Iframe-ul vorbește cu pagina dumneavoastră astfel:
event.data |
Când | Ce să faceți |
|---|---|---|
"flow completed" |
Citirea s-a încheiat cu succes și callback-ul a returnat 200 + {"status":"ok"} |
Închideți widgetul sau mergeți la ecranul de succes. Datele bancare nu circulă în acest mesaj. |
JSON cu error |
Fluxul încă rulează (2FA, contract etc.) sau a eșuat | Citiți error.code și error.message. Callback-ul nu a fost trimis. |
Verificați întotdeauna event.origin === "https://widget.wealthreader.com".
Parametri wr_conf
| Parametru | Obligatoriu | Implicit | Ce face |
|---|---|---|---|
operation_id |
Da | — | Identificatorul pe care îl generați. Revine în callback ca să potriviți frontend-ul cu backend-ul. |
entities_to_display |
Nu | toate | Array de coduri de instituție. Gol sau omis = toate. Listă: https://api.wealthreader.com/entities/ |
wait_full_response |
Nu | true |
true: produse și tranzacții. false: doar lista de produse. |
date_from |
Nu | ieri | Începutul tranzacțiilor, YYYY-MM-DD. Se aplică doar când wait_full_response este true. |
product_types |
Nu | cele de pe api_key |
Filtru de produse. Array sau listă separată prin virgule. |
default_login |
Nu | — | Codul instituției. Deschide direct formularul acelei instituții. |
default_login_entity_country |
Nu | ES |
Cod de țară ISO (ES, FR, …). Se folosește doar când este setat default_login. |
token |
Nu | — | Reautentificare: preselectează banca unui token care nu mai este valid. |
psd2 |
Nu | true |
Afișează instituțiile PSD2. Doar dacă nu filtrați cu entities_to_display. |
nonpsd2 |
Nu | true |
Afișează instituțiile de pe canalul non-PSD2 (date mai complete). Aceeași precizare ca la psd2. |
language |
Nu | limba browserului | "es" sau "en". |
tokenize |
Nu | setarea din zona de clienți | true pentru a primi un token reutilizabil în callback. |
business_account |
Nu | true |
Include instituțiile de business. |
personal_account |
Nu | true |
Include instituțiile pentru persoane fizice. |
wait_full_response
Lăsați-l pe true. Dezactivarea scurtează așteptarea (secunde) cu prețul de a nu primi tranzacții. Nu îl dezactivați fără un motiv clar de UX, iar apoi preluați tranzacțiile ulterior cu API-ul și token-ul din callback.
date_from
Dacă îl omiteți, widgetul folosește data de ieri. Nu este „întregul istoric”.
Pentru intervale mai lungi de 89 de zile la băncile europene, instituția poate cere un pas suplimentar de autentificare în doi factori. Utilizatorul îl completează în widget; citirea poate dura câteva minute.
product_types
Valori posibile:
accounts— conturi curenteportfolios— portofolii de investițiicards— cardurireceipts— debitări directeloans— creditedeposits— depoziteleases— leasing / rentinginsurances— asigurărifactoringconfirmingproperties— imobileinvoices— facturifiles— fișiere (Norma 43, 19, …)
Exemplu: ["accounts", "cards", "loans"] sau "accounts,cards,loans".
Pasul următor
Când selectorul arată corect, continuați cu iframe backend.