Credit Card Encryption

To increase transaction security, the Wirecard API works with the concept of end-to-end encryption. That is, the sensitive credit card data is encrypted in client applications (browser, native apps) and is only decrypted on Wirecard servers. This is important to prevent your buyer from being exposed to the data interception. See below for instructions on how to perform encryption on key clients.

Obtaining a Public Key

The first step to encrypt your credit card is by getting a public key. Public encryption keys are made available within your Wirecard Account. To access the public key of your teste account, click here or, if you already have a production account, and have already undergone the approval process, you can get your public key, clicking here.

Browser Encryption

We have a client-side library for you to use in the process of encrypting sensitive data, you should use it if you are encrypting client data in the browser or in applications running on html5 frameworks (Ionic, Meteor, etc.). For integrations in Mobile environments, you must encrypt the data using our SDKs (Android and iOS).

Moip.js library is available in our Github.

To encrypt your client's data, first import Moip.js:

<script type="text/javascript" src="//assets.moip.com.br/v2/moip.min.js"></script>

You should also include the script that will do the encryption on your page:

<script type="text/javascript">
    $(document).ready(function() {
        $("#encrypt").click(function() {
          var cc = new Moip.CreditCard({
            number  : $("#number").val(),
            cvc     : $("#cvc").val(),
            expMonth: $("#month").val(),
            expYear : $("#year").val(),
            pubKey  : $("#public_key").val()
          });
          console.log(cc);
          if( cc.isValid()){
            $("#encrypted_value").val(cc.hash());
          }
          else{
            $("#encrypted_value").val('');
            alert('Invalid credit card. Verify parameters: number, cvc, expiration Month, expiration Year');
          }
        });
    });
  </script>

With Moip.js on your page, all you have to do is create your checkout fields referring to the script that will encrypt your payment data.

HTML Form

Insert your public key into a field with the corresponding id in your function that communicates with Moip.js.

<textarea id="public_key" style="display:none;">
  -----BEGIN PUBLIC KEY-----
MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAsXkulsKdAQLMH/zjzTLf
0lrbgulfb6ZShEtRpmDnyX93EQqPdez7LyptvQBeTC+0pN57rNcWen9ApdsIMsNr
YHjNQf/kI4Ka7Xnlx0U/v7bW1D8teDoD5glBTXLjU8hRi7qlOpupiPx4ldSnK9Jj
tYApWuZMiCpWh/YRAlNW/N+ffm7ulq6H2atmgd+OFB2SghpbRJkqJiLaNJW8UkaR
oXLHkF5WJD/RPrCxsZztYJQThxLX5gBgZ12YG5+7G26Ad/mWkPqF0GLSkd1gcnbP
vF9Nw3ckKaIvh4Q4Vp3XI1hLvX41lg9CBxPPHkiJwM1M1coF9xsMP7kpJ2eujMBd
mwIDAQAB
-----END PUBLIC KEY-----</textarea>

You should also create a field for each parameter that should be sent to Wirecard:

<input type="text" placeholder="Credit card number" id="number"/>
<input type="text" placeholder="CVC" id="cvc"/>
<input type="text" placeholder="Month" id="month"/>
<input type="text" placeholder="Year" id="year" />

📘

The above fields do not need to follow a specific order.

With the encrypted data, you will receive the hash of the customer's credit card data cc.hash() that will be used at the time of payment.

👍

TIP

You can see a working example of encryption using Moip.js clicking here.