Iframe第 1 步（共 2 步）
配置前端
在页面中嵌入组件，显示银行选择器，并监听 iframe 消息。
组件是通过 https://widget.wealthreader.com/js/load.js 加载的 iframe。本页仅介绍前端。callback 和银行数据在后端配置。
提供此页面的域名必须在打开组件之前在客户区获得授权。否则，组件会提示域名未获授权。
集成清单
0/3最小代码示例
每次操作都生成新的 operation_id。将 entities_to_display 留空可显示 api_key 下的所有金融机构。除非技术团队另有指示，否则将 wait_full_response 保持为 true。
<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 会查找 id="wr-iframe" 的 iframe，并根据窗口设置高度。请预留足够的垂直空间；将其插入页面中部可能导致内容被截断。
postMessage 消息
iframe 按以下方式与页面通信：
event.data |
何时触发 | 应执行的操作 |
|---|---|---|
"flow completed" |
数据读取成功，并且 callback 返回 200 + {"status":"ok"} |
关闭组件或跳转到成功页面。此消息不包含银行数据。 |
包含 error 的 JSON |
流程仍在继续（2FA、协议等），或已失败 | 读取 error.code 和 error.message。callback 尚未发送。 |
务必检查 event.origin === "https://widget.wealthreader.com"。
wr_conf 参数
| 参数 | 必填 | 默认值 | 作用 |
|---|---|---|---|
operation_id |
是 | — | 由您生成的标识符。在 callback 中返回，用于关联前端与后端。 |
entities_to_display |
否 | 全部 | 金融机构代码数组。为空或省略时表示全部。列表：https://api.wealthreader.com/entities/ |
wait_full_response |
否 | true |
true：产品和交易。false：仅产品列表。 |
date_from |
否 | 昨天 | 要查询的交易期间起始日期，格式为 AAAA-MM-DD。仅当 wait_full_response 为 true 时适用。 |
product_types |
否 | api_key 下的产品 |
产品筛选器。可使用数组或逗号分隔的列表。 |
default_login |
否 | — | 金融机构代码。直接打开该机构的表单。 |
default_login_entity_country |
否 | ES |
ISO 国家代码（ES、FR 等）。仅在指定 default_login 时使用。 |
token |
否 | — | 重新认证：预先选择已失效令牌对应的银行。 |
psd2 |
否 | true |
显示 PSD2 金融机构。仅在未通过 entities_to_display 筛选时适用。 |
nonpsd2 |
否 | true |
显示通过非 PSD2 渠道接入的金融机构（信息更完整）。适用条件与 psd2 相同。 |
language |
否 | 浏览器语言 | "es" 或 "en"。 |
tokenize |
否 | 客户区设置 | 设为 true 后，callback 会返回可重复使用的 token。 |
business_account |
否 | true |
包含企业金融机构。 |
personal_account |
否 | true |
包含个人金融机构。 |
wait_full_response
请保持为 true。关闭此选项可缩短几秒等待时间，但不会返回交易数据。除非有明确的用户体验需求，否则不要关闭；关闭后，应使用 API 和 callback 中的 token 另行获取交易。
date_from
如不发送此字段，组件将使用昨天的日期，而不是“全部历史记录”。
查询欧洲银行超过 89 天的时间范围时，银行可能要求额外的双因素认证。用户在组件内完成认证；读取可能需要几分钟。
product_types
可用值：
accounts— 账户portfolios— 投资组合cards— 银行卡receipts— 直接扣款loans— 贷款deposits— 存款leases— 融资租赁 / 租赁insurances— 保险factoringconfirmingproperties— 房地产invoices— 发票files— 文件（Norma 43、19 等）
例如：["accounts", "cards", "loans"] 或 "accounts,cards,loans"。
下一步
选择器正确显示后，请继续阅读 iframe 后端。
最后更新于