Nutritious Pumpkin Mash


    1.2.2 • Public • Published

    MANGOPAY Card Registration JavaScript Kit Build Status

    MANGOPAY CardRegistration JavaScript Kit is a client library designed to take care of the card registration process. Refer to MANGOPAY REST API documentation and MANGOPAY card registration process for more information.

    Browser compatibility

    The library makes cross-origin Ajax calls (CORS) to get the card token and handle card registration with MANGOPAY API. Therefore it requires a browser that supports CORS. The kit does not support Internet Explorer 6 & 7 and Opera Mini.

    The payment page that collects card details should use HTTPS. The kit will not work in Internet Explorer 8 and 9 if this page is not encrypted with SSL.


    The kit has been written in pure JavaScript and has no external dependencies. It is enough to include the kit file on your card payment page:

    <script type="text/javascript" src="mangopay-kit.js"></script>

    Typically you would also have MANGOPAY SDK up and running to work with the MANGOPAY API. Java, PHP, .NET, Python and Ruby distributions are available.

    The kit is also available for installation from npm if you prefer.


    Set mangoPay.cardRegistration.clientId to your MANGOPAY Client ID. mangoPay.cardRegistration.baseURL is set to sandbox environment by default. To enable production environment, set it to


    Make sure you have the right configuration in place:

    // Set MANGOPAY API base URL and Client ID
    mangoPay.cardRegistration.baseURL = "";
    mangoPay.cardRegistration.clientId = {your-client-id};

    Create a new CardRegistration object on the server and pass it over to the JavaScript kit:

    // Initialize with card register data prepared on the server
        cardRegistrationURL: {CardRegistrationURL property}, 
        preregistrationData: {PreregistrationData property}, 
        accessKey: {AccessKey property},
        Id: {Id property}

    Collect card details from the user on a payment form:

    // Card data collected from the user
    var cardData = {
         cardNumber: $("#card_number").val(), 
         cardExpirationDate: $("#card_exp_date").val(), 
         cardCvx: $("#card_cvx").val(),
         cardType: $("#card_type").val()

    Then call mangoPay.cardRegistration.registerCard:

    // Register card
        function(res) {
            // Success, you can use res.CardId now that points to registered card
        function(res) {
            // Handle error, see res.ResultCode and res.ResultMessage

    Running the demo

    There is a simple PHP demo code included that shows how to use the kit. The demo page requires MANGOPAY SDK class to do the server-side work. Make sure that MANGOPAY PHP SDK is accessible to the demo page.

    Unit Tests

    Jasmine unit tests are placed under tests dir and can be launched in a browser using tests/index.html. Unit test covers only validation classes and requests with invalid data.


    MANGOPAY JavaScript Kit is distributed under MIT license.


    Report bugs or suggest features using issue tracker at GitHub.


    npm i mangopay-cardregistration-js-kit

    DownloadsWeekly Downloads






    Last publish


    • hobailey
    • matt-pozza
    • mickaelpois