Empieza a usar los componentes integrados de Connect
Descubre cómo integrar las funciones del Dashboard en tu sitio web.
Utiliza los componentes integrados de Connect para añadir las funciones del Dashboard de cuentas conectadas a tu sitio web. Estas bibliotecas y su API de soporte te permiten otorgar a tus usuarios acceso a los productos de Stripe directamente en tu Dashboard y aplicaciones móviles.
Configurar Stripe ConnectLado del clienteLado del servidor
Stripe utiliza una AccountSession para expresar tu intención de delegar el acceso a la API a tu cuenta conectada.
La API de AccountSessions devuelve un secreto de cliente que permite que un componente integrado acceda a los recursos de una cuenta conectada como si estuvieras haciendo las llamadas a la API para ellos.
Crea una AccountSession Servidor
La aplicación debe iniciar una solicitud a tu servidor para obtener la sesión de la cuenta. Actualmente, solo se admite el onboarding de cuentas. Puedes crear un nuevo punto de conexión en tu servidor que devuelva el secreto de cliente a la aplicación:
Crear una API Account Session
La API Create Account Session determina el acceso a los componentes y funciones para los componentes integrados de Connect. Stripe aplica estos parámetros para cualquier componente que corresponda a la sesión de la cuenta. Si tu aplicación acepta varios roles de usuario, asegúrate de que los componentes y las funciones que están habilitados para esa sesión de cuenta correspondan al rol del usuario actual. Por ejemplo, puedes habilitar la gestión de reembolsos solo para los administradores de tu sitio, pero no para otros usuarios. Para asegurarse de que se aplica el acceso a la función de usuario, debes asignar la función de usuario de tu sitio a los componentes de la sesión de la cuenta.
Instala el SDK de StripeConnect Client
El SDK para Android de Stripe es de código abierto y está completamente documentado.
Para instalar el SDK, añade connect
al bloque dependencies
de tu archivo app/build.gradle:
Nota
Para conocer detalles de la última versión y de versiones anteriores del SDK, consulta la página Versiones de GitHub. Para recibir una notificación cuando se publique una nueva versión, mira las versiones del repositorio.
Inicializa EmbeddedComponentManager Client
Crea una instancia de un EmbeddedComponentManager con tu clave publicable y una expresión lambda que recupere un secreto de cliente llamando al nuevo punto de conexión que hayas creado en tu servidor. Para gestionar los cambios de configuración, mantén la instancia EmbeddedComponentManager
en un ViewModel
de actividad o fragmento.
Para crear un componente, primero llama a EmbeddedComponentManager.
en el método onCreate
de tu actividad. A continuación, llama al método correspondiente en el EmbeddedComponentManager
para el que has creado una instancia anteriormente. Esto devuelve un controlador que puedes usar para presentar el componente en la aplicación.
Configure the Embedded Component ManagerLado del cliente
Consulta la referencia de código .
Personaliza el aspecto de los componentes integrados de Connect
El conjunto de herramientas de interfaz de usuario Figma para componentes incorporados contiene todos los componentes, patrones comunes y una aplicación de ejemplo. Puedes usarlo para visualizar y diseñar interfaces de usuario integradas en tu sitio web.
We offer a set of options to customize the look and feel of Connect embedded components. These customizations affect buttons, icons, and other accents in our design system.
Ventanas emergentes necesarias
Algunos comportamientos de los componentes integrados, como la autenticación de usuarios, deben presentarse en una vista web autenticada. No se puede personalizar el componente incrustado para eliminar dichas WebViews.
Puedes establecer estas opciones usando Appearance al inicializar EmbeddedComponentManager
.
Al especificar los tamaños de fuente, usa el tamaño de fuente sin escalar que se muestra para la clase de tamaño predeterminada del dispositivo. El componente integrado escala automáticamente el tamaño de la fuente en función de la Configuración de fuentes de accesibilidad del usuario.
Consulta la lista completa de opciones de apariencia en Android.
Usar fuentes personalizadas
Si usas fuentes personalizadas en tu aplicación (por ejemplo, de archivos .
o .
integrados en el binario de tu aplicación), debes especificar los archivos de fuentes en un CustomFontSource pasado al argumento customFonts
al inicializar EmbeddedComponentManager
. Esto permite que los componentes integrados de Connect accedan a los archivos de fuentes para renderizarlas correctamente.
Las fuentes especificadas en appearance
deben usar un CustomFontSource especificado en EmbeddedComponentManager
en la inicialización para renderizarse correctamente.
Consulta la documentación de referencia .
Actualiza los componentes integrados de Connect después de la inicialización
Llama al método update
para cambiar la apariencia de los componentes integrados después de la inicialización:
Autenticación
Ofrecemos un conjunto de API para gestionar las sesiones de la cuenta y las credenciales de usuario en los componentes integrados de Connect.
Actualizar el secreto de cliente
En sesiones de larga duración, podría caducar la sesión del secreto de cliente que se proporcionó inicialmente. Cuando caduca, usamos automáticamente fetchClientSecret
para recuperar un nuevo secreto de cliente y actualizar la sesión. No es necesario que especifiques ningún otro parámetro.
Localización
Los componentes integrados de Connect aceptan las siguientes configuraciones regionales:
Idioma | Código de configuración regional |
---|---|
Búlgaro (Bulgaria) | bg-BG |
Chino (simplificado) | zh-Hans |
Chino (tradicional de Hong Kong) | zh-Hant-HK |
Chino (tradicional de Taiwán) | zh-Hant-TW |
Croata (Croacia) | hr-HR |
Checo (República Checa) | cs-CZ |
Danés (Dinamarca) | da-DK |
Neerlandés (Países Bajos) | nl-NL |
Inglés (Australia) | en-AU |
Inglés (India) | en-IN |
Inglés (Irlanda) | en-IE |
Inglés (Nueva Zelanda) | en-NZ |
Inglés (Singapur) | en-SG |
Inglés (Reino Unido) | en-GB |
Inglés (Estados Unidos) | en-US |
Estonio (Estonia) | et-EE |
Filipino (Filipinas) | fil-PH |
Finlandés (Finlandia) | fi-FI |
Francés (Canadá) | fr-CA |
Francés (Francia) | fr-FR |
Alemán (Alemania) | de-DE |
Griego (Grecia) | el-GR |
Húngaro (Hungría) | hu-HU |
Indonesio (Indonesia) | id-ID |
Italiano (Italia) | it-IT |
Japonés (Japón) | ja-JP |
Coreano (Corea del Sur) | ko-KR |
Letón (Letonia) | lv-LV |
Lituano (Lituania) | lt-LT |
Malayo (Malasia) | ms-MY |
Maltés (Malta) | mt-MT |
Noruego bokmål (Noruega) | nb-NO |
Polaco (Polonia) | pl-PL |
Portugués (Brasil) | pt-BR |
Portugués (Portugal) | pt-PT |
Rumano (Rumania) | ro-RO |
Eslovaco (Eslovaquia) | sk-SK |
Esloveno (Eslovenia) | sl-SI |
Español (Argentina) | es-AR |
Español (Brasil) | es-BR |
Español (Latinoamérica) | es-419 |
Español (México) | es-MX |
Español (España) | es-ES |
Sueco (Suecia) | sv-SE |
Tailandés (Tailandia) | th-TH |
Turco (Turquía) | tr-TR |
Vietnamita (Vietnam) | vi-VN |
Autenticación de usuarios en los componentes integrados de Connect
Por lo general, los componentes integrados de Connect no necesitan la autenticación de usuario. En algunas situaciones, los componentes integrados de Connect requieren que la cuenta conectada inicie sesión con su cuenta de Stripe antes de acceder al componente para proporcionar las funciones necesarias (por ejemplo, escribir información a la entidad jurídica de la cuenta en el caso del componente account onboarding). Es posible que otros componentes requieran autenticación dentro del componente después de que se rendericen inicialmente.
La autenticación es obligatoria para las cuentas conectadas en las que Stripe es responsable de recopilar información actualizada cuando cambian los requisitos. Para las cuentas conectadas en las que eres responsable de recopilar información actualizada cuando los requisitos vencen o cambian, como las cuentas Custom, la autenticación de Stripe se controla mediante la función de sesión de cuenta de disable_stripe_user_authentication. Recomendamos implementar 2FA o medidas de seguridad equivalentes como una práctica recomendada. Para las configuraciones de cuenta que admiten esta función, como Custom, asumes la responsabilidad de las cuentas conectadas si no pueden devolver los saldos negativos.
Componentes que requieren autenticación
A las cuentas conectadas se les mostrará un WebView autenticado dentro de tu aplicación. La cuenta conectada debe autenticarse antes de poder continuar su flujo de trabajo dentro de WebView.
El flujo de autenticación alojado en Stripe muestra el nombre, el color y el icono de tu marca tal y como están establecidos en la configuración de Connect y no utiliza tu aspecto personalizado ni las fuentes del Administrador de componentes integrados hasta que se completa la autenticación.
Limitaciones de Android
Debido a una limitación dentro de las API de Android, los componentes integrados no pueden usar fuentes personalizadas dentro de la vista web autenticada, incluso después de que se complete la autenticación.
El siguiente componente requiere que las cuentas conectadas se autentiquen en determinadas situaciones:
Gestiona los errores de carga
Si un componente no se carga, puedes reaccionar ante el error implementando el método de escucha onLoadError
del componente. Dependiendo de la causa del error, se puede llamar varias veces al método onLoadError
. Cualquier lógica activada por un onLoadError
debe ser idempotente.