{"section":"tutorials","requestedLocale":"es","requestedSlug":"configurar-pago-con-stripev2","locale":"es","slug":"configurar-pago-con-stripev2","path":"docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-stripev2.md","branch":"main","content":"En VTEX puedes realizar la integración con el proveedor de pago StripeV2. A través de este proveedor, tu tienda puede ofrecer diversos medios de pago, como Visa, American Express, Diners, Elo, Hipercard, Mastercard, BankInvoice, Stripe, Google Pay, ApplePay, OXXO, Discover, Affirm, Klarna, ZIP, Blik, Ideal, SPEI, MultiBanco, Afterpay, Bancontact, EPS, FPX, giropay y P24.\n\nPara más información sobre la integración de VTEX con Stripe, también puede acceder a la [documentación de Vinneren](https://sites.google.com/vinneren.com.mx/documentacion-publica/documentacion-publica).\n\n## Opciones de operación\n\nEl proveedor StripeV2 puede procesar transacciones de pago en tiendas VTEX de dos maneras diferentes:\n\n- __VTEX Native Checkout Experience__: puede usarse para tarjetas de crédito, tarjetas de débito y medios de pago desarrollados con [Payment Provider Framework (PPF)](https://developers.vtex.com/docs/guides/payments-integration-payment-provider-framework). Esta opción es recomendable si deseas configurar otros gateways de pago para diferentes redes de tarjeta o realizar transacciones utilizando el checkout nativo de VTEX.\n\n- __VTEX with Stripe Payment Element Experience__: aplicación de pago basada en el [Stripe’s Optimized Checkout Suite (OCS)](https://support.stripe.com/questions/what-is-stripe-s-optimized-checkout-suite-(ocs)?locale=en-US). Esta opción se recomienda si deseas utilizar Stripe exclusivamente para procesar todas las redes de tarjetas o para acceder a [Stripe Link](https://stripe.com/payments/link), una solución que ofrece acceso rápido a varios medios de pago con un solo clic.\n\n> ℹ️ **VTEX with Stripe Payment Element Experience** utiliza el [Stripe Payment Elements Checkout](https://docs.stripe.com/payments/elements), proporcionando acceso a los medios de pago actuales y futuros admitidos por Stripe. En esta opción, la configuración de los medios de pago se debe realizar directamente en [Stripe Dashboard](https://dashboard.stripe.com/settings/payment_methods).\n\n> ℹ️ Para información sobre la lista completa de medios de pago procesados por cada una de las opciones de operación de StripeV2, ponte en contacto con los equipos de soporte de [Vinneren](stripe-support@vinneren.com.mx) o [Stripe](https://support.stripe.com/contact/login).\n\nDespués de determinar la opción con la que deseas operar en tu tienda, sigue las instrucciones del procedimiento correspondiente a continuación:\n\n- [Configurar VTEX Native Checkout Experience](#configurar-vtex-native-checkout-experience)\n- [Configurar VTEX con Stripe Payment Element Experience](#configurar-vtex-con-stripe-payment-element-experience) \n\n> ⚠️ La configuración realizada en un entorno externo a VTEX puede descontinuarse o modificarse sin previo aviso. Consulta tu cuenta en Stripe para información actualizada.\n\n## Configurar VTEX Native Checkout Experience\n\n> ⚠️ El equipo de Stripe debe habilitar los pagos de RawPan en su cuenta. Comuníquese con su [Stripe advisor](https://support.stripe.com/?locale=es-419). Si esta opción no está habilitada en su cuenta, no podrá realizar transacciones exitosas.\n\nRequisitos previos:\n- Usuario VTEX con permisos de administrador\n- Cuenta activa de Stripe\n\nPara utilizar __VTEX Native Checkout Experience__ en tu tienda, es necesario:\n\n- [Instalar las aplicaciones de Stripe](#instalar-las-aplicaciones-de-stripe)\n- [Configurar StripeV2 en VTEX](#configurar-stripev2-en-vtex)\n- [Configurar condición de pago](#configurar-condicion-de-pago)\n\n### Instalar las aplicaciones de Stripe\n\nPara instalar las aplicaciones de Stripe en tu tienda, sigue los pasos a continuación:\n\n1. Instale el [VTEX Native Checkout (aplicación Stripe)](https://marketplace.stripe.com/apps/vtex-native-checkout).Durante la configuración, asegúrese de ingresar el nombre de su cuenta VTEX usando solo letras minúsculas. Por ejemplo, si el nombre de su cuenta es \"MyStore\", ingréselo como \"mystore\".\n2. Acceda al [Stripe Dashboard](https://dashboard.stripe.com/login?redirect=%2Fapikeys), copie y guarde las claves publicable y secreta. Es importante que copie y guarde las claves del modo (prueba o en vivo) en el que instaló la aplicación VTEX Native Checkout App en Stripe.\n\n> ⚠️ Antes de iniciar la instalación de la aplicación Payment Provider Framework, verifica con el equipo de soporte de [Vinneren](stripe-support@vinneren.com.mx) o [Stripe](https://support.stripe.com/contact/login) las versiones más actuales de la aplicación.\n\n3. En [VTEX IO CLI](https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install), ejecuta los comandos a continuación para instalar las aplicaciones de Stripe:\n\n- **Payment Provider Framework**: `vtex install stripe.stripe-payments-provider`.\n- **Payment App**: `vtex install stripe.stripe-payment-app`.\n\n### Configurar StripeV2 en VTEX\n\nPara configurar la integración de StripeV2 en VTEX sigue los pasos a continuación:\n\n1. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Proveedores__, o ingresa __Proveedores__ en la barra de búsqueda en la parte superior de la página.\n2. En la pantalla de proveedores, haz clic en el botón `Nuevo proveedor`.\n3. Ingresa __StripeV2__ en la barra de búsqueda y haz clic en el nombre del proveedor.\n4. En __Clave de aplicación__, ingrese la clave publicable que obtuvo en los pasos anteriores.\n5. En __Token de aplicación__, ingrese la clave secreta que obtuvo en los pasos anteriores.\n6. En __Información general__, en la opción __Nombre__, ingrese __StripeV2NativeCheckout__ para identificar el tipo de integración.  \n7. En __Campos del proveedor__, en la opción __Mode__, selecciona __Float__.\n8. En __Test Mode__, seleccione __Falso__ si el modo es __Live__ o __True__ si el modo es __Test__.\n9. Haz clic en `Guardar`.\n\n### Configurar script antifraude\n\nPara configurar el script antifraude para StripeV2 en VTEX, siga los pasos a continuación:\n\n1. Copia el script disponible en la sección \"[Integrate script into your VTEX store](https://sites.google.com/vinneren.com.mx/documentacion-publica/native-checkout/english)\".\n2. En el Admin de VTEX, acceda a __Configuración de la tienda > Storefront > Checkout > Código__.\n3. Haga clic en el botón __Nuevo__ e ingrese un nombre descriptivo.\n4. Pegue el contenido del script que copió anteriormente.\n5. Reemplace la información \"pk_test\" con su clave pública de Stripe copiada en los pasos anteriores.\n6. Haga clic en `Guardar`.\n\n### Configurar condición de pago\n\nPara configurar una condición de pago para StripeV2 en VTEX sigue los pasos a continuación:\n\n1. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Configuración__, o ingresa __Configuración__ en la barra de búsqueda en la parte superior de la página.\n2. En la pestaña __Condiciones de pago__, haz clic en el botón `+`.\n3. Haz clic sobre el nuevo medio de pago que desees utilizar.\n4. En la pantalla de configuración, activa la condición haciendo clic en __Status__.\n5. En __Procesar con el proveedor__, selecciona la opción __StripeV2NativeCheckout__.\n6. Si deseas utilizar un sistema antifraude, selecciona la opción __Utilizar antifraude__.\n7. Si lo deseas, también puedes [configurar condiciones de pago especiales](/es/docs/tutorials/condiciones-especiales).\n8. Haz clic en `Guardar`.\n\nPara más información sobre los procedimientos de instalación de __VTEX Native Checkout Experience__, accede a la [documentación pública de Stripe en Vinneren](https://sites.google.com/vinneren.com.mx/documentacion-publica#h.nmryiar6zrqq).\n\n## Configurar VTEX con Stripe Payment Element Experience\n\nRequisitos previos:\n- Usuario VTEX con permisos de administrador\n- Cuenta activa de Stripe  \n\nPara utilizar o __VTEX with Stripe Payment Element Experience__ em sua loja, é necessário:\n\n- [Instalar las aplicaciones de Stripe](#instalar-las-aplicaciones-de-stripe-element-experience)\n- [Configurar StripeV2 en VTEX](#configurar-stripev2-en-vtex-element-experience)\n- [Configurar condiciones de pago](#configurar-condicion-de-pago-element-experience)\n- [Configurar un webhook en la cuenta Stripe](#configurar-un-webhook-en-la-cuenta-stripe-element-experience)\n\n### Instalar las aplicaciones de Stripe (Element Experience)\n\nPara instalar las aplicaciones de Stripe en tu tienda sigue los pasos a continuación:\n\n1. Instale el [VTEX Elements Checkout (Stripe App)](https://marketplace.stripe.com/apps/vtex-with-stripe-payment-element) para obtener las claves de Stripe necesarias.\n2. Una vez que se complete la instalación, se mostrarán las claves pública (pk) y restringida (rk). Cópielos y guárdelos, ya que los utilizará más adelante.\n\n> ⚠️ Antes de iniciar la instalación de la aplicación Payment Provider Framework, verifica con el equipo de soporte de [Vinneren](stripe-support@vinneren.com.mx) o [Stripe](https://support.stripe.com/contact/login) las versiones más actuales de la aplicación.\n\n3. En [VTEX IO CLI](https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install), ejecuta los comandos a continuación para instalar las aplicaciones de Stripe:\n\n- **Payment Provider Framework**: `vtex install stripe.stripe-payments-provider`.\n- **Payment App**: `vtex install stripe.stripe-payment-app`.\n\n### Configurar StripeV2 en VTEX (Element Experience)\n\nPara configurar la integración de StripeV2 en VTEX sigue los pasos a continuación:\n\n1. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Proveedores__, o ingresa __Proveedores__ en la barra de búsqueda en la parte superior de la página.\n2. En la pantalla de proveedores, haz clic en el botón `Nuevo proveedor`.\n3. Ingresa __StripeV2__ en la barra de búsqueda y haz clic sobre el nombre del proveedor.\n4. En __Clave de aplicación__, ingresa la clave publicable que obtuviste en el __VTEX Elements Checkout (Stripe App)__.\n5. En __Token de aplicación__, ingresa la clave secreta que obtuviste en el __VTEX Elements Checkout (Stripe App)__ (restricted API key).\n6. En __Información general__, en la opción __Nombre__, ingrese __StripeV2Elements__ para identificar el tipo de integración.  \n7. En __Campos del proveedor__, en la opción __Mode__, selecciona __Embedded__.\n8. En __Test Mode__, seleccione __Falso__ si el modo es __Live__ o __True__ si el modo es __Test__.\n9. Haz clic en `Guardar`.\n10. Agregue claves Stripe en la configuración de la aplicación del proveedor, de la siguiente manera:\na. Vaya a **Applications > My applications > Stripe Payment Provider**.\nb. Haga clic en **Settings**.\nc. En **Clave publicable**, ingrese su clave comenzando con **pk_**.\nd. En **Clave secreta**, ingrese su clave comenzando con **rk_**.\ne. Haga clic en **Guardar**.\n\n### Configurar condición de pago (Element Experience)\n\nPara configurar una condición de pago para StripeV2 en VTEX sigue los pasos a continuación:\n\n1. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Configuración__, o ingresa __Configuración__ en la barra de búsqueda en la parte superior de la página.\n2. En la pestaña __Condiciones de pago__, haz clic en el botón `+`.\n3. Haz clic sobre el nuevo medio de pago que desees utilizar.\n4. En la pantalla de configuración, activa la condición haciendo clic en __Status__.\n5. En __Procesar con proveedor__, selecciona la opción __StripeV2Elements__.\n6. Si deseas utilizar un sistema antifraude, selecciona la opción __Utilizar antifraude__.\n7. Si lo deseas, también puedes [configurar condiciones de pago especiales](/es/docs/tutorials/condiciones-especiales).\n8. Haz clic en `Guardar`.\n\nPara más información sobre los procedimientos de instalación de __VTEX with Stripe Payment Element Experience__, accede a la [documentación pública de Stripe en Vinneren](https://sites.google.com/vinneren.com.mx/documentacion-publica#h.nmryiar6zrqq).\n\n### Configurar un webhook en la cuenta Stripe (Element Experience)\n\nPara realizar la configuración del webhook en tu cuenta Stripe, sigue los pasos a continuación:\n\n1. Accede al [dashboard de tu cuenta Stripe](https://dashboard.stripe.com/).\n2. Haz clic en el botón __Developers__.\n3. Haz clic en la pestaña __Webhooks__.\n4. Haz clic en el botón __Add a connection point__.\n5. En el campo __Connection point URL__, ingresa la URL del endpoint de tu tienda VTEX en el siguiente formato: `https://{{account}}.myvtex.com/_v/stripe.payment-provider-connector/v0/webhook`. Sustituye \\{account\\} por el nombre de tu cuenta VTEX.\n6. Haz clic en __+ Select events__.\n7. Haz clic en las categorías y selecciona los siguientes eventos:\n- **payment_intent.payment_failed**\n- **payment_method.canceled**\n- **payment_intent.succeeded**\n- **payment_method.attached**\n\n8. Haz clic en __Add events__.\n9. Haz clic en __Add Connection Point__.\n\n## Configurar pago con Google Pay en StripeV2 (opcional)\n\nCon el proveedor StripeV2 puedes procesar pagos con Google Pay en tu tienda. Para configurar Google Pay sigue los pasos a continuación:\n\n1. Si ya completó los pasos de instalación de [VTEX Elements](#configurar-vtex-con-stripe-payment-element-experience), continúe con el Paso 13.\n2. Instale el [VTEX Elements Checkout (Stripe App)](https://marketplace.stripe.com/apps/vtex-with-stripe-payment-element) para obtener las claves de Stripe necesarias.\n3. Una vez que se complete la instalación, se mostrarán las claves pública (pk) y restringida (rk). Cópielos y guárdelos, ya que los utilizará más adelante.\n4. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Proveedores__, o ingresa __Proveedores__ en la barra de búsqueda en la parte superior de la página.\n5. En la pantalla de proveedores, haz clic en el botón `Nuevo proveedor`.\n6. Ingresa __StripeV2__ en la barra de búsqueda y haz clic sobre el nombre del proveedor.\n7. En __Clave de aplicación__, ingresa la clave publicable que obtuviste en el __VTEX Elements Checkout (Stripe App)__.\n8. En __Token de aplicación__, ingresa la clave secreta que obtuviste en el __VTEX Elements Checkout (Stripe App)__ (restricted API key).\n9. En __Información general__, en la opción __Nombre__, ingrese __StripeV2Elements__ para identificar el tipo de integración.  \n10. En __Campos del proveedor__, en la opción __Mode__, selecciona __Embedded__.\n11. En __Test Mode__, seleccione __Falso__ si el modo es __Live__ o __True__ si el modo es __Test__.\n12. Haz clic en `Guardar`.\n13. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Configuración__, o ingresa __Configuración__ en la barra de búsqueda en la parte superior de la página.\n14. En la pestaña __Condiciones de pago__, haz clic en el botón `+`.\n15. Haz clic en la opción __Google Pay__.\n16. En la pantalla de configuración, activa la condición haciendo clic en __Status__.\n17. En __Procesar con proveedor__, selecciona la opción __StripeV2Elements__.\n18. Haz clic en `Guardar`.\n\nCuando hayas realizado estos pasos, Google Pay figurará en el checkout de la tienda como uno de los medios de pago disponibles.\n\n## Configurar pago con Apple Pay en StripeV2 (opcional)\n\nCon el proveedor StripeV2 puedes procesar pagos con Apple Pay en tu tienda. Para configurar Apple Pay sigue los pasos a continuación:\n\n1. Si ya completó los pasos de instalación de [VTEX Elements](#configurar-vtex-con-stripe-payment-element-experience), continúe con el Paso 13.\n2. Instale el [VTEX Elements Checkout (Stripe App)](https://marketplace.stripe.com/apps/vtex-with-stripe-payment-element) para obtener las claves de Stripe necesarias.\n3. Una vez que se complete la instalación, se mostrarán las claves pública (pk) y restringida (rk). Cópielos y guárdelos, ya que los utilizará más adelante.\n4. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Proveedores__, o ingresa __Proveedores__ en la barra de búsqueda en la parte superior de la página.\n5. En la pantalla de proveedores, haz clic en el botón `Nuevo proveedor`.\n6. Ingresa __StripeV2__ en la barra de búsqueda y haz clic sobre el nombre del proveedor.\n7. En __Clave de aplicación__, ingresa la clave publicable que obtuviste en el __VTEX Elements Checkout (Stripe App)__.\n8. En __Token de aplicación__, ingresa la clave secreta que obtuviste en el __VTEX Elements Checkout (Stripe App)__ (restricted API key).\n9. En __Información general__, en la opción __Nombre__, ingrese __StripeV2Elements__ para identificar el tipo de integración.\n10. En __Campos del proveedor__, en la opción __Mode__, selecciona __Embedded__.\n11. En __Test Mode__, seleccione __Falso__ si el modo es __Live__ o __True__ si el modo es __Test__.\n12. Haz clic en `Guardar`.\n13. Accede al [dashboard de sua conta na Stripe](https://dashboard.stripe.com/) en la sección de configuración de pagos.\n14. En __Settings__, haz clic en __Payment Methods__.\n15. Haz clic en __Apple Pay > Set Up__.\n16. Haz clic en __Add to New Domain__.\n17. Ingresa el dominio público del sitio web de tu tienda.\n18. Haz clic en __Add__.\n19. Ejecuta las acciones descritas en la [documentación de Stripe](https://docs.stripe.com/payments/payment-methods/pmd-registration?dashboard-or-api=dashboard#verify-domain-with-apple) y luego haz clic en __Download the domain association file__.\n20. Tras obtener el archivo, guarda la información y accede a la siguiente URL `https://{{account}}.myvtex.com/_v/stripe.paid-provider/v0/registerApplePay`. Sustituye \\{\\{account\\}\\} por el nombre de tu cuenta VTEX.\n21. Ingresa la información previamente guardada en el campo __Enter your Apple App Key__.\n22. Haz clic en `Guardar`.\n23. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Configuración__, o ingresa __Configuración__ en la barra de búsqueda en la parte superior de la página.\n24. En la pestaña __Condiciones de pago__, haz clic en el botón `+`.\n25. Haz clic en __Apple Pay__.\n26. En la pantalla de configuración, activa la condición haciendo clic en __Status__.\n27. En __Procesar con proveedor__, selecciona la opción __StripeV2__.\n28. Si deseas utilizar un sistema antifraude, selecciona la opción __Utilizar antifraude__.\n29. Indique si desea procesar pagos con o sin cuotas.\n30. Si lo deseas, también puedes [configurar condiciones de pago especiales](/es/docs/tutorials/condiciones-especiales).\n31. Haz clic en `Guardar`.\n\nCuando hayas realizado estos pasos, Apple Pay figurará en el checkout de la tienda como uno de los medios de pago disponibles.\n\n## Configurar condición de pago en meses sin intereses (MSI) (opcional)\n\n> ⚠️ La condición de pago en cuotas sin intereses (**MSI - Meses Sin Intereses**) está disponible en Stripe únicamente para cuentas en México.\n\n__MSI__ se puede configurar tanto la opción de operación __VTEX Native Checkout experience__ como para __VTEX with Stripe Payment Element Experience__. A continuación se indican los pasos para configurarla en función de la opción de operación adoptada en tu tienda:\n\n### Configurar MSI en la opción VTEX Native Checkout experience\n\n1. Crea una cuenta [Stripe](https://stripe.com/) en México configurada con la moneda MXN.\n2. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Configuración__, o ingresa __Configuración__ en la barra de búsqueda en la parte superior de la página.\n3. Haz clic en uno de los medios de pago disponibles que procesan pagos con __MSI__ (tarjetas VISA, AMEX y Mastercard).\n4. [Configura las condiciones MSI](/es/docs/tutorials/condiciones-de-pago#en-cuotas-sin-interes) de la forma deseada en la pantalla del medio de pago.\n5. [Configura las condiciones MSI](https://support.stripe.com/questions/c%C3%B3mo-configurar-meses-sin-intereses-%28msi%29-en-tu-cuenta-stripe?locale=es-419) en tu dashboard de Stripe con la misma información utilizada en la configuración de VTEX (paso 4).\n\n> ⚠️ Si la información registrada en los pasos 4 y 5 es diferente, la condición de MSI podría no funcionar correctamente.\n\n### Configurar MSI en la opción VTEX with Stripe Payment Element Experience\n\n1. Crea una cuenta [Stripe](https://stripe.com/) en México configurada con la moneda MXN.\n2. [Configura las condiciones de MSI](https://support.stripe.com/questions/c%C3%B3mo-configurar-meses-sin-intereses-%28msi%29-en-tu-cuenta-stripe?locale=es-419) en tu dashboard de Stripe.\n3. Ponte en contacto con tu representante de Stripe o con el equipo de [Ayuda y soporte de Stripe](https://stripe.com/mx/contact) para solicitar que esta condición de pago se active en tu tienda."}