# Aceptar un pago Acepta pagos en línea de forma segura. Stripe recomienda utilizar la API Checkout Sessions con el elemento de pago en lugar de Payment Intents para la mayoría de las integraciones. Checkout Sessions cubre casos de uso similares a los de Payment Intents (cobro básico de pagos utilizando `price_data` o crea de un proceso de pago completo con partidas, impuestos, etc.). Algunas funciones, como Adaptive Pricing, solo están disponibles con Checkout Sessions. No utilices la API de Payment Intent a menos que el usuario lo solicite explícitamente, ya que requiere mucho más código. Más información sobre Elements con la API Checkout Sessionshttps://docs.stripe.com/payments/quickstart. Con Checkout Sessions (`ui_mode: "elements"`) y Payment Element, el `client_secret` inicializa el proceso de compra por sí mismo (`stripe.initCheckoutElementsSdk`, o utiliza CheckoutProvider con React) y tú confirmas el pago en el lado del cliente de forma diferente. Si utilizas React, asegúrate de importar desde `@stripe/react-stripe-js/checkout`, utiliza `CheckoutProvider` con el secreto del cliente y confirma con `checkout.confirm`. Si utilizas HTML, asegúrate de utiliza `checkout = stripe.initCheckoutElementsSdk({clientSecret: promise}); checkout.createPaymentElement(); paymentElement = checkout.createPaymentElement(); paymentElement.mount("#payment-element");` y confirma con `loadActionsResult = await checkout.loadActions(); actions = loadActionsResult.actions; error = await actions.confirm();`. Los agentes de programación deben instalar la CLI de Stripe (`npm i -g @stripe/cli`) y ejecutar el comando `stripe sandbox create --help` para aprovisionar un entorno de prueba de Stripe anónimo con claves API operativas. No se requiere registro de cuenta. Crea un formulario de pago o usa una página del proceso de compra prediseñada para comenzar a aceptar pagos en línea. # Integración en la aplicación para iOS ![](https://b.stripecdn.com/docs-statics-srv/assets/ios-overview.9e0d68d009dc005f73a6f5df69e00458.png) Utiliza la clase [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html) para integrar la interfaz de usuario de pago prediseñada de Stripe al proceso de compra de tu aplicación de iOS. Consulta nuestro ejemplo de integración [en GitHub](https://github.com/stripe/stripe-ios/tree/master/Example/PaymentSheet%20Example). Como alternativa, empieza con el [inicio rápido de código](https://docs.stripe.com/payments/mobile/quickstart.md?platform=ios) para crear o descargar un ejemplo ejecutable. > #### Soporte para la API Accounts v2 > > Payment Sheet no tiene soporte para *customer-configured Accounts* (Account configurations represent role-based functionality that you can enable for accounts, such as merchant, customer, or recipient). Solo admite objetos `Customer`. ## Configurar Stripe [Lado del servidor] [Lado del cliente] Primero, necesitas una cuenta de Stripe. [Regístrate ahora](https://dashboard.stripe.com/register). ### Lado del servidor Esta integración necesita puntos de conexión de tu servidor que se comuniquen con la API de Stripe. Usa nuestras bibliotecas oficiales para acceder a la API de Stripe desde tu servidor: #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ### Lado del cliente El [SDK para iOS de Stripe](https://github.com/stripe/stripe-ios) es de código abierto, está [plenamente documentado](https://stripe.dev/stripe-ios/index.html) y es compatible con aplicaciones que admiten iOS 13 o posterior. #### Administrador de paquetes Swift Para instalar el SDK, sigue estos pasos: 1. En Xcode, elige **Archivo** > **Añadir dependencias de paquetes…** e introduce `https://github.com/stripe/stripe-ios-spm` como la URL del repositorio. 2. Selecciona el número de versión más reciente en nuestra [página de versiones](https://github.com/stripe/stripe-ios/releases). 3. Añade el producto **StripePaymentSheet** al [objetivo de tu aplicación](https://developer.apple.com/documentation/swift_packages/adding_package_dependencies_to_your_app). #### Carthage 1. Si aún no lo has hecho, instala la última versión de [Carthage](https://github.com/Carthage/Carthage#installing-carthage). 2. Añade esta línea a tu `Cartfile`: ```cartfile github "stripe/stripe-ios" ``` 3. Sigue las [instrucciones de instalación de Carthage](https://github.com/Carthage/Carthage#if-youre-building-for-ios-tvos-or-watchos). Asegúrate de incrustar todos los frameworks obligatorios enumerados [aquí](https://github.com/stripe/stripe-ios/tree/master/StripePaymentSheet/README.md#manual-linking). 4. En el futuro, para actualizar a la última versión del SDK, ejecuta el siguiente comando: ```bash carthage update stripe-ios --platform ios ``` #### Plataforma manual 1. Ve a nuestra [página de versiones de GitHub](https://github.com/stripe/stripe-ios/releases/latest) y descarga y descomprime **Stripe.xcframework.zip**. 2. Arrastra **StripePaymentSheet.xcframework** a la sección **Binarios incrustados** de la configuración **General** de tu proyecto en Xcode. Asegúrate de seleccionar **Copiar elementos si es necesario**. 3. Repite el paso 2 para todos los frameworks obligatorios enumerados [here](https://github.com/stripe/stripe-ios/tree/master/StripePaymentSheet/README.md#manual-linking). 4. En el futuro, para actualizar a la última versión de nuestro SDK, repite los pasos 1 a 3. > Para obtener más información sobre la versión más reciente y sobre versiones anteriores del SDK, consulta la página [Versiones](https://github.com/stripe/stripe-ios/releases) en GitHub. Para recibir notificaciones cuando se publica una nueva versión, [consulta las versiones](https://help.github.com/en/articles/watching-and-unwatching-releases-for-a-repository#watching-releases-for-a-repository) del repositorio. ## Habilitar los métodos de pago Visualiza tu [configuración de métodos de pago](https://dashboard.stripe.com/settings/payment_methods) y habilita los que quieras aceptar. Se necesita al menos un método de pago habilitado para crear un *PaymentIntent* (The Payment Intents API tracks the lifecycle of a customer checkout flow and triggers additional authentication steps when required by regulatory mandates, custom Radar fraud rules, or redirect-based payment methods). De forma predeterminada, Stripe habilita tarjetas y otros métodos de pago habituales que pueden ayudarte a llegar a más clientes, pero te recomendamos activar otros métodos de pago que sean relevantes para tu empresa y tus clientes. Consulta [Compatibilidad con métodos de pago](https://docs.stripe.com/payments/payment-methods/payment-method-support.md) para obtener información sobre productos y métodos de pago y nuestra [página de tarifas](https://stripe.com/pricing/local-payment-methods) para conocer las comisiones. ## Añadir un punto de conexión [Lado del servidor] > #### Nota > > Para mostrar la PaymentSheet antes de crear un PaymentIntent, consulta [Recolectar datos de pago antes de crear un Intent](https://docs.stripe.com/payments/accept-a-payment-deferred.md?type=payment). Esta integración usa tres objetos de la API de Stripe: 1. [PaymentIntent](https://docs.stripe.com/api/payment_intents.md): Stripe usa este dato para representar tu intención de cobrarle a un cliente y hacer el seguimiento de los intentos de cobro y de los cambios en el estado del pago a lo largo del proceso. 2. (Opcional) [Customer](https://docs.stripe.com/api/customers.md): para configurar un método de pago para pagos futuros, debes vincularlo a un cliente. Crea un objeto que represente a tu cliente cuando cree una cuenta en tu empresa. Si tu cliente realiza un pago como invitado, puedes crear un objeto `Customer` antes del pago y asociarlo más adelante a tu propia representación interna de la cuenta del cliente. 3. (Opcional) [CustomerSession](https://docs.stripe.com/api/customer_sessions.md): la información del objeto que representa a tu cliente es confidencial y no se puede recuperar directamente desde una aplicación. Un `CustomerSession` otorga al SDK acceso temporal y limitado al `Customer` y proporciona [opciones de configuración](https://docs.stripe.com/api/customer_sessions/create.md#create_customer_session-components) adicionales. > Si nunca guardas tarjetas de clientes, puedes omitir el objeto `Customer` y el objeto `CustomerSession` de tu integración. Por motivos de seguridad, tu aplicación no puede crear estos objetos. En su lugar, añade un punto de conexión en tu servidor que: 1. Recupera el objeto `Customer` o crea uno nuevo. 2. Crea un [CustomerSession](https://docs.stripe.com/api/customer_sessions.md) para el `Customer`. 3. Crea un `PaymentIntent` con el [importe](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-amount), la [divisa](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-currency), y el [cliente](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-customer). 4. Devuelve el *secreto de cliente* (The client secret is a unique key returned from Stripe as part of a PaymentIntent. This key lets the client access important fields from the PaymentIntent (status, amount, currency) while hiding sensitive ones (metadata, customer)) del `PaymentIntent`, el `client_secret` del `CustomerSession`, el ID del `Customer` y tu [clave publicable](https://dashboard.stripe.com/apikeys) a tu aplicación. Establece en el `PaymentIntent` el mismo `Customer` que estableciste en el `CustomerSession`. Los métodos de pago que se muestran a los clientes durante el proceso de compra también se incluyen en el PaymentIntent. Puedes permitir que Stripe extraiga automáticamente los métodos de pago de la configuración de tu Dashboard o puedes enumerarlos de forma manual. Independientemente de la opción que elijas, debes saber que la divisa especificada en el PaymentIntent filtra los métodos de pago que se muestran al cliente. Por ejemplo, si especificas `eur` en el PaymentIntent y tienes habilitado OXXO en el Dashboard, OXXO no se mostrará al cliente porque no acepta pagos en `eur`. A menos que tu integración requiera una opción basada en código para ofrecer métodos de pago, Stripe recomienda usar la opción automatizada. Esto se debe a que Stripe evalúa la divisa, las restricciones en cuanto a los métodos de pago y otros parámetros para determinar la lista de métodos de pago aceptados. Se da prioridad a los métodos de pago que aumentan la conversión y guardan mayor relación con la divisa y la ubicación del cliente. #### Gestiona los métodos de pago desde el Dashboard Puedes gestionar los métodos de pagos desde el [Dashboard](https://dashboard.stripe.com/settings/payment_methods). Stripe crea el `PaymentIntent` utilizando los métodos de pagos elegibles que has configurado, en función de factores como el importe, la divisa y el flujo de pago de la transacción. Si no quieres usar el Dashboard o si quieres especificar los métodos de pagos permitidos manualmente, puedes usar el parámetro `allowed_payment_method_types`. #### curl ```bash # Create a Customer (use an existing Customer ID if this is a returning customer) curl https://api.stripe.com/v1/customers \ -u <>: \ -X "POST" \ -H "Stripe-Account: {{CONNECTED_ACCOUNT_ID}}" # Create a CustomerSession for the Customer curl https://api.stripe.com/v1/customer_sessions \ -u <>: \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "components[mobile_payment_element][enabled]"=true \ -d "components[mobile_payment_element][features][payment_method_save]"=enabled \ -d "components[mobile_payment_element][features][payment_method_redisplay]"=enabled \ -d "components[mobile_payment_element][features][payment_method_remove]"=enabled # Create a PaymentIntent curl https://api.stripe.com/v1/payment_intents \ -u <>: \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "amount"=1099 \ -d "currency"="eur" \ -d "automatic_payment_methods[enabled]"=true \ ``` #### Cómo enumerar métodos de pago manualmente #### curl ```bash # Create a Customer (use an existing Customer ID if this is a returning customer) curl https://api.stripe.com/v1/customers \ -u <>: \ -X "POST" \ -H "Stripe-Account: {{CONNECTED_ACCOUNT_ID}}" # Create a CustomerSession for the Customer curl https://api.stripe.com/v1/customer_sessions \ -u <>: \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "components[mobile_payment_element][enabled]"=true \ -d "components[mobile_payment_element][features][payment_method_save]"=enabled \ -d "components[mobile_payment_element][features][payment_method_redisplay]"=enabled \ -d "components[mobile_payment_element][features][payment_method_remove]"=enabled # Create a PaymentIntent curl https://api.stripe.com/v1/payment_intents \ -u <>: \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "amount"=1099 \ -d "currency"="eur" \ -d "allowed_payment_method_types[]"="bancontact" \ -d "allowed_payment_method_types[]"="card" \ -d "allowed_payment_method_types[]"="ideal" \ -d "allowed_payment_method_types[]"="klarna" \ -d "allowed_payment_method_types[]"="sepa_debit" \ ``` > Cada método de pago debe aceptar la divisa especificada en el PaymentIntent, y tu empresa tiene que estar establecida en uno de los países que acepta cada método de pago. Consulta la página de [Opciones de integración de los métodos de pago](https://docs.stripe.com/payments/payment-methods/integration-options.md) para obtener más información sobre lo que se acepta. ## Recopilar datos de pago [Lado del cliente] Para mostrar el elemento de pago móvil en tu pantalla del proceso de compra: - Muestra los productos que compra el cliente junto con el importe total. - Usa el [Address Element](https://docs.stripe.com/elements/address-element.md?platform=ios) para recolectar la información de envío necesaria del cliente - Añade un botón de finalización de compra para mostrar la interfaz de usuario de Stripe #### UIKit En la pantalla proceso de compra de tu aplicación, obtén el secreto de cliente PaymentIntent, el secreto de cliente `CustomerSession`, el ID de `cliente` y la clave publicable del punto de conexión que creaste en el paso anterior. Usa `STPAPIClient.shared` para establecer tu clave publicable e inicializar la [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html). #### iOS (Swift) ```swift import UIKit @_spi(CustomerSessionBetaAccess) import StripePaymentSheet class CheckoutViewController: UIViewController { @IBOutlet weak var checkoutButton: UIButton! var paymentSheet: PaymentSheet? let backendCheckoutUrl = URL(string: "Your backend endpoint/payment-sheet")! // Your backend endpoint override func viewDidLoad() { super.viewDidLoad() checkoutButton.addTarget(self, action: #selector(didTapCheckoutButton), for: .touchUpInside) checkoutButton.isEnabled = false // MARK: Fetch the PaymentIntent client secret, CustomerSession client secret, Customer ID, and publishable key var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerId = json["customer"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, let paymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKey // MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customer = .init(id: customerId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business handles // delayed notification payment methods like US bank accounts. configuration.allowsDelayedPaymentMethods = true self.paymentSheet = PaymentSheet(paymentIntentClientSecret:paymentIntentClientSecret, configuration: configuration) DispatchQueue.main.async { self.checkoutButton.isEnabled = true } }) task.resume() } } ``` Cuando el cliente toque el botón **Checkout**, llama a `present` para presentar la PaymentSheet. Después de que el cliente efectiviza el pago, Stripe cierra la PaymentSheet y llama al bloque de finalización con [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html). #### iOS (Swift) ```swift @objc func didTapCheckoutButton() { // MARK: Start the checkout process paymentSheet?.present(from: self) { paymentResult in // MARK: Handle the payment result switch paymentResult { case .completed: print("Your order is confirmed") case .canceled: print("Canceled!") case .failed(let error): print("Payment failed: \(error)") } } } ``` #### SwiftUI Crea un modelo de `ObservableObject` para tu pantalla del proceso de compra. Este modelo publica un [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html) y un [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html). ```swift import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? } ``` Obtén el secreto de cliente PaymentIntent, el secreto de cliente CustomerSession, el ID de `cliente` y la clave publicable del punto de conexión que creaste en el paso anterior. Usa `STPAPIClient.shared` para establecer tu clave publicable e inicializar la [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html). ```swift @_spi(CustomerSessionBetaAccess) import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? func preparePaymentSheet() { // MARK: Fetch thePaymentIntent and Customer information from the back end var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerId = json["customer"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, letpaymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKey // MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customer = .init(id: customerId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business handles // delayed notification payment methods like US bank accounts. configuration.allowsDelayedPaymentMethods = true DispatchQueue.main.async { self.paymentSheet = PaymentSheet(paymentIntentClientSecret:paymentIntentClientSecret, configuration: configuration) } }) task.resume() } } struct CheckoutView: View { @ObservedObject var model = CheckoutViewModel() var body: some View { VStack { if model.paymentSheet != nil { Text("Ready to pay.") } else { Text("Loading…") } }.onAppear { model.preparePaymentSheet() } } } ``` Añade un [PaymentSheet.PaymentButton](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/PaymentButton.html) a tu `View`. Esto se comporta de manera similar a un `Button` de SwiftUI, que te permite personalizarlo añadiendo una `View`. Al pulsar el botón, se muestra la PaymentSheet. Después de efectivizar el pago, Stripe cierra la PaymentSheet y llama al controlador `onCompletion` con un objeto [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html). ```swift @_spi(CustomerSessionBetaAccess) import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? func preparePaymentSheet() { // MARK: Fetch the PaymentIntent and Customer information from the back end var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerId = json["customer"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, let paymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKey // MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customer = .init(id: customerId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business can handle payment methods // that complete payment after a delay, like SEPA Debit and Sofort. configuration.allowsDelayedPaymentMethods = true DispatchQueue.main.async { self.paymentSheet = PaymentSheet(paymentIntentClientSecret: paymentIntentClientSecret, configuration: configuration) } }) task.resume() } func onPaymentCompletion(result: PaymentSheetResult) { self.paymentResult = result } } struct CheckoutView: View { @ObservedObject var model = CheckoutViewModel() var body: some View { VStack { if let paymentSheet = model.paymentSheet { PaymentSheet.PaymentButton( paymentSheet: paymentSheet, onCompletion: model.onPaymentCompletion ) { Text("Buy") } } else { Text("Loading…") } if let result = model.paymentResult { switch result { case .completed: Text("Payment complete") case .failed(let error): Text("Payment failed: \(error.localizedDescription)") case .canceled: Text("Payment canceled.") } } }.onAppear { model.preparePaymentSheet() } } } ``` Si el `PaymentSheetResult` es `.completed`, comunícaselo al cliente (por ejemplo, mostrándole una pantalla de confirmación del pedido). Establecer `allowsDelayedPaymentMethods` en true permite utilizar métodos de pago de [notificación diferida](https://docs.stripe.com/payments/payment-methods.md#payment-notification) como cuentas bancarias de EE. UU. Para estos métodos de pago, el estado final del pago no se conoce cuando se completa la `PaymentSheet`, sino que se efectúa correctamente o con errores más tarde. Si aceptas este tipo de métodos de pago, infórmale al cliente de que su pedido está confirmado y solo complétalo (por ejemplo, envía el producto) cuando el pago se haya realizado correctamente. ## Configurar una URL de retorno [Lado del cliente] Es posible que el cliente salga de tu aplicación para autenticarse (por ejemplo, en Safari o en su aplicación bancaria). Para permitirles volver automáticamente a tu aplicación después de la autenticación, [configura un esquema de URL personalizado](https://developer.apple.com/documentation/xcode/defining-a-custom-url-scheme-for-your-app) y configura el delegado de la aplicación para que envíe la URL al SDK. Stripe no admite [enlaces universales](https://developer.apple.com/documentation/xcode/allowing-apps-and-websites-to-link-to-your-content). #### SceneDelegate #### Swift ```swift // This method handles opening custom URL schemes (for example, "your-app://stripe-redirect") func scene(_ scene: UIScene, openURLContexts URLContexts: Set) { guard let url = URLContexts.first?.url else { return } let stripeHandled = StripeAPI.handleURLCallback(with: url) if (!stripeHandled) { // This was not a Stripe url – handle the URL normally as you would } } ``` #### AppDelegate #### Swift ```swift // This method handles opening custom URL schemes (for example, "your-app://stripe-redirect") func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool { let stripeHandled = StripeAPI.handleURLCallback(with: url) if (stripeHandled) { return true } else { // This was not a Stripe url – handle the URL normally as you would } return false } ``` #### SwiftUI #### Swift ```swift @main struct MyApp: App { var body: some Scene { WindowGroup { Text("Hello, world!") .onOpenURL { incomingURL in let stripeHandled = StripeAPI.handleURLCallback(with: incomingURL) if (!stripeHandled) { // This was not a Stripe url – handle the URL normally as you would } } } } } ``` Además, establece la [returnURL](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:6Stripe12PaymentSheetC13ConfigurationV9returnURLSSSgvp) en tu objeto [PaymentSheet.Configuration](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html) en la URL de tu aplicación. ```swift var configuration = PaymentSheet.Configuration() configuration.returnURL = "your-app://stripe-redirect" ``` ## Administrar eventos posteriores al pago [Lado del servidor] Stripe envía un evento [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.succeeded) cuando se efectiviza el pago. Usa la [herramienta webhook del Dashboard](https://dashboard.stripe.com/webhooks) o sigue las indicaciones de la [guía de webhooks](https://docs.stripe.com/webhooks/quickstart.md) para recibir estos eventos y acciones de ejecución, como enviar a tu cliente un correo electrónico de confirmación del pedido, registrar la venta en una base de datos o iniciar el flujo de trabajo de los envíos. Escucha estos eventos en lugar de esperar una devolución de llamada del cliente. Por su parte, el cliente puede cerrar la ventana del navegador o salir de la aplicación antes de que se ejecute la devolución de llamada. Si configuras tu integración para escuchar eventos asincrónicos, podrás aceptar [diferentes tipos de métodos de pago](https://stripe.com/payments/payment-methods-guide) con una sola integración. Además de administrar el evento `payment_intent.succeeded`, recomendamos administrar estos otros eventos si se cobran pagos con el Payment Element: | Evento | Descripción | Acción | | ------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.succeeded) | Se envía cuando un cliente completa correctamente un pago. | Envía al cliente una confirmación del pedido y *completa* (Fulfillment is the process of providing the goods or services purchased by a customer, typically after payment is collected) el pedido. | | [payment_intent.processing](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.processing) | Se envía cuando el cliente inicia el pago correctamente, pero este aún no se ha efectivizado. En la mayoría de los casos, este evento se envía cuando el cliente inicia un adeudo bancario. Más adelante, le seguirá el evento `payment_intent.succeeded` o `payment_intent.payment_failed`. | Envía al cliente una confirmación del pedido que indique que su pago está pendiente. Para los productos digitales, es posible que desees completar el pedido antes de esperar a que se efectivice el pago. | | [payment_intent.payment_failed](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.payment_failed) | Se envía cuando el cliente intenta realizar un pago, pero este falla. | Si un pago pasa de `processing` a `payment_failed`, ofrécele al cliente otro intento de pago. | ## Probar la integración #### Tarjetas | Número de tarjeta | Situación | Cómo hacer pruebas | | ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- | | 4242424242424242 | El pago con tarjeta se realiza correctamente y no requiere autenticación. | Rellena el formulario de tarjeta de crédito con el número de tarjeta y cualquier fecha de caducidad, CVC y código postal. | | 4000002500003155 | El pago con tarjeta requiere *autenticación* (Strong Customer Authentication (SCA) is a regulatory requirement in effect as of September 14, 2019, that impacts many European online payments. It requires customers to use two-factor authentication like 3D Secure to verify their purchase). | Rellena el formulario de tarjeta de crédito con el número de tarjeta y cualquier fecha de caducidad, CVC y código postal. | | 4000000000009995 | La tarjeta se rechaza con un código de rechazo como, por ejemplo, `insufficient_funds`. | Rellena el formulario de tarjeta de crédito con el número de tarjeta y cualquier fecha de caducidad, CVC y código postal. | | 6205500000000000004 | La tarjeta UnionPay tiene una longitud variable de 13-19 dígitos. | Rellena el formulario de tarjeta de crédito con el número de tarjeta y cualquier fecha de caducidad, CVC y código postal. | #### Redireccionamientos bancarios | Método de pago | Situación | Cómo hacer pruebas | | ----------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | Bancontact, iDEAL | Tu cliente no pasa la autenticación en la página de redireccionamiento de un método de pago basado en redireccionamiento y con notificación inmediata. | Elige el método de pago basado en redireccionamiento, rellena los datos solicitados y confirma el pago. A continuación, haz clic en **Error en el pago de prueba** en la página de redireccionamiento. | | Pay by Bank | Tu cliente paga correctamente con un método de pago basado en redireccionamiento y [notificación diferida](https://docs.stripe.com/payments/payment-methods.md#payment-notification). | Elige el método de pago, completa los datos solicitados y confirma el pago. Luego, haz clic en **Completar el pago de prueba** en la página de redireccionamiento. | | Pay by Bank | Tu cliente no pasa la autenticación en la página de redireccionamiento de un método de pago basado en redireccionamiento y con notificación diferida. | Elige el método de pago, completa los datos solicitados y confirma el pago. Luego, haz clic en **Error en el pago de prueba** en la página de redireccionamiento. | | BLIK | Los pagos BLIK fallan de varias maneras: fallos inmediatos (por ejemplo, el código ha caducado o no es válido), errores demorados (el banco los rechaza) o tiempos de espera (el cliente no ha respondido a tiempo). | Usa patrones de correo electrónico para [simular los diferentes fallos.](https://docs.stripe.com/payments/blik/accept-a-payment.md#simulate-failures) | #### Adeudos bancarios | Método de pago | Situación | Cómo hacer pruebas | | ------------------- | --------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Adeudo directo SEPA | Tu cliente paga correctamente con adeudo directo SEPA. | Rellena el formulario con el número de cuenta `AT321904300235473204`. El PaymentIntent confirmado pasa inicialmente al estado processing y, tres minutos más tarde, a succeeded. | | Adeudo directo SEPA | El estado del intento de pago de tu cliente pasa de `processing` a `requires_payment_method`. | Rellena el formulario con el número de cuenta `AT861904300235473202`. | Consulta [Pruebas](https://docs.stripe.com/testing.md) para obtener información adicional para probar tu integración. ## Optional: Enable Link Activa Link en tu [configuración de método de pago](https://dashboard.stripe.com/settings/payment_methods) para permitir que tus clientes guarden y reutilicen de forma segura su información de pago mediante el botón de proceso de compra rápida con un solo clic de Link. ### Pasa el correo electrónico de tu cliente al Payment Element móvil Link autentica a un cliente utilizando su dirección de correo electrónico. Stripe recomienda completar previamente la mayor cantidad de información posible para optimizar el proceso de compra. Para completar previamente el nombre, la dirección de correo electrónico y el número de teléfono del cliente, proporciona a `defaultBillingDetails` la información de tu cliente después de inicializar `PaymentSheet.Configuration`. ```swift var configuration = PaymentSheet.Configuration() configuration.defaultBillingDetails.name = "Jenny Rosen" configuration.defaultBillingDetails.email = "jenny.rosen@example.com" configuration.defaultBillingDetails.phone = "888-888-8888" ``` ### Gestiona el cierre de sesión de usuarios `PaymentSheet` almacena cierta información localmente para recordar si un usuario ha utilizado Link dentro de una aplicación. Para borrar el estado interno de `PaymentSheet`, llama al método `PaymentSheet.resetCustomer()` cuando tu usuario cierra sesión. ```swift import UIKit import StripePaymentSheet class MyViewController: UIViewController { @objc func didTapLogoutButton() { PaymentSheet.resetCustomer() // Other logout logic required by your app } } ``` ## Optional: Habilitar Apple Pay > Si la pantalla de tu proceso de compra tiene un **botón de Apple Pay** exclusivo, sigue la [Guía de Apple Pay](https://docs.stripe.com/apple-pay.md#present-payment-sheet) y utiliza `ApplePayContext` para cobrar el pago desde ese botón. Puedes usar `PaymentSheet` para gestionar otros tipos de métodos de pago. ### Regístrate para obtener un ID de comerciante de Apple Obtén un ID de comerciante Apple [registrándote para obtener un nuevo identificador](https://developer.apple.com/account/resources/identifiers/add/merchant) en el sitio web de Apple para desarrolladores. Rellena el formulario incluyendo una descripción y el identificador. La descripción es solo para ti y podrás modificarla después. Stripe te recomienda que uses como identificador el nombre de tu aplicación (por ejemplo, `merchant.com.{{YOUR_APP_NAME}}`). ### Crear un nuevo certificado de Apple Pay Crea un certificado para que tu aplicación cifre los datos de pago. Ve a [Configuración de certificados de iOS](https://dashboard.stripe.com/settings/ios_certificates) en el Dashboard, haz clic en **Añadir aplicación nueva** y sigue las indicaciones. Descarga un archivo de petición de firma de certificado (CSR) para obtener un certificado seguro de Apple que te permita utilizar Apple Pay. Se debe usar un archivo CSR para emitir un certificado de manera exacta. Si cambias tu ID de comerciante de Apple, debes ir a la [Configuración de certificados de iOS](https://dashboard.stripe.com/settings/ios_certificates) en el Dashboard para obtener un CSR y un certificado nuevos. ### Integrar con Xcode Añade la funcionalidad Apple Pay a tu aplicación. En Xcode, abre la configuración del proyecto, selecciona la pestaña **Firma y funcionalidades** y añade la funcionalidad **Apple Pay**. Aquí, es posible que se te pida que inicies sesión en tu cuenta de desarrollador. Selecciona el ID de comerciante que creaste antes, y tu aplicación estará lista para aceptar Apple Pay. ![](https://b.stripecdn.com/docs-statics-srv/assets/xcode.a701d4c1922d19985e9c614a6f105bf1.png) Habilita la funcionalidad Apple Pay en Xcode ### Añadir Apple Pay #### Pago único Para añadir Apple Pay a PaymentSheet, establece [applePay](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:6Stripe12PaymentSheetC13ConfigurationV8applePayAC05ApplefD0VSgvp) después de iniciar `PaymentSheet.Configuration` con tu ID de comerciante de Apple y el [código de país de tu empresa](https://dashboard.stripe.com/settings/account). #### iOS (Swift) ```swift var configuration = PaymentSheet.Configuration() configuration.applePay = .init( merchantId: "merchant.com.your_app_name", merchantCountryCode: "US" ) ``` #### Pagos recurrentes Para añadir Apple Pay a PaymentSheet, establece [applePay](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:6Stripe12PaymentSheetC13ConfigurationV8applePayAC05ApplefD0VSgvp) después de iniciar `PaymentSheet.Configuration` con tu ID de comerciante de Apple y el [código de país de tu empresa](https://dashboard.stripe.com/settings/account). De acuerdo con [las directrices de Apple](https://developer.apple.com/design/human-interface-guidelines/apple-pay#Supporting-subscriptions) para pagos recurrentes, también debes establecer más atributos en `PKPaymentRequest`. Añade un controlador en [ApplePayConfiguration.paymentRequestHandlers](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/applepayconfiguration/handlers/paymentrequesthandler) para configurar [PKPaymentRequest.paymentSummaryItems](https://developer.apple.com/documentation/passkit/pkpaymentrequest/1619231-paymentsummaryitems) con el importe que quieres cobrar (por ejemplo, 9,95 USD al mes). También puedes adoptar [tokens de comerciante](https://developer.apple.com/apple-pay/merchant-tokens/) estableciendo las propiedades `recurringPaymentRequest` o `automaticReloadPaymentRequest` en la `PKPaymentRequest`. Para obtener más información sobre cómo usar los pagos recurrentes con Apple Pay, consulta [Documentación de Apple sobre PassKit](https://developer.apple.com/documentation/passkit/pkpaymentrequest). #### iOS (Swift) ```swift let customHandlers = PaymentSheet.ApplePayConfiguration.Handlers( paymentRequestHandler: { request in // PKRecurringPaymentSummaryItem is available on iOS 15 or later if #available(iOS 15.0, *) { let billing = PKRecurringPaymentSummaryItem(label: "My Subscription", amount: NSDecimalNumber(string: "59.99")) // Payment starts today billing.startDate = Date() // Payment ends in one year billing.endDate = Date().addingTimeInterval(60 * 60 * 24 * 365) // Pay once a month. billing.intervalUnit = .month billing.intervalCount = 1 // recurringPaymentRequest is only available on iOS 16 or later if #available(iOS 16.0, *) { request.recurringPaymentRequest = PKRecurringPaymentRequest(paymentDescription: "Recurring", regularBilling: billing, managementURL: URL(string: "https://my-backend.example.com/customer-portal")!) request.recurringPaymentRequest?.billingAgreement = "You'll be billed $59.99 every month for the next 12 months. To cancel at any time, go to Account and click 'Cancel Membership.'" } request.paymentSummaryItems = [billing] request.currencyCode = "USD" } else { // On older iOS versions, set alternative summary items. request.paymentSummaryItems = [PKPaymentSummaryItem(label: "Monthly plan starting July 1, 2022", amount: NSDecimalNumber(string: "59.99"), type: .final)] } return request } ) var configuration = PaymentSheet.Configuration() configuration.applePay = .init(merchantId: "merchant.com.your_app_name", merchantCountryCode: "US", customHandlers: customHandlers) ``` ### Seguimiento de pedidos Para añadir información de [seguimiento de pedidos](https://developer.apple.com/design/human-interface-guidelines/technologies/wallet/designing-order-tracking) en iOS 16 o versiones posteriores, configura un [authorizationResultHandler](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/applepayconfiguration/handlers/authorizationresulthandler) en tu `PaymentSheet.ApplePayConfiguration.Handlers`. Stripe llama a tu implementación después de que se haya efectivizado el pago, pero antes de que iOS descarte la hoja de Apple Pay. En la implementación de `authorizationResultHandler`, obtén los detalles del pedido del servidor para el pedido completado. Añade los datos al [PKPaymentAuthorizationResult](https://developer.apple.com/documentation/passkit/pkpaymentauthorizationresult) y devuelve el resultado modificado. Para obtener más información sobre el seguimiento de pedidos, consulta [Documentación de Apple sobre los pedidos por monedero](https://developer.apple.com/documentation/walletorders). #### iOS (Swift) ```swift let customHandlers = PaymentSheet.ApplePayConfiguration.Handlers( authorizationResultHandler: { result in do { // Fetch the order details from your service let myOrderDetails = try await MyAPIClient.shared.fetchOrderDetails(orderID: orderID) result.orderDetails = PKPaymentOrderDetails( orderTypeIdentifier: myOrderDetails.orderTypeIdentifier, // "com.myapp.order" orderIdentifier: myOrderDetails.orderIdentifier, // "ABC123-AAAA-1111" webServiceURL: myOrderDetails.webServiceURL, // "https://my-backend.example.com/apple-order-tracking-backend" authenticationToken: myOrderDetails.authenticationToken) // "abc123" // Return your modified PKPaymentAuthorizationResult return result } catch { return PKPaymentAuthorizationResult(status: .failure, errors: [error]) } } ) var configuration = PaymentSheet.Configuration() configuration.applePay = .init(merchantId: "merchant.com.your_app_name", merchantCountryCode: "US", customHandlers: customHandlers) ``` ## Habilitar escaneo de tarjetas Para habilitar la compatibilidad con el escaneo de tarjetas en iOS, establece la `NSCameraUsageDescription` (**Privacidad - Descripción del uso de la cámara**) en la `Info.plist` de tu aplicación, y proporciona un motivo para acceder a la cámara (por ejemplo, “Escanear tarjetas”). ## Optional: Habilitar pagos ACH Para habilitar los pagos con adeudo ACH, debes incluir `StripeFinancialConnections` como dependencia a tu aplicación. El [SDK para iOS de Stripe](https://github.com/stripe/stripe-ios) es de código abierto, está [plenamente documentado](https://stripe.dev/stripe-ios/index.html) y es compatible con aplicaciones que admiten iOS 13 o posterior. #### Administrador de paquetes Swift Para instalar el SDK, sigue estos pasos: 1. En Xcode, elige **Archivo** > **Añadir dependencias de paquetes…** e introduce `https://github.com/stripe/stripe-ios-spm` como la URL del repositorio. 2. Selecciona el número de versión más reciente en nuestra [página de versiones](https://github.com/stripe/stripe-ios/releases). 3. Añade el producto **StripeFinancialConnections** al [objetivo de tu aplicación](https://developer.apple.com/documentation/swift_packages/adding_package_dependencies_to_your_app). #### Carthage 1. Si aún no lo has hecho, instala la última versión de [Carthage](https://github.com/Carthage/Carthage#installing-carthage). 2. Añade esta línea a tu `Cartfile`: ```cartfile github "stripe/stripe-ios" ``` 3. Sigue las [instrucciones de instalación de Carthage](https://github.com/Carthage/Carthage#if-youre-building-for-ios-tvos-or-watchos). Asegúrate de incrustar todos los frameworks obligatorios enumerados [aquí](https://github.com/stripe/stripe-ios/tree/master/StripeFinancialConnections/README.md#manual-linking). 4. En el futuro, para actualizar a la última versión del SDK, ejecuta el siguiente comando: ```bash carthage update stripe-ios --platform ios ``` #### Plataforma manual 1. Ve a nuestra [página de versiones de GitHub](https://github.com/stripe/stripe-ios/releases/latest) y descarga y descomprime **Stripe.xcframework.zip**. 2. Arrastra **StripeFinancialConnections.xcframework** a la sección **Binarios incrustados** de la configuración **General** de tu proyecto en Xcode. Asegúrate de seleccionar **Copiar elementos si es necesario**. 3. Repite el paso 2 para todos los frameworks obligatorios enumerados [here](https://github.com/stripe/stripe-ios/tree/master/StripeFinancialConnections/README.md#manual-linking). 4. En el futuro, para actualizar a la última versión de nuestro SDK, repite los pasos 1 a 3. > Para obtener más información sobre la versión más reciente y sobre versiones anteriores del SDK, consulta la página [Versiones](https://github.com/stripe/stripe-ios/releases) en GitHub. Para recibir notificaciones cuando se publica una nueva versión, [consulta las versiones](https://help.github.com/en/articles/watching-and-unwatching-releases-for-a-repository#watching-releases-for-a-repository) del repositorio. ## Optional: Personalizar la hoja Todo lo que se quieras personalizar se configura mediante el objeto [PaymentSheet.Configuration](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html). ### Aspecto Personaliza los colores, las fuentes, etc. para que coincidan con el aspecto de tu aplicación mediante la [API de apariencia](https://docs.stripe.com/elements/appearance-api/mobile.md?platform=ios). ### Diseño del método de pago Configura el diseño de los métodos de pago en la hoja usando [paymentMethodLayout](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/configuration-swift.struct/paymentmethodlayout). Puedes mostrarlos horizontalmente, verticalmente o dejar que Stripe optimice el diseño automáticamente. ![](https://b.stripecdn.com/docs-statics-srv/assets/ios-mpe-payment-method-layouts.9d0513e2fcec5660378ba1824d952054.png) #### Swift ```swift var configuration = PaymentSheet.Configuration() configuration.paymentMethodLayout = .automatic ``` ### Recopilar direcciones de usuarios Recolecta las direcciones de envío o facturación locales e internacionales de tus clientes usando el [Address Element](https://docs.stripe.com/elements/address-element.md?platform=ios). ### Nombre con el que aparecerá el comerciante Configura [merchantDisplayName](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:18StripePaymentSheet0bC0C13ConfigurationV19merchantDisplayNameSSvp) para especificar el nombre de empresa que quieres que vea el cliente. De forma predeterminada, este es el nombre de tu aplicación. #### Swift ```swift var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "My app, Inc." ``` ### Modo oscuro `PaymentSheet` se adapta automáticamente a la configuración de aspecto de todo el sistema del usuario (modo claro y modo oscuro). Si tu aplicación no acepta el modo oscuro, puedes establecer el [estilo](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:18StripePaymentSheet0bC0C13ConfigurationV5styleAC18UserInterfaceStyleOvp) en modo `alwaysLight` o `alwaysDark`. ```swift var configuration = PaymentSheet.Configuration() configuration.style = .alwaysLight ``` ### Datos de facturación predeterminados Para establecer los valores predeterminados para los datos de facturación recopilados en la hoja de pago, configura la propiedad `defaultBillingDetails`. Los campos de la `PaymentSheet` se rellenan automáticamente con los valores que proporcionas. ```swift var configuration = PaymentSheet.Configuration() configuration.defaultBillingDetails.address.country = "US" configuration.defaultBillingDetails.email = "foo@bar.com" ``` ### Recopilación de los datos de facturación Usa `billingDetailsCollectionConfiguration` para especificar cómo quieres recopilar los datos de facturación en la hoja de pago. Puedes recopilar el nombre, el correo electrónico, el número de teléfono y la dirección del cliente. La recopilación de direcciones completas incluye la función de autocompletado proporcionada por Stripe para los países admitidos, sin necesidad de configuración adicional. > Al usar la función de autocompletado, aceptas cumplir la [Política de uso aceptable de la plataforma Google Maps](https://cloud.google.com/maps-platform/terms/aup). Si infringes esta política, Stripe podría desactivar la función de autocompletado o tomar otras medidas necesarias. Si solo quieres recopilar los datos de facturación requeridos por el método de pago, establece `billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod` en true. En ese caso, `configuration.defaultBillingDetails` se establecen como los [datos de facturación](https://docs.stripe.com/api/payment_methods/object.md?lang=node#payment_method_object-billing_details) del método de pago. Si quieres recopilar datos de facturación adicionales que no son necesariamente requeridos por el método de pago, establece `billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod` en false. En ese caso, los datos de facturación recopilados a través de la interfaz de usuario se establecen como los datos de facturación del método de pago. ```swift var configuration = PaymentSheet.Configuration() configuration.defaultBillingDetails.email = "foo@bar.com" configuration.billingDetailsCollectionConfiguration.name = .always configuration.billingDetailsCollectionConfiguration.email = .never configuration.billingDetailsCollectionConfiguration.address = .full configuration.billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod = true ``` > Consulta a tu asesor legal sobre las leyes que se aplican a la recopilación de información. Recopila los números de teléfono solo si los necesitas para la transacción. ## Optional: Efectiviza el pago en tu interfaz de usuario Puedes presentar la hoja de pago para recopilar solo los datos del método de pago y después llamar al método `confirm` para completar el pago en la interfaz de usuario de tu aplicación. Esto resulta útil si tienes un botón de compra personalizado o solicitas pasos adicionales después de que se recopilen los datos de pago. ![](https://b.stripecdn.com/docs-statics-srv/assets/ios-multi-step.cd631ea4f1cd8cf3f39b6b9e1e92b6c5.png) Efectiviza el pago en la interfaz de usuario de tu aplicación #### UIKit Los siguientes pasos te guían a través del proceso para efectivizar el pago en la interfaz de usuario de tu aplicación. Consulta nuestro ejemplo de integración en [GitHub](https://github.com/stripe/stripe-ios/blob/master/Example/PaymentSheet%20Example/PaymentSheet%20Example/ExampleCustomCheckoutViewController.swift). 1. Primero, inicializa [PaymentSheet.FlowController](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller) en lugar de `PaymentSheet` y actualiza tu interfaz de usuario con su propiedad `paymentOption`. Esta propiedad contiene una imagen y una etiqueta que representan el método de pago predeterminado seleccionado inicialmente por el cliente. ```swift PaymentSheet.FlowController.create(paymentIntentClientSecret: paymentIntentClientSecret, configuration: configuration) { [weak self] result in switch result { case .failure(let error): print(error) case .success(let paymentSheetFlowController): self?.paymentSheetFlowController = paymentSheetFlowController // Update your UI using paymentSheetFlowController.paymentOption } } ``` 1. A continuación, llama a `presentPaymentOptions` para recopilar los datos del pago. Cuando se complete, actualiza nuevamente tu interfaz de usuario con la propiedad `paymentOption`. ```swift paymentSheetFlowController.presentPaymentOptions(from: self) { // Update your UI using paymentSheetFlowController.paymentOption } ``` 1. Por último, llama a `confirm`. ```swift paymentSheetFlowController.confirm(from: self) { paymentResult in // MARK: Handle the payment result switch paymentResult { case .completed: print("Payment complete!") case .canceled: print("Canceled!") case .failed(let error): print(error) } } ``` #### SwiftUI Los siguientes pasos te guían a través del proceso para efectivizar el pago en la interfaz de usuario de tu aplicación. Consulta nuestro ejemplo de integración en [GitHub](https://github.com/stripe/stripe-ios/blob/master/Example/PaymentSheet%20Example/PaymentSheet%20Example/ExampleSwiftUICustomPaymentFlow.swift). 1. Primero, inicializa [PaymentSheet.FlowController](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller) en lugar de `PaymentSheet`. Su propiedad `paymentOption` contiene una imagen y una etiqueta que representa el método de pago actualmente seleccionado por el cliente y que puedes utilizar en tu interfaz de usuario. ```swift PaymentSheet.FlowController.create(paymentIntentClientSecret: paymentIntentClientSecret, configuration: configuration) { [weak self] result in switch result { case .failure(let error): print(error) case .success(let paymentSheetFlowController): self?.paymentSheetFlowController = paymentSheetFlowController // Use the paymentSheetFlowController.paymentOption properties in your UI myPaymentMethodLabel = paymentSheetFlowController.paymentOption?.label ?? "Select a payment method" myPaymentMethodImage = paymentSheetFlowController.paymentOption?.image ?? UIImage(systemName: "square.and.pencil")! } } ``` 1. Usa [PaymentSheet.FlowController.PaymentOptionsButton](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller/paymentoptionsbutton) para integrar el botón que presenta la hoja para recoger los datos de pago. Cuando `PaymentSheet.FlowController` llama al argumento `onSheetDismissed`, el `paymentOption` de la instancia `PaymentSheet.FlowController` refleja el método de pago seleccionado en ese momento. ```swift PaymentSheet.FlowController.PaymentOptionsButton( paymentSheetFlowController: paymentSheetFlowController, onSheetDismissed: { myPaymentMethodLabel = paymentSheetFlowController.paymentOption?.label ?? "Select a payment method" myPaymentMethodImage = paymentSheetFlowController.paymentOption?.image ?? UIImage(systemName: "square.and.pencil")! }, content: { /* An example button */ HStack { Text(myPaymentMethodLabel) Image(uiImage: myPaymentMethodImage) } } ) ``` 1. Usa [PaymentSheet.FlowController.PaymentOptionsButton](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller/paymentoptionsbutton) para ajustar el botón que confirma el pago. ```swift PaymentSheet.FlowController.ConfirmButton( paymentSheetFlowController: paymentSheetFlowController, onCompletion: { result in // MARK: Handle the payment result switch result { case .completed: print("Payment complete!") case .canceled: print("Canceled!") case .failed(let error): print(error) } }, content: { /* An example button */ Text("Pay") } ) ``` Establecer `allowsDelayedPaymentMethods` en true permite utilizar métodos de pago de [notificación diferida](https://docs.stripe.com/payments/payment-methods.md#payment-notification) como cuentas bancarias de EE. UU. Para estos métodos de pago, el estado final del pago no se conoce cuando se completa la `PaymentSheet`, sino que se efectúa correctamente o con errores más tarde. Si aceptas este tipo de métodos de pago, infórmale al cliente de que su pedido está confirmado y solo complétalo (por ejemplo, envía el producto) cuando el pago se haya realizado correctamente. ## Optional: Habilitar la recopilación de CVC en la confirmación Las siguientes instrucciones para volver a recolectar el CVC de una tarjeta guardada durante la confirmación del PaymentIntent suponen que tu integración incluye lo siguiente: - Crear PaymentIntents antes de recolectar los datos de pago ### Actualizar parámetros de la creación de la intención Para volver a recolectar el CVC al confirmar el pago, incluye `require_cvc_recollection` durante la creación del PaymentIntent. #### curl ```bash # Create a Customer (use an existing Customer ID if this is a returning customer) curl https://api.stripe.com/v1/customers \ -u <>: \ -X "POST" \ -H "Stripe-Account: {{CONNECTED_ACCOUNT_ID}}" # Create an Ephemeral Key for the Customer curl https://api.stripe.com/v1/ephemeral_keys \ -u <>: \ -H "Stripe-Version: 2026-09-30.endive" \ -H "Stripe-Account: 2026-09-30.endive" \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ # Create a PaymentIntent curl https://api.stripe.com/v1/payment_intents \ -u <>: \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "amount"=1099 \ -d "currency"="eur" \ -d "payment_method_options[card][require_cvc_recollection]"=true \ -d "automatic_payment_methods[enabled]"=true \ ```