multiple_PSP.html

<div id="log"></div>
<script type="text/javascript" src="https://dl.dropboxusercontent.com/sh/oexkzj4z2zzs02d/AADB02b-GUnvoxDr9EvD61yZa/adyen.encrypt.nodom.min.js"></script>
<script src="https://js.braintreegateway.com/js/braintree-2.22.2.min.js"></script>
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
<script type="text/javascript">
(function() {
    //Copy your public keys here
    var stripePK = "pk_test_jg6c4WIhuzDD7kcYW0Nu7T6r";
    var adyenPK = "10001|B01FDAF7CD9B73F094906C5B078963FAAE57AFC619D561EFC784EA505EC6CCA94AF0CA3F97CA9CFC04E2151F39A461BF45DE7CB7DEA46C56EB3420502DA69BF4A6FFA21464D46861051367A26422EF3A9E6288F821CB47E8F88B4C2D9BEEF96AF0686E6F1C4171C5B5BD1C80E23A112BE57B990389E783B8F614F07CDBBBB68D7175F0282C7E0FA985D881E2A9EB6B54BE231D5733912A217F92D5952C6AA1ECF1765F11337441502FFCDD9B9DD3F2A40F98E96DDF51E60B06D8987D3622EB119AF7360055626DC99E6555724FBBFC1F985DB506E16E6A9B040959799C3C6ADD7F21C97493D7823CE7A234491377165815CE075ED55375F772F101DA0335D70D";
    var brainTreePK = "eyJ2ZXJzaW9uIjoyLCJhdXRob3JpemF0aW9uRmluZ2VycHJpbnQiOiJhYTE2YzZhYmY2ZGJlOWYwZDEzYzg4YjVlY2NmZTQ3MDZjMGI2NDhmNjllOTVkMjA0YmI1OGIzZjFmMThlM2FlfGNyZWF0ZWRfYXQ9MjAxNi0wNC0wN1QyMjoyMDowMC4zNjAyMjUxMzYrMDAwMFx1MDAyNm1lcmNoYW50X2lkPTM0OHBrOWNnZjNiZ3l3MmJcdTAwMjZwdWJsaWNfa2V5PTJuMjQ3ZHY4OWJxOXZtcHIiLCJjb25maWdVcmwiOiJodHRwczovL2FwaS5zYW5kYm94LmJyYWludHJlZWdhdGV3YXkuY29tOjQ0My9tZXJjaGFudHMvMzQ4cGs5Y2dmM2JneXcyYi9jbGllbnRfYXBpL3YxL2NvbmZpZ3VyYXRpb24iLCJjaGFsbGVuZ2VzIjpbXSwiZW52aXJvbm1lbnQiOiJzYW5kYm94IiwiY2xpZW50QXBpVXJsIjoiaHR0cHM6Ly9hcGkuc2FuZGJveC5icmFpbnRyZWVnYXRld2F5LmNvbTo0NDMvbWVyY2hhbnRzLzM0OHBrOWNnZjNiZ3l3MmIvY2xpZW50X2FwaSIsImFzc2V0c1VybCI6Imh0dHBzOi8vYXNzZXRzLmJyYWludHJlZWdhdGV3YXkuY29tIiwiYXV0aFVybCI6Imh0dHBzOi8vYXV0aC52ZW5tby5zYW5kYm94LmJyYWludHJlZWdhdGV3YXkuY29tIiwiYW5hbHl0aWNzIjp7InVybCI6Imh0dHBzOi8vY2xpZW50LWFuYWx5dGljcy5zYW5kYm94LmJyYWludHJlZWdhdGV3YXkuY29tLzM0OHBrOWNnZjNiZ3l3MmIifSwidGhyZWVEU2VjdXJlRW5hYmxlZCI6dHJ1ZSwicGF5cGFsRW5hYmxlZCI6dHJ1ZSwicGF5cGFsIjp7ImRpc3BsYXlOYW1lIjoiQWNtZSBXaWRnZXRzLCBMdGQuIChTYW5kYm94KSIsImNsaWVudElkIjpudWxsLCJwcml2YWN5VXJsIjoiaHR0cDovL2V4YW1wbGUuY29tL3BwIiwidXNlckFncmVlbWVudFVybCI6Imh0dHA6Ly9leGFtcGxlLmNvbS90b3MiLCJiYXNlVXJsIjoiaHR0cHM6Ly9hc3NldHMuYnJhaW50cmVlZ2F0ZXdheS5jb20iLCJhc3NldHNVcmwiOiJodHRwczovL2NoZWNrb3V0LnBheXBhbC5jb20iLCJkaXJlY3RCYXNlVXJsIjpudWxsLCJhbGxvd0h0dHAiOnRydWUsImVudmlyb25tZW50Tm9OZXR3b3JrIjp0cnVlLCJlbnZpcm9ubWVudCI6Im9mZmxpbmUiLCJ1bnZldHRlZE1lcmNoYW50IjpmYWxzZSwiYnJhaW50cmVlQ2xpZW50SWQiOiJtYXN0ZXJjbGllbnQzIiwiYmlsbGluZ0FncmVlbWVudHNFbmFibGVkIjp0cnVlLCJtZXJjaGFudEFjY291bnRJZCI6ImFjbWV3aWRnZXRzbHRkc2FuZGJveCIsImN1cnJlbmN5SXNvQ29kZSI6IlVTRCJ9LCJjb2luYmFzZUVuYWJsZWQiOmZhbHNlLCJtZXJjaGFudElkIjoiMzQ4cGs5Y2dmM2JneXcyYiIsInZlbm1vIjoib2ZmIn0=";

    var cardData = { // retrieved from HTML form using JS or jQuery
        number : "4242424242424242",
        cvc : "123",
        holderName : "Felix Tester",
        expiryMonth : "09",
        expiryYear : "2019",
        generationtime : "2015-11-29T13:42:40.428Z"
    };

    // Adyenpart
    // https://docs.adyen.com/manuals/easy-encryption#javascriptonly
    var options = {}; // See adyen.encrypt.nodom.html for details
    var cseInstance = adyen.encrypt.createEncryption(adyenPK, options);

    function handleAdyen(cardData) {

        var adyenPostData = {};

        // Encrypted payment data for use with adyen
        adyenPostData['adyen-encrypted-data'] = cseInstance.encrypt(cardData);
        console.log("ADYEN ENCRYPTED DATA: ");
        console.log(adyenPostData);
        // Ajax Call or different handling of the post data
        // https://docs.adyen.com/manuals/easy-encryption#makeacardpayment
    }

    // BrainTree part
    // https://developers.braintreepayments.com/reference/client-reference/javascript/v2/credit-cards
    var client = new braintree.api.Client({clientToken: brainTreePK});

    function handleBrainTree(cardData) {

      client.tokenizeCard({
        number: cardData.number,
        expirationDate: cardData.expiryMonth + "/" + cardData.expiryYear
      }, function (err, nonce) {
        console.log("BRAINTREE TOKEN: " + nonce) // BrainTree token to create charge or customer
        // Ajax Call or different handling of the post data
        // https://developers.braintreepayments.com/reference/request/transaction/sale/ruby
      });
    }

    // Stripe part
    // https://stripe.com/docs/custom-form#step-2-create-a-single-use-token
    function handleStripe(cardData, stripeResponseHandler) {
      // set stripe publishable key
      Stripe.setPublishableKey(stripePK);
        // required fields for token generation
        var requiredFields = {
            number: cardData.number,
            cvc: cardData.cvc,
            exp_month: cardData.expiryMonth,
            exp_year: cardData.expiryYear
        };

        // create stripe token
        Stripe.card.createToken(requiredFields, stripeResponseHandler);
    }

    // handle response back from Stripe
    function stripeResponseHandler(status, response) {

        // if an error
        if (response.error) {
          	// respond in some way
            alert("Error: " + response.error.message);
        }

        // if everything is alright
        else {
            console.log("STRIPE TOKEN: " + response.id) // Stripe token to create charge or customer
            // Ajax Call or different handling of the post data
            // https://stripe.com/docs/charges
        }
    }

    // Write console.log to log div
    var old = console.log;
    var logger = document.getElementById('log');
    console.log = function (message) {
        if (typeof message == 'object') {
            logger.innerHTML += (JSON && JSON.stringify ? JSON.stringify(message) : message) + '<br />';
        } else {
            logger.innerHTML += message + '<br />';
        }
    }

    // Execute both functions after CC data collection
    // Opening this HTML file in your browser will output encrypted Adyen data
    // and Stripe token in JavaScript console.
    handleAdyen(cardData);
    handleBrainTree(cardData);
    handleStripe(cardData, stripeResponseHandler);
})();
</script>