Aller au contenu principal
Tous les systèmes sont opérationnelsNouveautésv1
Se connecter

Coffre-fort de paiement

Stockez et tokenisez les informations de paiement pour une utilisation unique ou future

Sur cette page
Méthode d’intégration

Tokenisez les identifiants sans faire transiter les données sensibles de carte dans votre application.

Affichez les champs sécurisés ou les expériences Vault DEUNA, recevez des jetons réutilisables et traitez les paiements futurs en toute sécurité.

Interface
Expérience marchand avec saisie des identifiants sécurisée par DEUNA
Mode de déploiement
Composant SDK, intégré ou modal
Idéal pour
Cartes enregistrées, checkout en un clic et paiements récurrents
Comparer les méthodesOuvrir la référence

Comprendre les limites des informations d'identification#

Le card_id renvoyées par un flux de tokenisation pris en charge est une référence de paiement DEUNA. Sa disponibilité pour un paiement ultérieur dépend de la consentement du client, du type de token, du compte du commerçant, de la connexion au prestataire, de l'environnement, du pays et de l'opération activée pour ce flux.

  • Ne présumez pas que toutes les informations d'identification stockées peuvent être transférées entre les processeurs ou les méthodes de paiement.
  • Vérifiez le comportement de réseau-token, de mise à jour de compte, de portabilité, d'utilisation récurrente et de suppression pour le compte cible avant la mise en production.
  • Conservez le PAN, le CVV, le token du prestataire et les informations d'identification privées hors des journaux et des métadonnées de votre application.
  • Stockez le client, le but de la consentement, l'heure de tokenisation, le statut de l'information d'identification et l'utilisation future autorisée dans votre système de référence.
  • Prenez en charge la révocation, l'expiration, le remplacement et la suppression des informations d'identification sans considérer automatiquement un token supprimé comme une souscription annulée.

Utilisez la Catalogue des capacités des fournisseurs Pour le support de connexion publié, et pour confirmer le comportement spécifique du compte avec votre responsable technique DEUNA.

Intégration : utilisation du SDK de DEUNA#

L'intégration de Payment Vault se fait via les SDK de DEUNA.

Dans les environnements Web, le widget peut être ouvert dans un élément HTML cible ou affiché sous forme modale.

Choisissez votre plateforme SDK:

Web SDKJavaScript et TypeScript pour toutes les stacks web.JavaScript · CDNReact NativeUne seule intégration pour les applications iOS et Android.TypeScript · iOS + AndroidiOSSDK Swift pour les applications iOS natives.Swift · SPMAndroidSDK Kotlin pour les applications Android natives.Kotlin · Gradle

Caractéristiques

  • Le SDK expose plusieurs rappels qui permettent au commerçant de réagir de manière dynamique aux événements importants du flux de paiement, tels que :
    • Lorsque l'utilisateur ferme le widget.
    • Lorsqu'une carte ou un identifiant de paiement est tokenisé avec succès.
    • Lorsqu'une tentative de tokenisation échoue.
  • Le coffre-fort de paiement peut être rendu intégré ou comme un modale.

Informations complémentaires

En savoir plus sur l’intégration de Payment Vault :

  • Vérification du type d'événement et de la marque de la carte: The Vault reconnaît les marques de cartes à partir des métadonnées d'événements.
  • Remise appliquée si la carte est Mastercard par le commerçant : Si la carte est Mastercard, une remise de 20% est appliquée sur le panier en cours. Cette action est entièrement effectuée par votre application.
  • Mise à jour de la commande: Après avoir appliqué une remise, votre application est responsable de la mise à jour de la commande à l’aide du point de terminaison DEUNA Update Order.
  • Notification au widget pour mettre à jour la commande et les versements: Les changements dans le statut d'une commande sont communiqués à l'aide des rappels du SDK.
  • Afficher une étiquette promotionnelle: En plus de la mise à jour des montants de la commande et du paiement, vous pouvez appliquer des styles CSS personnalisés au widget actif à l'aide de setCustomStyles(...). Voir le Guide du SDK Web.

Effectuez un paiement avec le token retourné card_id

Pour traiter un paiement dans DEUNA avec donné card_id utiliser le API d'achat.

Exemple de demande curl

JavaScript
const requestBody = {
    payer_info: {
        email: "eposada@deuna.com"
    },
    payment_source: {
        method_type: "credit_card",
        card_info: {
            card_id: "8d369b6e-113a-4640-9e63-dc29957fc86a",
            installment: {
            	plan_option_id: "<uuid que se retorna en el postMessage 'onInstallmentSelected'>"
            }
        }
    },
    // ... Remaining of the request body
};

fetch('https://api.sandbox.deuna.io/v2/merchants/orders/purchase', {
    method: 'POST',
    headers: {
        'x-api-key': '<YOUR_PRIVATE_API_KEY>',
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
curl --location 'https://api.sandbox.deuna.io/v2/merchants/orders/purchase' \
--header 'x-api-key: YOUR_PRIVATE_API_KEY' \
--header 'Content-Type: application/json' \
--data-raw '{
    "payer_info": {
        "email": "foo@bar.com"
    },
    "payment_source": {
        "method_type": "credit_card",
        "card_info": {
            "card_id": "8d369b6e-113a-4640-9e63-dc29957fc86a"
        }
    },
    "order": {
        "order_id": "testapi-0003",
        "currency": "MXN",
        "items": [
          {
              "id": "216",
              "name": "10 Cellphones",
              "description": "",
              "options": "string option",
              "total_amount": {
                  "original_amount": 2000,
                  "amount": 2000,
                  "currency": "MXN",
                  "currency_symbol": "$"
              },
              "unit_price": {
                  "amount": 200,
                  "currency": "MXN",
                  "currency_symbol": "$"
              },
              "tax_amount": {
                  "amount": 0,
                  "currency": "MXN",
                  "currency_symbol": "$"
              },
              "quantity": 1,
              "uom": "string",
              "upc": "string",
              "sku": "",
              "isbn": "",
              "brand": "",
              "manufacturer": "",
              "category": "",
              "color": "",
              "size": "",
              "weight": {
                  "amount": 0,
                  "unit": "kg"
              },
              "image_url": "https://images-staging.getduna.com/95463fb5-6279-4ec3-8ff9-fe07aacd2142/db5b698c57654116_domicilio_216_750x750_1662162887.png?d=200x200&format=webp",
              "details_url": "",
              "type": "physcal",
              "taxable": true
          }
        ],
        "sub_total": 2000,
        "total_amount": 2000,
        "store_code": "all",
        "billing_address": {
            "address1": "presa angostura 36PH",
            "address2": "",
            "address_type": "home",
            "city": "CDMX",
            "country_code": "MX",
            "email": "foo@bar.com",
            "first_name": "efren",
            "identity_document": "162915134",
            "is_default": true,
            "last_name": "garcia",
            "phone": "+525222222222",
            "state_code": "MX",
            "state_name": "miguel hidalgo",
            "zipcode": "11500"
        }
    }
}'
PHP
$curl = curl_init();

$requestBody = json_encode(array(
    "payer_info" => array(
        "email" => "foo@bar.com"
    ),
    "payment_source" => array(
        "method_type" => "credit_card",
        "card_info" => array(
            "card_id" => "8d369b6e-113a-4640-9e63-dc29957fc86a"
        )
    ),
    // Aquí puedes continuar añadiendo el resto del cuerpo de la solicitud
    "order" => array(
        "order_id" => "testapi-0003",
        "currency" => "MXN",
        "items" => array(
            // Aquí van los detalles de los items
        ),
        // Continúa con el resto de los detalles del pedido
    )
));

curl_setopt_array($curl, array(
  CURLOPT_URL => "https://api.sandbox.deuna.io/v2/merchants/orders/purchase",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "POST",
  CURLOPT_POSTFIELDS => $requestBody, // Aquí se utiliza la variable
  CURLOPT_HTTPHEADER => array(
    "x-api-key: YOUR_PRIVATE_API_KEY", // Asegúrate de reemplazar con tu API key real
    "Content-Type: application/json"
  ),
));


$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}
Ruby
require 'uri'
require 'net/http'
require 'json'

url = URI("https://api.sandbox.deuna.io/v2/merchants/orders/purchase")

http = Net::HTTP.new(url.host, url.port)
http.use_ssl = true

request_body = {
    payer_info: {
        email: "foo@bar.com"
    },
    payment_source: {
        method_type: "credit_card",
        card_info: {
            card_id: "8d369b6e-113a-4640-9e63-dc29957fc86a"
        }
    }
    # ... Agrega aquí el resto del cuerpo de la solicitud
}.to_json

request = Net::HTTP::Post.new(url)
request["x-api-key"] = "YOUR_PRIVATE_API_KEY" # Reemplaza con tu API key
request["Content-Type"] = "application/json"
request.body = request_body

response = http.request(request)
puts response.read_body
Java
import java.net.URI;
import java.net.http.HttpClient;
import java.net.http.HttpRequest;
import java.net.http.HttpResponse;
import org.json.JSONObject;

public class Main {
    public static void main(String[] args) {
        HttpClient client = HttpClient.newHttpClient();
        
        JSONObject requestBody = new JSONObject()
            .put("payer_info", new JSONObject().put("email", "foo@bar.com"))
            .put("payment_source", new JSONObject()
                .put("method_type", "credit_card")
                .put("card_info", new JSONObject().put("card_id", "8d369b6e-113a-4640-9e63-dc29957fc86a")))
            // ... Agrega aquí el resto del cuerpo de la solicitud

        HttpRequest request = HttpRequest.newBuilder()
            .uri(URI.create("https://api.sandbox.deuna.io/v2/merchants/orders/purchase"))
            .header("x-api-key", "YOUR_PRIVATE_API_KEY") // Reemplaza con tu API key
            .header("Content-Type", "application/json")
            .POST(HttpRequest.BodyPublishers.ofString(requestBody.toString()))
            .build();

        client.sendAsync(request, HttpResponse.BodyHandlers.ofString())
            .thenApply(HttpResponse::body)
            .thenAccept(System.out::println)
            .join();
    }
}

Démo

Après avoir intégré Payment Vault, l’expérience est similaire à la démo suivante :