👨💻
Integración del widget: frontend
Acciones a realizar por el equipo de frontend
El widget consiste en un contenedor que se carga mediante una llamada a un JavaScript. Realiza este checklist para integrar la parte de front:
- Si tú no has sido la persona encargada de realizar el alta en Wealth Reader, asegúrate con el responsable de que ha recibido el email confirmando el alta. En este paso previo habréis elegido alguna de las opciones de funcionamiento del widget, como la URL de callback a la que el widget enviará los datos, entre otras opciones.
- En el lugar donde quieres que aparezca el selector de entidades inserta este código:
<script>
//operation_id: es un id generado por vosotros que os volverá en la respuesta al callback
//entities_to_display: array de entidades a mostrar. Si es array vacío se muestran todas las entidades. Para recuperar todos los códigos de entidades: https://api.wealthreader.com/entities/
const wr_conf = {
"operation_id": "5f5b5c5c-5f5b-5c5c-5f5b-5c5c5f5b5c5c",
"entities_to_display": ["andbank", "bancamarch", "bankinter", "bbva", "caixabank", "degiro", "ing", "santander_emp", "triodos"],
"callback_url": "",
"redirect_url_ok": "",
"redirect_url_ko": "",
"wait_full_response": true
}
window.addEventListener("message", (e) => {
var data = e.data;
if (data === "flow completed") {
console.log("El widget ha notificado que el flujo ha finalizado");
//Aquí puedes escribir el código con lo que debe suceder cuando el flujo ha finalizado
}
});
</script>
<iframe id="wr-iframe" title="Wealth Reader widget" width="100%" frameBorder="0"></iframe>
<script src="https://widget.wealthreader.com/js/load.js"></script>
Parámetro | Requerido | Descripción |
|---|---|---|
operation_id | Id de operación asignado generado por el cliente. Este id se enviará junto con la respuesta a la URL de callback previamente acordada. | |
entities_to_display | Entidades a mostrar en el widget. Si no se especifica ningún valor se muestran todas.
Puedes obtener el listado completo de entidades en: https://api.wealthreader.com/entities/ Este método y el resto están descritos en la definición OpenAPI, al final del documento. | |
callback_url | Este parámetro existe con propósito de ayudar a la integración, y solamente está habilitado durante la fase de integración. Permite cambiar la URL de callback configurada por defecto y la de un servicio externo. | |
redirect_url_ok | Si está espeficado, redirigirá al usuario a esta url tras finalizar la lectura. Es un parámetro opcional, ya que el valor también:
| |
redirect_url_ko | Igual que redirect_url_ok | |
wait_full_response | Si es true, envía la información completa: activos y sus transacciones. En caso contrario el widget solamente enviará el listado de productos, pero no las transacciones. La razón para querer desactivar esta opción es dar al usuario la sensación de inmediatez, pero no recomendamos desactivarlo porque el tiempo de espera de recuperar la información completa también es corto, del orden de segundos. El valor por defecto es true. |
- Abre tu aplicación. Si todo es correcto verás el selector de bancos. En caso contrario, utiliza cualquiera de las tres formas de soporte que ofrecemos.
Última actualización 3mo ago