Integración de páginas de pago alojadas
Sigue estos pasos y añade rápidamente Rapyd Hosted Checkout a tu sitio web.
Inicia sesión en el portal de clientes de Rapyd y comienza a crear tu propia experiencia de pago. Añade tus propios colores y logotipo y selecciona todos los métodos de pago que quieras aceptar
Personaliza tu página de pago
Checkout te permite personalizar la apariencia para que coincida con tu marca y tu experiencia en el sitio web.
Una vez que haya creado una cuenta Rapyd, inicie sesión en el Portal del cliente tal y como se describe en Acceder al portal del cliente y navegue hasta Ajustes > Marca.

Selecciona tu página alojada para verla
La barra de vista previa, ubicada sobre la ventana de vista previa, mostrará una vista previa de la marca de tu página de Hosted Checkout. Puedes alternar entre la página de pago hospedado, 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
En el Elementos de marca en el panel del lado izquierdo de la página, toca el Sube el logotipo icono y sube un archivo de imagen (png, jpg, jpeg, gif) que contenga el logotipo de tu empresa.
Pulsa el Color de marca campo para seleccionar el color de los botones de la pantalla.

En el campo URL alternativa, introduce la URL de la página que aparece cuando se completa el proceso o que se cancela cuando
complete_checkout_urlocancel_checkout_urlno está especificado.
Completar y cancelar direcciones URL
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
Objeto de token de tarjeta de página alojada
Elimina cualquier método de pago que no vayas a aceptar (solo pago organizado).
Banco: incluye redireccionamiento bancario y transferencia bancaria
Tarjeta
Efectivo
Billetera electrónica

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

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

Pulsa el Guardar cambios botón 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, cambia entre el icono móvil o el icono de escritorio para ver la vista previa de la página alojada.

Para generar tu página de Rapyd Checkout, usa Crea una página de pago método.
Antes de enviar tu primera solicitud de API a la plataforma Rapyd, debes configurar tu Encabezados de autenticación incluyendo su Solicita firmasy, a continuación, envía una solicitud HTTPS POST a Rapyd, que generará la página de pago de Rapyd.
Nota: Ver Realice su primera llamada a la API para configurarlo si aún no lo ha hecho.
Una vez que hayas completado la configuración de los encabezados y la firma, solicita el cuerpo del proceso de pago. Los siguientes tres parámetros obligatorios son necesarios para crear una página de pago
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 pago. La solicitud debe contener al menos los tres parámetros obligatorios mencionados anteriormente:
Descripción de los parámetros
Parámetro | Descripción |
|---|---|
importe (obligatorio) | El importe 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 |
url de pago completa | URL a la que se redirige al cliente cuando el pago se realiza correctamente. Esta página se puede configurar de forma dinámica para cada página de pago generada, ya que anula la URL alternativa que se estableció en el portal del cliente |
cancelar_checkout_url | URL a la que se redirige al cliente después de pulsar Volver al sitio web para salir de la página alojada. Esta URL anula la URL de merchant_website No admite las URL de localhost. |
tipo_de_método_de_pago include | Lista de métodos de pago que se muestran en la página de pago. |
id_de referencia_comerciante | Identificador de la transacción. Definido por el comerciante. Se puede usar para la reconciliación. |
divisa_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 pago muestra la siguiente información:
|
cantidad_descontada | La cantidad de moneda que se va a restar del pago. Decimal. Un parámetro del |
porcentaje de descuento | Un descuento medido en porcentaje. Un parámetro del |
campos de cliente requeridos (opcional) | Una serie de campos en el
|
Flujo de pagos de terceros
Cuando el payment_flow_type si los métodos de pago que proporcionas a tus clientes son una redirección de terceros, asegúrate de incluir las URL en el URL de pago completa y error_payment_url parámetros.
El cliente será redirigido a estas URL después de completar el pago.
Para determinar el payment_flow_type, 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"; } ?>
Pitón
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)
Puedes incluir el identificador de cliente empezando por cus_ y save_card_default para incluir la casilla «guardar tarjeta» rellena, tal y como se describe en Crear página de pago.
Rellene previamente los campos de pago
Puedes rellenar previamente o eximir determinados campos de pago incluyéndolos en el merchant_fields objeto en tu 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 pago:
Descripción de los campos
Campos | Descripción |
|---|---|
identificación | ID de la página de Rapyd Checkout. |
cantidad | El importe del pago, en unidades de la divisa definida en la divisa. |
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 divisa utilizada en el campo de importe. |
cliente | ID del objeto «cliente». Cadena que comienza con cus_. Relevante cuando el cliente ya está registrado y almacenado en la plataforma Rapyd |
sitio web del comerciante | URL del sitio web del comerciante, proporcionada por el comerciante. Relevante cuando |
logo_de_comerciante | URL del logotipo del vendedor, proporcionada por el vendedor. |
redireccionar_url | 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 } }
Redirige a tu cliente a la URL que recibiste en la respuesta a Crear página de pago. La URL de redireccionamiento aparece en redirect_url campo e incluye todos los parámetros de la sesión de pago.
Nota: La página de pago caduca 14 días después de la creación de forma predeterminada.
Como alternativa, puede especificar un page_expiration parámetro en Crear página de pago solicite y elija un valor diferente para el vencimiento de la página de pago, 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 pago ha caducado. |
DICIEMBRE | Se ha rechazado el pago. |