API PSR

  OBLIGATOIRE


After having followed the steps found in the section introduction, you can then integrate this API Client.

1 - INTRODUCTION

The PSR Payment Without Redirection , as its name suggests, is a service that allows your customers to make payments on your website without being redirected to the PayDunya payment page. This section explains how to integrate it into your website.


2 - PRE-REQUIS

You must first generate an invoice checkout as you do with PAR (see section of the PAR API to generate an invoice checkout) according to your programming language. Then retrieve the token and return it in format json as soon as you call your indicated endpoint below by an HTTP GET request:



https://your-domain/paydunya-api

EXPECTED ANSWER


{
    "success": true,
    "token": "hskjdjkqjkdqskdsq"
}

3 - STRUCTURE


Obligatoire


The HTML structure to be implemented is broken down into three parts explained in the sections below. To better detail this structure, here are the essential points :


3-1 - Insert the venobox css file in the tag head of HTML structure.



<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/venobox/1.8.2/venobox.min.css">


3-2 - Put the pay button inside the body tag.



<button class="pay" onclick="payWithPaydunya(this)" data-ref="102" data-fullname="Alioune Faye" data-email="aliounefaye@gmail.com" data-phone="774563209">Buy MacBook Pro (2,000,000 FCFA)</button>


3-3 - Include the JQuery js file, the paydunya js file and the js script containing the payWithPaydunya function:




    <script src="https://code.jquery.com/jquery.min.js"></script><script src="https://paydunya.com/js/paydunya2.min.js"></script><script>

    function payWithPaydunya(btn) {

        PayDunya.setup({
            selector: $(btn),
            url: "https://votre-domaine/paydunya-api",
            method: "GET",
            displayMode: PayDunya.DISPLAY_IN_POPUP,
            beforeRequest: function() {
                console.log("About to get a token and the url");
            },
            onSuccess: function(token) {
                console.log("Token: " + token);
            },
            onTerminate: function(ref, token, status) {
                console.log(ref);
                console.log(token);
                console.log(status);
            },
            onError: function (error) {
                alert("Unknown Error ==> ", error.toString());
            },
            onUnsuccessfulResponse: function (jsonResponse) {
                console.log("Unsuccessful response ==> " + jsonResponse);
            },
            onClose: function() {
                console.log("Close");
            }
        }).requestToken();
    }

</script>

4 - Attributes


The attributes are the elements which are at the button tag of the Pay . They are optional because they contain information that is not mandatory.


data-ref


<button class="pay" onclick="payWithPaydunya(this)" data-ref="102">Buy MacBook Pro (2,000,000 FCFA)</button>

data-ref attribute is in some way an identifier for a given payment. It allows you to associate a reference with a payment. After closing the payment window, this identifier is associated with the payment status.


data-fullname , data-email and data-phone


<button class="pay" onclick="payWithPaydunya(this)" data-fullname="Alioune Faye" data-email="aliounefaye@gmail.com" data-phone="774563209">Buy MacBook Pro (2,000,000 FCFA)</button>

data-fullname , data-email and data-phone are three attributes that allow the full name, email and phone of the payer to be prefilled at the time of payment. They will not need to fill them out.

5 - OPTIONS

The options are the attributes which are in the object passed in parameter to the javascript function Paydunya.setup() in the structure above. Are two attributes which allow to prefill the full name and email of the payer at the time of payment. They will not need to fill them out.

Note


The options with the red asterisks * are mandatory.

  • selector  *


    selector: $(btn)

  • url  *


    url: "https://votre-domaine/paydunya-api"

    Here it is a question of giving your URL which will return the payment link

  • method  *


    method : GET

  • displayMode  *


    displayMode: PayDunya.DISPLAY_IN_POPUP

  • beforeRequest


    
        beforeRequest: function() {
            console.log("About to get a token and the url");
        }
            
        

    This function is called just before query execution to your url https://your-domaine/paydunya-api to retrieve the token and the payment link.

  • onSuccess


    
        onSuccess: function(token) {
            console.log("Token: " +  token);
        }
        
        

    OnSuccess is executed after successfully retrieving the token and the payment link from your urlhttps://your-domaine/paydunya-api.

  • onTerminate


    
        onTerminate: function(ref, token, status) {
            console.log(ref);
            console.log(token);
            console.log(status);
        }
        
        

    This function is performed immediately after payment. It will give you as a parameter your reference given at the start, the token, and the payment status : pending, completed, failed et cancelled.

  • onError


    
        onError: function (error) {
                alert("Unknown Error == ", error.toString());
        }
        
        

    onError is called if there is an error in processing.

  • onUnsuccessfullResponse


    
        onUnsuccessfulResponse: function (jsonResponse) {
            console.log("Unsuccessful response == " + jsonResponse);
        }
        
        

    For this function, it is when the treatment has not been successfully executed.

  • onClose


    
        onClose: function() {
            console.log("Close");
        }
        
        

    onClose is the function that will be executed after closing the payment window. It will give you as a parameter the ref given at the start associated with the payment status: pending, completed, failed and canceled