Integración de páginas Hosted Checkout
Siga estos pasos y añada rápidamente Rapyd Hosted Checkout a su sitio web.
Inicie sesión en el Client Portal de Rapyd y comience a crear su propia experiencia de pago. Añada sus propios colores y logotipo y seleccione todos los métodos de pago que quiera aceptar.
Personalice su página de Checkout
Checkout le permite personalizar la apariencia para que coincida con su marca y su experiencia en el sitio web.
Una vez que haya creado una cuenta Rapyd, inicie sesión en el Client Portal tal y como se describe en Acceder al Client Portal y navegue hasta Ajustes > Marca.

Seleccione su página alojada para ver
La barra de vista previa, ubicada sobre la ventana de vista previa, mostrará una vista previa de la marca de su página de Hosted Checkout. Puede alternar entre la página de Hosted Checkout, la página de guardar los detalles de la tarjeta y la página de detalles de la cuenta del beneficiario. La configuración de marca afecta a todas las páginas alojadas, incluidas Rapyd Collect, Disburse e Issuing.
En el panel Elementos de marca del lado izquierdo de la página, toque el icono Suba el logotipo y suba un archivo de imagen (png, jpg, jpeg, gif) que contenga el logotipo de su empresa.
Toque el campo Color de marca para seleccionar el color de los botones de la pantalla.

En el campo URL alternativa, introduzca la URL de la página que aparece cuando se completa o cancela el proceso cuando
complete_checkout_urlocancel_checkout_urlno está especificado.
Completar y cancelar URLs
Otras páginas alojadas pueden tener campos diferentes, como
url completaycancel_urlPágina de tokenización de beneficiarios
Página alojada de Rapyd Verify
Página IDV alojada
Página alojada Objeto de token de tarjeta
Elimine cualquier método de pago que no vaya a aceptar (solo Hosted Checkout).
Banco: incluye redireccionamiento bancario y transferencia bancaria
Tarjeta
Efectivo
eWallet

Elija el texto del botón en el menú desplegable (solo en Hosted Checkout).

Detalles del servicio de atención al cliente - Puede añadir su información de contacto del servicio de atención al cliente (opcional) para que aparezca en sus páginas alojadas.

Toque el botón Guardar cambios en la esquina inferior derecha de la pantalla.

Obtenga una vista previa de su página alojada
En la página de personalización de marca, cambie entre el icono móvil o el icono de escritorio para ver la vista previa de la página alojada.

Para generar su página de Rapyd Checkout, use el método Crear una página de Checkout.
Antes de enviar su primera solicitud de API a la plataforma Rapyd, debe configurar sus Encabezados de autenticación incluyendo su Solicitar firmas, y a continuación, enviar una solicitud HTTPS POST a Rapyd, que generará la página de Checkout de Rapyd.
Nota: Ver Realice su primera llamada a la API para configurarlo si aún no lo ha hecho.
Una vez que haya completado la configuración de los encabezados y la firma, solicite el cuerpo del Checkout. Los siguientes tres parámetros obligatorios son necesarios para crear una página de Checkout:
Monto
País
Moneda
El siguiente ejemplo muestra una lista de parámetros obligatorios y opcionales que se utilizan en el cuerpo de una solicitud de creación de página de Checkout. La solicitud debe contener al menos los tres parámetros obligatorios mencionados anteriormente:
Descripción de los parámetros
Parámetro | Descripción |
|---|---|
Monto (obligatorio) | El monto del pago, en unidades de la moneda definida en moneda. Decimal. |
país (obligatorio) | El código ISO 3166-1 ALPHA-2 de dos letras para el país. En mayúscula. |
moneda (obligatorio) | Código ISO 4217 de tres letras para la moneda utilizada en el campo |
complete_checkout_url | URL a la que se redirige al cliente cuando el checkout se realiza correctamente. Esta página se puede configurar de forma dinámica para cada página de checkout generada, ya que anula la URL alternativa que se estableció en el Client Portal. |
cancel_checkout_url | URL a la que se redirige al cliente después de presionar Volver al sitio web para salir de la página alojada. Esta URL anula la URL de merchant_website No admite las URLs de localhost. |
tipo_de_método_de_pago_incluye | Lista de métodos de pago que se muestran en la página de checkout. |
id_de referencia_comerciante | Identificador de la transacción. Definido por el comerciante. Se puede usar para la reconciliación. |
moneda_solicitada | Determina la moneda que usará el cliente para pagar, cuando sea diferente de la moneda que el vendedor quiere recibir. Código ISO 4217 de tres letras. Cuando se establece este campo, la página de checkout muestra la siguiente información:
|
cantidad_descontada | La cantidad de moneda que se va a restar del pago. Decimal. Un parámetro del objeto |
porcentaje_descontado | Un descuento medido en porcentaje. Un parámetro del objeto |
campos de cliente requeridos (opcional) | Una serie de campos en el objeto
|
Flujo de pagos de terceros
Cuando el Tipo_flujo_pago de los métodos de pago que proporcione a sus clientes son una redirección de terceros, asegúrese de incluir las URL en los parámetros complete_payment_url y error_payment_url.
El cliente será redirigido a estas URL después de completar el pago.
Para determinar el tipo_flujo_pago, consulte List Payment Methods by Country.
Ejemplo de un cuerpo de solicitud
JSON
// Request URL: POST https://sandboxapi.rapyd.net/v1/checkout // Message body: { "amount": 100, "country": "SG", "currency": "SGD", "requested_currency": "USD", "complete_checkout_url": "https://example.com/complete", "cancel_checkout_url":"https://example.com/cancel" "merchant_reference_id": "950ae8c6-76", "payment_method_types_include": [ "sg_credit_mastercard_card", "sg_credit_visa_card" ] }
.Net
using System; using System.Text.Json; namespace RapydApiRequestSample { class Program { static void Main(string[] args) { try { string[] payment_method_types_include = new string[] { "sg_credit_mastercard_card", "sg_credit_visa_card" }; var requestObj = new { amount = 100, complete_checkout_url = "http://example.com/complete", country = "SG", currency = "SGD", requested_currency = “USD”, merchant_reference_id = "950ae8c6-76", payment_method_types_include }; string request = JsonSerializer.Serialize(requestObj); string result = RapydApiRequestSample.Utilities.MakeRequest("POST", "/v1/checkout", request); Console.WriteLine(result); } catch (Exception e) { Console.WriteLine("Error completing request: " + e.Message); } } } }
JavaScript
const makeRequest = require('<path-to-your-utility-file>/utilities').makeRequest; async function main() { try { const body = { amount: 100, complete_checkout_url: 'http://example.com/complete', country: ‘SG’, currency: 'SGD', requested_currency: ‘USD’, merchant_reference_id: '950ae8c6-76', payment_method_types_include: [‘sg_credit_mastercard_card’, ‘sg_credit_visa_card’] }; const result = await makeRequest('POST', '/v1/checkout', body); console.log(result); } catch (error) { console.error('Error completing request', error); } }
PHP
<?php $path = $_SERVER['DOCUMENT_ROOT']; $path .= "/<path-to-your-utility-file>/utilities.php"; include($path); $body = [ "amount" => 100, "complete_checkout_url" => "http://example.com/complete", "country" => "SG", "currency" => "SGD", “requested_currency” => “USD”, "merchant_reference_id" => "950ae8c6-76", "payment_method_types_include" => [ "sg_credit_mastercard_card", "sg_credit_visa_card" ] ]; try { $object = make_request('post', '/v1/checkout', $body); var_dump($object); } catch (Exception $e) { echo "Error: $e"; } ?>
Python
from pprint import pprint from utilities import make_request checkout_page = { "amount": 100, "complete_checkout_url": "http://example.com/complete", "country": "SG", "currency": "SGD", "merchant_reference_id": "950ae8c6-76", "payment_method_types_include": [ "sg_credit_mastercard_card", "sg_credit_visa_card" ] } results = make_request(method="post", path="/v1/checkout", body=checkout_page) pprint(results)
Puede incluir el identificador de cliente empezando por cus_ y save_card_default para incluir la casilla rellenada «guardar tarjeta», tal y como se describe en Crear página de checkout.
Rellene previamente los campos de Checkout
Puede rellenar previamente o eximir determinados campos de Checkout incluyéndolos en el objeto merchant_fields en su solicitud de API. Los campos no aparecerán en la página alojada.
La siguiente lista de ejemplos muestra el cuerpo de la respuesta, que contiene los siguientes campos, tal y como se describe en Crear página de Checkout:
Descripción de los campos
Campos | Descripción |
|---|---|
identificación | ID de la página de Rapyd Checkout. |
Monto | El monto del pago, en unidades de la moneda definida en moneda. |
país | El código ISO 3166-1 ALPHA-2 de dos letras para el país. |
moneda | Código ISO 4217 de tres letras para la moneda utilizada en el campo de monto. |
cliente | ID del objeto «cliente». Cadena de texto que comienza con cus_. Relevante cuando el cliente ya está registrado y almacenado en la plataforma Rapyd. |
sitioweb_comerciante | URL del sitio web del comerciante, proporcionada por el comerciante. Relevante cuando |
logo_comerciante | URL del logotipo del comerciante, proporcionada por el comerciante. |
url_redireccion | URL de la redirección de la página de Rapyd Checkout, proporcionada por Rapyd. |
La respuesta también muestra todo el objeto de pago, que se ha editado, excepto el complete_payment_url y el error_payment_url.
Ejemplo de un cuerpo de respuesta
JSON
{ "status": { "error_code": "", "status": "SUCCESS", "message": "", "response_code": "", "operation_id": "c343cac1-d682-4983-a386-345aa75d9aaf" }, "data": { "id": "checkout_e6a30340c23be7201346eade2bfe3417", "country": "SG", "currency": "SGD", "amount": 100, "status": "NEW", "payment": { "id": "", "amount": 100, "original_amount": 0, "is_partial": false, "currency_code": "SGD", "country_code": "SG", // ... "merchant_reference_id": "950ae8c6-76", // ... "merchant_requested_currency": "USD", // ... }, "payment_method_type": "", "payment_method_type_categories": null, "payment_method_types_include": [ "sg_credit_mastercard_card", "sg_credit_visa_card" ], // ... "payment_method_types_exclude": null, "customer": "", "customer_default_payment_method": {}, "country_name": "Singapore", "merchant_color": "5387e6", "merchant_website": "https://www.rapyd.net/", "merchant_logo": "https://sboxiconslib.rapyd.net/merchant-logos/ohpc_04e7f6ae2362818fb6eb723b821824ad.jpg", "merchant_customer_support": {}, // ... "language": "en", "complete_checkout_url": "http://example.com/complete", "cancel_checkout_url": "", "redirect_url": "https://sandboxcheckout.rapyd.net?token=checkout_e6a30340c23be7201346eade2bfe3417", "timestamp": 1592143929, "expiration": 1593353529 } }
Redirija a su cliente a la URL que recibió en la respuesta a Crear página de Checkout. La URL de redireccionamiento aparece en el campo redirect_url e incluye todos los parámetros de la sesión de Checkout.
Nota: La página de Checkout caduca 14 días después de la creación de forma predeterminada.
Como alternativa, puede especificar un parámetro page_expiration en la solicitud Crear página de Checkout y elija un valor diferente para el vencimiento de la página de Checkout, en Hora de Unix.
El siguiente diagrama de estados finitos resume los estados de la página Hosted Checkout.
Descripción de los estados
Estado | Descripción |
|---|---|
NUEVO | Se generó la página Hosted Checkout. |
INP | El cliente ha introducido la información de pago. El pago está en curso. |
DON | Se completó el pago. |
EXP | La página de Checkout ha caducado. |
DEC | Se ha rechazado el pago. |