This SDK can be used with Payconiq, Bancontact and iDeal.

After you initiated a server side Pay request you can initiate the payment on the client side. You will need to initiate the Client SDK with two (three with iDeal) parameters:

1. Container selector (string): Use the query selector format for selecting a DOM element.

2. Transaction key (string): Insert the transaction key from the server side Pay response. You can find the value in the “Key” field of the JSON response.

3. (For iDeal) Processing (boolean): Is your iDeal subscription processing? Insert true, or false.

When initiated the Client SDK will render a minimal “widget” inside the container element of your choice. The script will render a QR code and listen for status updates. In case the consumer is using a mobile device the script will redirect the consumer directly to the corresponding app (Payconiq, Bancontact, etc.) to complete the payment.

After the payment is completed, cancelled or failed the consumer will be redirected (by the SDK) to the ReturnUrl.

Include the ClientSDK like this in the bottom of the BODY element of your page. Like this:

<script src="https://checkout.buckaroo.nl/api/buckaroosdk/script"></script>

The Bancontact widget is available in multiple languages (English, French, and Dutch). To show the correct language, the source in the script tag should be called with the language code ("en" for English, "fr" for French, and "nl" for Dutch), like this:

<script src="https://checkout.buckaroo.nl/api/buckaroosdk/script/en"></script>

The default language is Dutch.

Note: The only dependency of the Buckaroo Client SDK is jQuery 1.9+

Payconiq script example

copy
$(document).ready(
    function() { 
        BuckarooSdk.Payconiq.initiate("#payconiqQr", "94EDDFBCFF774714AEDE0F9346XXXX"); 
    });

Bancontact script example

copy
$(document).ready(
    function() { 
        BuckarooSdk.BancontactMobile.initiate("#bancontactMobileButton", "94EDDFBCFF774714AEDE0F9346XXXX"); 
    });

iDeal script example

copy
$(document).ready(
    function() { 
        BuckarooSdk.IdealQr.initiate("#idealQrButton", "94EDDFBCFF774714AEDE0F9346XXXX", false); 
    });