Resumen
Hosted Checkout 2.0: una página de pago alojada por Tonder a la que rediriges o que embebes, sin construir un formulario de tarjeta.
Hosted Checkout es una página de pago alojada por Tonder. Tu backend crea una sesión para una compra, envías al cliente a la URL de la sesión —o la embebes en tu página— y Tonder recopila los datos de pago, ejecuta 3D Secure y los reintentos, y te informa el resultado. Los datos de la tarjeta nunca tocan tus sistemas.
Pruébalo antes de escribir código. La demo interactiva te permite cambiar plantillas, colores, métodos de pago e idiomas, pagar con tarjetas de Sandbox y ver la petición exacta que enviaría tu integración.
Novedades de Hosted Checkout 2.0
| Hosted Checkout 2.0 | |
|---|---|
| Diseño | Un checkout nuevo con resumen del pedido, tres plantillas (ecommerce, deposit, subscription), fuentes, formas de las esquinas y contraste automático del botón. |
| Botón e idioma | Elige la llamada a la acción (pay, deposit, subscribe o tu propio texto) y el idioma en el que abre la página (es, en, zh). |
| Alojado o embebido | Redirige al cliente, o carga el checkout en un iframe y síguelo con eventos en tu página. |
| Métodos de pago | Tarjetas, tarjetas guardadas, Apple Pay, SPEI, OXXO Pay, Mercado Pago, SafetyPay y Neosurf. |
| Un solo id de pago | Cada sesión de pago devuelve su payment_id al crearse. Nunca cambia, ni siquiera cuando el cliente reintenta. |
| Procesamiento con API Direct | Los pagos se procesan con la misma API Direct que el SDK Web, así que recibes los webhooks estándar de Tonder. |
| Links de pago | Un link de pago creado en el Dashboard es una sesión de Hosted Checkout, y aparece junto a las que crea tu API. |
Los endpoints son los mismos de antes: POST /checkout/v1/sessions y sus complementos. Las
sesiones de pago nuevas usan el diseño 2.0, a menos que pidas otra cosa. Si tu integración es
anterior a 2.0, consulta Legacy (v1).
Beneficios
- Lanza con una sola llamada a la API: crea una sesión y redirige.
- Acepta tarjetas sin manejar datos de tarjeta en tus servidores —Tonder cubre PCI DSS.
- Adáptalo a tu marca con una plantilla, tu logo, colores, fuente y texto del botón.
- Ofrece en una sola página todos los métodos de pago que estén activos para tu negocio.
Dos tipos de sesión
session_type | Qué hace |
|---|---|
payment (por defecto) | Cobra al cliente. Se crea un pago junto con la sesión, así que obtienes su payment_id de inmediato. |
enrollment | Guarda la tarjeta del cliente sin cobrar. Consulta Guardar una tarjeta sin cobrar. |
Flujo de alto nivel
Tu servidor llama a POST /checkout/v1/sessions con el cliente, el monto y los artículos.
Tonder devuelve la url del checkout y el payment_id.
Redirige a la url, o embébela en un iframe.
Elige un método y paga en la página de Tonder. Si una tarjeta es rechazada, puede reintentar en
la misma sesión; el payment_id se mantiene igual.
Tonder redirige al cliente de vuelta a tu sitio. Confirma el pago desde tu servidor con webhooks o consultando la sesión.
Siguientes pasos
Demo interactiva
Configura el checkout en vivo y copia la petición.
Inicio rápido
Recibe tu primer pago en cuatro pasos.
Crear una sesión
Cada campo de la petición y de la respuesta.
Personalizar el checkout
Plantillas, colores, botón e idioma.
Embeber el checkout
Muéstralo dentro de tu página y escucha sus eventos.
Referencia API
Los endpoints, con la petición armándose en vivo.