Descripción general del SDK JS de Therius: integración de pagos en el navegador

El SDK JS de Therius es el complemento del lado del navegador para la API de pagos de Therius. Renderiza los campos de tarjeta dentro de iframes alojados por Therius, así que un PAN sin procesar nunca transita por tu servidor — solo recibes un nonce de un solo uso o un PaymentResult final. Tu página de checkout controla el diseño y el estilo; Therius controla lo que pasa dentro de cada campo.

Cuándo usar el SDK

Campos alojados

Usa campos alojados o el Widget de checkout al aceptar tarjetas directamente desde un navegador. Tu DOM nunca contiene un número de tarjeta sin procesar.

Botones de wallet

Usa botones de wallet para Apple Pay y Google Pay. La hoja de pago nativa maneja la autenticación; Therius descifra el resultado del lado del servidor.

Click to Pay

Usa Click to Pay para las tarjetas guardadas a nivel de red de Visa y Mastercard. Los titulares de tarjeta se autentican sin volver a ingresar los datos.

Redirects de APM

Usa sdk.purchaseApm para métodos de pago alternativos basados en redirect como iDEAL, Klarna y Pix.

Para integraciones de servidor a servidor — servicios de backend o apps nativas móviles — usa la API REST directamente. El SDK JS es solo para navegador.

Instalación

npm install @therius/sdk

yarn add @therius/sdk

O carga el SDK vía CDN sin ningún paso de build:

<script src="https://sdk.therius.io/v1/therius.js"></script>

Inicialización

Importa e inicializa el SDK con un clientToken obtenido de tu servidor. Tu clave de API privada nunca sale del backend.

import { TheriusSDK } from '@therius/sdk'

// clientToken viene de POST /sdk/session en tu servidor
const sdk = new TheriusSDK({ clientToken })

TheriusSDK lanza una excepción de inmediato si falta clientToken — no hay un estado silencioso a medio inicializar. Pasa siempre un token válido antes de llamar a cualquier método del SDK.

Flujo de integración

El servidor crea la sesión del SDK

Tu servidor llama a POST /sdk/session con tu clave de API privada y recibe un clientToken de corta duración.

El navegador recibe el clientToken

Pasa el token al navegador — por ejemplo, como JSON inline en tu plantilla HTML o como respuesta JSON a una solicitud AJAX.

El SDK se inicializa

El navegador construye new TheriusSDK({ clientToken }). El SDK ya está listo para renderizar campos y procesar pagos.

El SDK renderiza los campos de tarjeta en iframes alojados

Cada campo de tarjeta (número, vencimiento, CVV) se renderiza dentro de un iframe alojado por Therius. Tu JavaScript y tu DOM nunca ven el PAN.

El usuario completa la tarjeta — el SDK crea un nonce de un solo uso

Cuando el comprador envía el formulario, llama a sdk.createNonce(). El SDK devuelve un nonce de corta duración que representa los datos de tarjeta.

El nonce se envía a tu servidor — el servidor cobra vía API

Tu página hace un post del nonce a tu backend. Tu servidor luego llama a POST /payment/purchase con el nonce para completar el cobro.

Próximos pasos

Bootstrap de sesión

Aprende cómo intercambiar tu clave de API privada por un client token en tu servidor.

Campos alojados

Construye un formulario de tarjeta totalmente personalizado manteniendo los números de tarjeta sin procesar fuera de tu DOM.

Widget de checkout

Inserta un formulario de pago listo para usar con soporte de tarjetas guardadas en dos líneas de código.

Botones de wallet

Agrega Apple Pay y Google Pay a tu checkout con createWalletButton.