Aceptar un pago
Crea un formulario de pago o usa una página del proceso de compra prediseñada para comenzar a aceptar pagos en línea.
Redirige a una página de pago alojada en Stripe utilizando Stripe Checkout. Consulta la comparación de esta integración con los otros tipos de integración de Stripe.
Esfuerzo de integración
Tipo de integración
Redirigir a la página de pagos alojada en Stripe
Personalización de la interfaz de usuario
Configurar StripeLado del servidor
Primero, regístrate para obtener una cuenta de Stripe.
Usa nuestras bibliotecas oficiales para acceder a la API de Stripe desde tu aplicación:
Redirige a tu cliente a Stripe CheckoutLado del clienteLado del servidor
Agrega un botón de pago en tu sitio web que llame a un punto de conexión del lado del servidor para crear una sesión de Checkout.
<html> <head> <title>Buy cool new product</title> </head> <body> <!-- Use action="/create-checkout-session.php" if your server is PHP based. --> <form action="/create-checkout-session" method="POST"> <button type="submit">Checkout</button> </form> </body> </html>
Una sesión de Checkout es la representación programática de lo que ve tu cliente cuando se le redirecciona al formulario de pago. Puedes configurarla con opciones como:
- Partidas para cobrar
- Divisas que se van a utilizar
También debes especificar success_url
, es decir, una página en tu sitio web a la que Checkout redirige al cliente después de que efectúa el pago. De forma opcional, puedes proporcionar cancel_url
, una página en tu sitio web para redirigir al cliente si cancela el proceso de pago.
Nota
Las sesiones de Checkout caducan a las 24 horas de crearse.
Después de crear una sesión de Checkout, redirige a tu cliente a la URL devuelta en la respuesta.
Nota
De forma predeterminada, Stripe habilita las tarjetas y otros métodos de pagos comunes que pueden ayudarte a captar más clientes. Puedes habilitar o deshabilitar los métodos de pago en el Dashboard de Stripe. Para determinar la lista de métodos de pago que se mostrará en Checkout, Stripe evalúa la divisa, las restricciones del método de pago y otros parámetros.
Prueba tu punto de conexión iniciando tu servidor web (por ejemplo, localhost:4242
) y ejecutando el siguiente comando:
curl -X POST -is "http://localhost:4242/create-checkout-session" -d ""
Deberías ver una respuesta en el terminal que sea similar a la que aparece a continuación:
HTTP/1.1 303 See Other Location: https://checkout.stripe.com/c/pay/cs_test_... ...
Pruebas
Ya deberías tener un botón de finalización de compra en funcionamiento que redireccione al cliente a Stripe Checkout.
- Haz clic en el botón de finalización de compra.
- Se te redireccionará al formulario de pago de Stripe Checkout.
Si tu integración no funciona:
- Abre la pestaña Red desde las herramientas de desarrollo del navegador.
- Haz clic en el botón de pago y confirma que se le haya enviado una solicitud XHR a tu punto de conexión de lado del servidor (
POST /create-checkout-session
). - Verifica que la petición devuelve un estado 200.
- Usa
console.log(session)
dentro del oyente de clic del botón para confirmar que se han devuelto los datos correctos.
Para ver cómo se muestran tus métodos de pago a los clientes, introudce un ID de transacción o establece el importe y la divisa de un pedido en el Dashboard.
Muestra una página de confirmaciónLado del clienteLado del servidor
Es importante que tu cliente vea una página de confirmación después de haber enviado correctamente el formulario de pago. Aloja esta página en tu sitio.
Crea una pequeña página de confirmación:
<html> <head><title>Thanks for your order!</title></head> <body> <h1>Thanks for your order!</h1> <p> We appreciate your business! If you have any questions, please email <a href="mailto:orders@example.com">orders@example.com</a>. </p> </body> </html>
A continuación, actualiza el punto de conexión de creación de la sesión de Checkout para usar esta nueva página:
Nota
Si quieres personalizar la página de confirmación, lee la guía de la página de confirmación personalizada.
Pruebas
- Haz clic en el botón de finalización de compra.
- Completa los datos del pago con la información de la tarjeta de prueba:
- Introduce
4242 4242 4242 4242
como número de tarjeta. - Introduce cualquier fecha futura como fecha de caducidad.
- Introduce cualquier número de 3 dígitos como CVC.
- Introduce cualquier código postal de facturación.
- Introduce
- Haz clic en Pagar.
- Se te redirigirá a tu nueva página de confirmación.
A continuación, busca el nuevo pago en el Dashboard de Stripe. Los pagos efectuados correctamente aparecen en la del Dashboard lista de pagos. Cuando haces clic en un pago, te redirige a la página de datos del pago. La sección Resumen de pagos contiene información de facturación y la lista de artículos comprados, que puedes usar para completar el pedido manualmente.
Prueba tu integración
Para probar la integración de tu formulario de pago alojado en Stripe:
- Crear una sesión de Checkout.
- Completa los datos del pago con un método de la siguiente tabla.
- Introduce cualquier fecha futura como fecha de caducidad.
- Introduce cualquier número de 3 dígitos como CVC.
- Introduce cualquier código postal de facturación.
- Haz clic en Pagar. Se te redirigirá a tu
success_url
. - Ve al Dashboard y busca el pago en la página de pagos. Si tu pago se ha completado con éxito, lo verás en esa lista.
- Haz clic en tu pago para ver más detalles, como un resumen de Checkout con la información de facturación y la lista de artículos comprados. Puedes usar esta información para completar el pedido.
Obtén más información sobre cómo probar tu integración.
Consulta Pruebas para obtener información adicional para probar tu integración.
Tarjetas de prueba
Número | Descripción |
---|---|
La transacción se efectúa correctamente y el pago se procesa de inmediato. | |
Para que el pago se realice correctamente, se requiere la autenticación mediante 3D Secure 2. | |
Siempre da error con el código de pago rechazado insufficient_funds . |
Apple Pay y Google Pay
Puedes habilitar Apple Pay y Google Pay en la configuración de los métodos de pago. Apple Pay está habilitado de forma predeterminada.
Las páginas alojadas en Stripe de Checkout no requieren cambios de integración para habilitar Apple Pay o Google Pay. Stripe gestiona estos pagos igual que otros pagos con tarjeta.
Ahora que ya tienes una integración básica en funcionamiento, aprende cómo obtener una notificación mediante programación cada vez que un cliente paga.