Apple Pay a través de la API Directa
En esta página
Esta guía cubre cómo integrar Apple Pay directamente con la API de DEUNA. La integración directa le da control total sobre el flujo de pago, lo que la hace ideal para los comerciantes que necesitan implementaciones personalizadas o que ya tienen sistemas de pago existentes. Esta integración admite pagos únicos.
Apple Pay con DEUNA#
El siguiente es el proceso estándar para una compra con Apple Pay en DEUNA:
- Obtener los métodos de pago
- Inicializar el SDK Web de Apple Pay
- Realizar la compra con Apple Pay
1. Obtener los métodos de pago#
Obtener el ID de credencial de Apple Pay y los parámetros de configuración del SDK.
→ Ver la referencia de la API "Get Payment Methods"
Respuesta
{
"data": [
{
"allow_installments_plan": true,
"credentials": {
"external_merchant_id": "merchant.test.io.deuna.pay"
},
"enabled": true,
"extra_params": {
"allowed_auth_methods": [
"supports3DS"
],
"allowed_card_networks": [
"visa",
"masterCard",
"amex"
],
"merchant_name": "Test DEUNA"
},
"id": "ef2319fe-f88d-4d8d-b4d1-e4fa08f18651",
"method_type": "card_wallet",
"payment_provider": "apple_pay",
"processor_name": "apple_pay"
}
]2. Inicializar el SDK Web de Apple Pay#
Consultar la documentación del SDK Web de Apple Pay para obtener la referencia completa.
Importar el SDK JS de Apple Pay
Añadir el siguiente script a su página:
<script src="https://applepay.cdn-apple.com/jsapi/1.latest/apple-pay-sdk.js" crossorigin=""></script><script src="https://applepay.cdn-apple.com/jsapi/1.latest/apple-pay-sdk.js" crossorigin=""></script>Ejemplo de integración completa
// 1. Check availability
if (!window.ApplePaySession || !ApplePaySession.canMakePayments()) {
// Apple Pay not available — hide the button or show a fallback
}
// 2. Initialize the session on button click (must be inside a user gesture)
// Use the values returned by the Get Payment Methods endpoint
const request = {
countryCode: 'MX',
currencyCode: 'MXN',
supportedNetworks: ['visa', 'masterCard', 'amex', 'discover'], // from extra_params.allowed_card_networks
merchantCapabilities: ['supports3DS'], // from extra_params.allowed_auth_methods
total: { label: 'Your Store Name', amount: '1.00', type: 'final' },
};
const session = new ApplePaySession(3, request);
// 3. Validate the merchant
// The credential-id comes from the `id` field in the Get Payment Methods response
session.onvalidatemerchant = async (event) => {
const response = await fetch(
'https://api.{env}.deuna.io/wallet/credentials/{credential-id}/payment-session',
{
method: 'POST',
headers: {
'X-Merchant-Id': '{merchant-id}',
'X-Store-Code': '{store-code}',
'Content-Type': 'application/json',
},
body: JSON.stringify({
validation_url: event.validationURL,
domain: '{your-domain}',
}),
}
);
const { data } = await response.json();
session.completeMerchantValidation(data);
};
// 4. Handle payment authorization
// Once the customer authorizes the payment, send the token to DEUNA
// Use applePayToken in step 3 — Create Card or Purchase V2
session.onpaymentauthorized = (event) => {
const applePayToken = event.payment;
session.completePayment(ApplePaySession.STATUS_SUCCESS);
};
session.begin();3. Realizar la compra con Apple Pay#
Una vez que el cliente autoriza el pago en su dispositivo Apple, onpaymentauthorized se activa el evento y se envía un token de tarjeta encriptado a través de event.payment. Este token debe enviarse tal cual, sin ninguna modificación, a DEUNA.
3.1 Crear Tarjeta
El token de event.payment se envía al punto final "Create Card", que devuelve un card_id que se puede reutilizar en la compra.
→ Ver la referencia de la API "Create Card"
{
"apple_pay": {
"paymentData": {
"token": {
"transactionIdentifier": "7a94479858348...",
"paymentMethod": {
"type": "debit",
"displayName": "Visa 7553",
"network": "Visa"
},
"paymentData": {
"data": "EOeLQTsv8X7f...",
"header": {
"publicKeyHash": "MpXcCgm...",
"ephemeralPublicKey": "MFkwEwYH...",
"transactionId": "7a94479858348..."
},
"version": "EC_v1"
}
}
}
},
"credential_source": "apple_pay"
}3.2 Purchase with Card ID
Utilice esta opción cuando la tarjeta ya ha sido tokenizada a través de "Create Card". Esta es una solicitud estándar de Purchase V2 utilizando el card_id devuelto por el punto final "Create Card" — no se necesita ningún token de Apple Pay.
→ Ver la referencia de la API "Purchase V2"
{
"order_token": "{order-token}",
"order_type": "DEUNA_CHECKOUT",
"payer_info": {
"email": "customer@example.com",
"card_holder_dni": "12345678"
},
"payment_source": {
"method_type": "credit_card",
"card_info": {
"card_id": "{deuna-card-id}"
}
}
}3.3 Compra Directa
Esto es para los casos en que las tarjetas no están tokenizadas. El token de event.payment se envía directamente en la solicitud de compra.
→ Ver la referencia de la API "Purchase V2"
{
"order_token": "{{order-token}}",
"order_type": "DEUNA_CHECKOUT",
"payer_info": {
"email": "{{random_user}}@testuser.com",
"card_holder_dni": "12345678"
},
"payment_source": {
"method_type": "credit_card",
"card_info": {
"credential_source": "apple_pay",
"credential_source_config": {
"type": "apple_pay",
"values": {
"system": "EC_v1",
"merchant_transaction_id": "6bfbf33f787b7932d5d0....",
"encrypted_data": "Fk11fwjWL3uFZlBwAw83G0xRt8....",
"encryption_header": {
"signature": "MIAGCSqGSIb3DQEHAqCAMIACAQEx...",
"public_key_hash": "EB8/SypLvJCISa2d4sQzV/Zw...",
"ephemeral_public_key": "MFkwEwYHKoZIzj0CAQYIKoZIzj..."
}
}
}
}
},
"anti_fraud_info": {
"device": {
"id": "eyJPUEVOUEFZIjoiIiwiTUVSQ0FET1BBzAzLTk2NjRkYzE3MWQzYiJ9..."
}
}
}Respuesta
{
"order_type": "DEUNA_CHECKOUT",
"order_token": "4598f493-de86-4fe0-b9fd-c4c6c9847e39",
"order": {
"order_id": "DEUNA_CHECKOUT_b6a5c0b6-3df9-4b3b-b778-7086c190062b",
"currency": "MXN",
"total_amount": 10000,
"display_total_amount": "MXN 100,00",
"status": "succeeded",
"payment": {
"data": {
"status": "processed"
}
}
}
}