Seamless

Le seamless permet d'intégrer facilement AdjeminPay à son site e-commerce en ligne.

Intégration#

Lors de vos paiements, AdjeminPay vous notifie via une URL que vous definissez lors l'integration du seamless que nous verrons un peu devant. Si vous n'avez pas encore créé d'application, je vous conseille de le faire pour pouvoir suivre la suite. Après avoir rempli le formulaire de la création d'une application, il faut lier le seamless SDK à votre page grâce au lien suivant :

https://api.adjeminpay.net/release/seamless/latest/adjeminpay.min.js

Pour lier le seamless SDK à votre page, il suffit d'ajouter ces différents liens ci dessous dans votre page html.

checkout.html

<script src="https://api.adjeminpay.net/release/seamless/latest/adjeminpay.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>

Pour effectuer une transaction avec AdjeminPay, vous devez définir les différents champs ci-dessous :

amount : Montant du paiement.
currency : Devise du paiement, en CFA.
transaction_id : Unique identifiant de la transaction.
designation : Désignation du paiement.
notify_url : Uri de notification ou vous recevrez les informations après le paiement.
return_url : Uri de retour après le paiement.
cancel_url : Uri de retour après que le paiement aie echoué. Ces éléments suivants sont facultatifs :
phone_num : Numéro de téléphone utilisé pour le paiement.
adp_phone_prefixe : CC ou Country Code du numéro de téléphone utilisé.
- exemple : (225 => pour la Côte d'Ivoire)

Script exemple :#

checkout.html

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<div  class="demo">
    <div id="result">
        <h1 id="result-title"></h1>
        <p id="result-message"></p>
        <p id="result-status"></p>
    </div>
    <form id="paiement">
        <input type="hidden"  id="amount" value="25000">
        <input type="hidden" id="currency" value="CFA">
        <input type="hidden"  id="adp_signature" >
        <input type="hidden" id="transaction_id" value="nkHgzAivULfVzvvEkbMsEI7ZjOlRxl9G">
        <input type="hidden" id="designation" value="Paire de basket Air Force">
        <button type="submit" id="payBtn">Payer avec AdjeminPay</button>
    </form>
</div> 
    <script src="https://api-dev.adjeminpay.com/release/seamless/latest/adjeminpay.min.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>
    <script type="text/javascript">
        var AdjeminPay = AdjeminPay();
        AdjeminPay.on('init', function (e) {
            // retourne une erreur au cas où votre CLIENT_ID ou CLIENT_SECRET est incorrecte
             signature = e;       
              $("#adp_signature").val(signature);
        });
        // Lance une requete ajax pour vérifier votre CLIENT_ID et CLIENT_SECRET et initie le paiement
        AdjeminPay.init({
            client_id : 'VOTRE_CLIENT_ID',
            client_secret : "VOTRE_CLIENT_SECRET",
            transaction_id : $('#transaction_id').val(),
            designation :  $('#designation').val(),
            amount :  parseInt($('#amount').val()),
        });
        // Ecoute le feedback sur les erreurs
        AdjeminPay.on('error', function (e) {
            // la fonction que vous définirez ici sera exécutée en cas d'erreur
            console.log(e);
            $("#result-title").html(e.title);
            $("#result-message").html(e.message);
            $("#result-status").html(e.status);
        });
        // Lancer la procédure de paiement au click
        $('#payBtn').on('click', function () {
            // Vérifie vos informations et prépare le paiement
            // S'il y a une erreur à cette étape, AdjeminPay.on('error') sera exécuté
            AdjeminPay.preparePayment({
                amount: parseInt($('#amount').val()),
                transaction_id: $('#transaction_id').val(),
                currency: $('#currency').val(),
                designation: $('#designation').val(),
                custom: $('#custom_field').val(),
                notify_url: 'https://webhook.site/427ed2b8-db3e-4ac6-be64-9ecb5b68e420',
                signature : $('#adp_signature').val(),
                return_url :'https://application.example.com/return',
                cancel_url : 'https://application.example.com/cancel'
                // le notify_url est TRES IMPORTANT
                // c'est lui qui permettra de notifier votre backend
            });
            // Si l'étape précédante n'a pas d'erreur,
            // cette ligne génère et affiche l'interface de paiement AdjeminPay
            AdjeminPay.renderPaymentView();
        });
    </script>
</body>
</html>

L'espace de paiement

paiement