{"_id":"59dfa8f45c0bae001c2e8afd","category":{"_id":"59dfa8f45c0bae001c2e8af0","version":"59dfa8f45c0bae001c2e8ae8","project":"57336fd5a6a9c40e00e13a0b","__v":0,"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-11-03T20:45:01.593Z","from_sync":false,"order":7,"slug":"topics","title":"Guides"},"parentDoc":null,"project":"57336fd5a6a9c40e00e13a0b","user":"560d5913af97231900938124","version":{"_id":"59dfa8f45c0bae001c2e8ae8","project":"57336fd5a6a9c40e00e13a0b","__v":1,"createdAt":"2017-10-12T17:40:04.535Z","releaseDate":"2017-10-12T17:40:04.535Z","categories":["59dfa8f45c0bae001c2e8ae9","59dfa8f45c0bae001c2e8aea","59dfa8f45c0bae001c2e8aeb","59dfa8f45c0bae001c2e8aec","59dfa8f45c0bae001c2e8aed","59dfa8f45c0bae001c2e8aee","59dfa8f45c0bae001c2e8aef","59dfa8f45c0bae001c2e8af0"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"3.23. Release","version_clean":"8976.0.0-Basics","version":"8976-Basics"},"__v":0,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-10-15T15:30:17.762Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":3,"body":"Client-side encryption refers to encrypting sensitive data (like the credit card number and security code) before sending it to your server. This enables you to drastically reduce your PCI compliance scope to SAQ A-EP. Client-side encryption can be easily implemented for web, Android, and iOS using a customized encryption library.\n\nSee:\n  * [How client-side encryption works](#section-how-client-side-encryption-works)\n  * [Implementation in your web form](#section-implementing-client-side-encryption-in-your-web-form)\n  * [Implementation in your iOS app](#section-implementing-client-side-encryption-in-your-ios-app)\n  * [Implementation in your Android app](#section-implementing-client-side-encryption-in-your-android-app)\n  * [Using encrypted data to process payments via the BlueSnap APIs](#section-using-encrypted-data-to-process-payments-via-the-bluesnap-apis) \n\n#How client-side encryption works\n\nBlueSnap provides an encryption library for each platform: web, iOS, and Android. The encryption library uses your Client-Side Encryption key to encrypt sensitive payment fields like the credit card number and security code. The encryption is done on the checkout page on the client side device.\n\nEncrypting payment information on the client side means that you don't have to handle sensitive data, because it is encrypted before it is sent to your server. This makes payments more secure and also reduces your PCI compliance burden.\n\nOnce you have the encrypted data on your server, you can then pass it on to BlueSnap for transaction processing via the Payment API. BlueSnap will use its private key to decrypt the data, process the transaction, and then send you information about the status of the transaction.\n\n#Implementing client-side encryption in your web form\n\nFollow these steps in order to implement client-side encryption in your own web form:\n\n##Step 1: Add bluesnap.js and your public encryption key\nInclude the BlueSnap JavaScript library in your page, using this script:\n\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<script src=\\\"https://gateway.bluesnap.com/js/cse/v1.0.3/bluesnap.js\\\"></script>\",\n      \"language\": \"html\",\n      \"name\": \"Adding bluesnap.js\"\n    }\n  ]\n}\n[/block]\nThe [bluesnap.js](https://gateway.bluesnap.com/js/cse/v1.0.3/bluesnap.js) resides on the BlueSnap server.\n\nIn a separate `script` tag under the first, create a new BlueSnap object and instantiate it with your public key:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<script>\\nvar bluesnap = new BlueSnap\\n(\\\"YOUR_PUBLIC_KEY\\\");\\n</script>\",\n      \"language\": \"html\",\n      \"name\": \"Adding your client-side encryption key\"\n    }\n  ]\n}\n[/block]\nReplace `YOUR_PUBLIC_KEY` with your client-side encryption key. You can find it in the BlueSnap Merchant Console under **Integration > BlueSnap API**.\n\n**Note:** You will need a BlueSnap account in order to get your public encryption key. If you don't have an account yet, you can [sign up for one here](http://home.bluesnap.com/get-started/).\n\n##Step 2: Set up your form to encrypt sensitive information\nAdd the  'data-bluesnap' attribute to the **card number** and **security code** fields in your checkout form. You can set the value of the `data-bluesnap` attribute to whatever you wish.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<div>\\n\\t<label for=\\\"creditCard\\\">Card</label>\\n\\t<input type=\\\"text\\\" placeholder=\\\"Enter Card\\\" name=\\\"creditCard\\\" id=\\\"creditCard\\\" data-bluesnap=\\\"encryptedCreditCard\\\">\\n</div>\\n<div>\\n\\t<label for=\\\"cvv\\\">CVV</label>\\n\\t<input type=\\\"text\\\" placeholder=\\\"Enter CVV\\\" name=\\\"cvv\\\" id=\\\"cvv\\\" data-bluesnap=\\\"encryptedCvv\\\">\\n</div>\\n\",\n      \"language\": \"html\",\n      \"name\": \"Adding the data-bluesnap attribute\"\n    }\n  ]\n}\n[/block]\nIn the same script tag where you instantiated the BlueSnap object, add code similar to the following in order to perform BlueSnap encryption once the shopper clicks the submit button:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<script>\\n  var bluesnap = new BlueSnap\\n  (\\\"YOUR_PUBLIC_KEY\\\");\\n  document.getElementById(\\\"submit-button\\\").addEventListener(\\\"click\\\", function(){\\n  bluesnap.encrypt(\\\"checkout-form\\\");\\n  });\\n</script>\",\n      \"language\": \"html\",\n      \"name\": \"Encrypting the form on submit\"\n    }\n  ]\n}\n[/block]\nIn `bluesnap.encrypt(\"checkout-form\")`, above, `checkout-form` is the ID of the form. This tells the bluesnap.js library where to search for input fields with the `data-bluesnap` attribute.\n\n###What happens on submit?\n\nThis is what happens when the shopper clicks the submit button:\n1. Each of the fields with the `data-bluesnap` attribute is automatically encrypted on the client side.\n2. An HTML hidden input field is created for each of the encrypted fields. The name of the hidden input field is the value in the `data-bluesnap` attribute. The value of the hidden field is the encrypted string.\n3. An additional hidden field called `ccLast4Digits` is also generated. The value of this field is the last four digits of the credit card number (assuming that the credit card number field has a `data-bluesnap` attribute).\n4. The `name` attribute of the fields with the `data-bluesnap` attribute is removed, so that they will not be sent to your server.\n5. The hidden fields and the fields without the `data-bluesnap` attribute are posted to your server.\n\nFollowing is an example of what would be posted to your server on submit:\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/C9W0xADXRn2qrGN5yYql_Post-from-checkout-form.png\",\n        \"Post-from-checkout-form.png\",\n        \"615\",\n        \"285\",\n        \"#dddddd\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:callout]\n{\n  \"type\": \"info\",\n  \"title\": \"Use POST, not GET\",\n  \"body\": \"To reinforce security measures when using Client-side Encryption, use POST, not GET.\\nIn addition, make sure not to store any sensitive information in cookies.\"\n}\n[/block]\n###Example form\nFor an example of a checkout form after implementing client-side encryption, see: [GitHub: Checkout-page-examples/BlueSnap_CheckoutForm_CSE_Tutorial.html](https://github.com/bluesnap/Checkout-page-examples/blob/master/BlueSnap_CheckoutForm_CSE_Tutorial.html)\n\n##Step 3: Use the encrypted information when processing payments via the API\nOnce you have the encrypted card details, you can process payments as usual by including those details in your API requests. See [Using encrypted data to process payments via the BlueSnap APIs](#section-using-encrypted-data-to-process-payments-via-the-bluesnap-apis) .\n\n<br>\n<a class=\"btn btn-primary\" href=\"#\" role=\"button\">Back to Top</a>\n\n#Implementing client-side encryption in your iOS app\n\nFollow the steps below to set up client-side encryption in your iOS app. The encryption process will occur directly on the client's iOS device.\n\n1. Download and extract the `bluesnap-encrypter-ios.gz` file from [GitHub](https://github.com/bluesnapper/Client-Side-Encryption/blob/master/bluesnap-encrypter-ios.gz)\n\n2. Drag the `bluesnap-encrypter-ios` folder into your project navigator in Xcode:\n  * Check **Copy items into destination group's folder**\n  * Check **Create groups for any added folders**\n[block:callout]\n{\n  \"type\": \"info\",\n  \"title\": \"Configure X-Code for CSE\",\n  \"body\": \"It's important to configure x-code for projects using CSE by activating Keychain Sharing. \\nUnder your project settings, go to SharingKeychainOne Target, selection the Capabilities pane, and turn on KeyChainSharing\"\n}\n[/block]\n3. Under your project settings, select the required Target, go to the Build Settings pane, under the the Linking section, go to Other Linker Flags and add the flag `\"-ObjC -all_load\"`.\n\n4. Include the header file:\n`#include \"BlueSnapEncrypter.h\"`\n\n5. Initialize the encrypter object with your client-side encryption key, which you can find in the BlueSnap Merchant Console under **Integration > BlueSnap API**:\n`NSString *publicKey=:::at:::\"{your-public-key}\";\nBlueSnapEncrypter *encrypter = [[BlueSnapEncrypter alloc]initWithPublicKey:publicKey];`\n\n6. Encrypt sensitive details, such as credit card number or cvv:\n`NSString *secret = @“secret”;\nNSString *encrypted = [encrypter encryptText:secret];`\n\n<br>\n<a class=\"btn btn-primary\" href=\"#\" role=\"button\">Back to Top</a>\n\n#Implementing client-side encryption in your Android app\n\nFollow the steps below to set up client-side encryption in your Android app. The encryption process will occur directly on the client's Android device.\n\n1. Download this BlueSnap encryption library .jar file and add it to your Android application project:\n[https://gateway.bluesnap.com/java/cse/v1.0.1/bluesnap-encrypter.jar](https://gateway.bluesnap.com/java/cse/v1.0.1/bluesnap-encrypter.jar)\n\n2. In your Android project, configure the BlueSnap encrypter with your client-side encryption key, which you can find in the BlueSnap Merchant Console under **Integration > BlueSnap API**:\n`BlueSnapEncrypter encrypter = new BlueSnapEncrypter(\"your-client-side-encryption-key\");`\n\n3. Call the encrypt method passing the sensitive payment data to be encrypted:\n`String encryptedCreditCardNumber = encrypter.encrypt(4111111111111111);\nString encryptedSecurityCode = encrypter.encrypt(123);`\n\n<br>\n<a class=\"btn btn-primary\" href=\"#\" role=\"button\">Back to Top</a>\n\n#Using encrypted data to process payments via the BlueSnap APIs\n\nOnce you have implemented client-side encryption, you will send the encrypted card number and security code in the `encryptedCardNumber` and `encryptedSecurityCode` properties. These properties are within the `creditCard` element in your requests. Note that you must include both of these properties in the request, or else you will receive an error message.\n\nWe recommend that you test client-side encryption with the API in the Sandbox environment.\n\n##Payment API Example\nHere is an example of how you can send the encrypted card details in an [Auth Capture](/v2.1/docs/auth-capture) request in the Payment API.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"{\\n    \\\"amount\\\": 11,\\n    \\\"recurringTransaction\\\": \\\"ECOMMERCE\\\",\\n    \\\"softDescriptor\\\": \\\"DescTest\\\",\\n    \\\"cardHolderInfo\\\": {\\n        \\\"firstName\\\": \\\"test first name\\\",\\n        \\\"lastName\\\": \\\"test last name\\\"\\n    },\\n    \\\"currency\\\": \\\"USD\\\",\\n    \\\"creditCard\\\": {\\n        \\\"expirationYear\\\": 2019,\\n        \\\"encryptedCardNumber\\\": \\\"$bsjs_1_0_3$B23uuxq8drUwOYZm3wZi+Qm69V5GPEt8PEio+Edwcm8akczQSK7odgLQH/Au+VqOCsGspW1Q9mPyQIzGLSZLVToAQVfq5C1ld+2ogIIsDL32Hd6IojboLyVlYT1FvPQoDyz19K6N0CUHh5uk0kCLuHSUyjvoJH38ojHZifbJSm/7S5vAtiuC3BJt2z8k9nauQaAXkbyoAYwrS1yDpqOt2k2lGhKcmdQ4ImDR0RL8m8xig6sFrki9oqo3Mju/M5r7wXXVTf7TMtWiQbzdfREOxKUnviXJZpncdHqVjj5GvPYun2qgopKVKr8F5+yd19TVW2gvA1kXBkXonFL9159Gxg==$zckJgo2i8jXDiAHwVVHBKypXFnWqF2e+6luBkmtQQRKniDXyXaalRVKLtYscBaGd$W7Ojqk1Q2iOJVeGL39RAsZTtfup3f1deSzvxrvC9rXA=\\\",\\n        \\\"encryptedSecurityCode\\\": \\\"$bsjs_1_0_3$MB1nBpok/YkuWPG1/7e6dyFFhDPHB8p8E9Yo+0YHHV+xkHuzFKr02wAnE8PJ8QCzWH+2ctXy5FN6wLKjwFrfTOgy0BJ9k9+NDEe8mhsu66wMlyc3lnwrbvMRCWN1O+5gUNCFExj7B0mDtf4gtxecXs74KZ5l5dbpGWdKUk5i7OewWyTqsONbn9taLfVBOwuIOy2Jgi4fx+yB8Q05KdZeHSNSBJh8H/47AUNAn5dM+d9iO6yGQB3obzEzzR3UtHlkGR52ZsgbbFh0JMm9lBM2ClgYM8jvmQjS9HX2ojt1fkbhuPEb1IY/M498a+1wDPpI4aMfDxO1lSpJneRSpY5k4g==$XaKq1NbPcS0iHy9N9jHekEIByHYS4G3wJXlC9EQjAGM=$BJn6X6mBYGUo8Eoq4RQz69gsi4Azl8jT973mNpG9Yuo=\\\",\\n        \\\"cardType\\\": \\\"VISA\\\",\\n        \\\"expirationMonth\\\": \\\"07\\\"\\n    },\\n    \\\"cardTransactionType\\\": \\\"AUTH_CAPTURE\\\"\\n}\",\n      \"language\": \"json\",\n      \"name\": \"Auth Capture Request: with encrypted card details\"\n    }\n  ]\n}\n[/block]\n##Extended Payment API Example\nHere is an example of how you can send the encrypted card details in a [Create Order and New Shopper](/v3.0/docs/create-shopper-and-order) request in the Extended Payment API.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<batch-order xmlns=\\\"http://ws.plimus.com\\\">\\n  <shopper>\\n    <web-info>\\n      <ip>62.219.121.253</ip>\\n    </web-info>\\n    <shopper-info>\\n      <shopper-currency>USD</shopper-currency>\\n      <store-id>4677</store-id>\\n      <locale>en</locale>\\n      <shopper-contact-info>\\n        <title>Mr.</title>\\n        <first-name>John</first-name>\\n        <last-name>Doe</last-name>\\n        <email>jdoe@johndoeandsons.com</email>\\n        <company-name>JohnDoeAndSons</company-name>\\n        <address1>138 Market st</address1>\\n        <city>San Francisco</city>\\n        <zip>756543</zip>\\n        <state>CA</state>\\n        <country>US</country>\\n        <phone>1413555666</phone>\\n        <fax>1413555666789</fax>\\n      </shopper-contact-info>\\n      <payment-info>\\n        <credit-cards-info>\\n          <credit-card-info>\\n            <billing-contact-info>\\n              <first-name>John</first-name>\\n              <last-name>Doe</last-name>\\n              <address1>138 Market st</address1>\\n              <city>San Francisco</city>\\n              <zip>756543</zip>\\n              <state>CA</state>\\n              <country>US</country>\\n            </billing-contact-info>\\n            <credit-card>\\n              <encrypted-card-number>$bsjs_1_0_3$B23uuxq8drUwOYZm3wZi+Qm69V5GPEt8PEio+Edwcm8akczQSK7odgLQH/Au+VqOCsGspW1Q9mPyQIzGLSZLVToAQVfq5C1ld+2ogIIsDL32Hd6IojboLyVlYT1FvPQoDyz19K6N0CUHh5uk0kCLuHSUyjvoJH38ojHZifbJSm/7S5vAtiuC3BJt2z8k9nauQaAXkbyoAYwrS1yDpqOt2k2lGhKcmdQ4ImDR0RL8m8xig6sFrki9oqo3Mju/M5r7wXXVTf7TMtWiQbzdfREOxKUnviXJZpncdHqVjj5GvPYun2qgopKVKr8F5+yd19TVW2gvA1kXBkXonFL9159Gxg==$zckJgo2i8jXDiAHwVVHBKypXFnWqF2e+6luBkmtQQRKniDXyXaalRVKLtYscBaGd$W7Ojqk1Q2iOJVeGL39RAsZTtfup3f1deSzvxrvC9rXA=</encrypted-card-number>\\n              <encrypted-security-code>$bsjs_1_0_3$MB1nBpok/YkuWPG1/7e6dyFFhDPHB8p8E9Yo+0YHHV+xkHuzFKr02wAnE8PJ8QCzWH+2ctXy5FN6wLKjwFrfTOgy0BJ9k9+NDEe8mhsu66wMlyc3lnwrbvMRCWN1O+5gUNCFExj7B0mDtf4gtxecXs74KZ5l5dbpGWdKUk5i7OewWyTqsONbn9taLfVBOwuIOy2Jgi4fx+yB8Q05KdZeHSNSBJh8H/47AUNAn5dM+d9iO6yGQB3obzEzzR3UtHlkGR52ZsgbbFh0JMm9lBM2ClgYM8jvmQjS9HX2ojt1fkbhuPEb1IY/M498a+1wDPpI4aMfDxO1lSpJneRSpY5k4g==$XaKq1NbPcS0iHy9N9jHekEIByHYS4G3wJXlC9EQjAGM=$BJn6X6mBYGUo8Eoq4RQz69gsi4Azl8jT973mNpG9Yuo=</encrypted-security-code>\\n              <card-type>VISA</card-type>\\n              <expiration-month>07</expiration-month>\\n              <expiration-year>2019</expiration-year>\\n            </credit-card>\\n          </credit-card-info>\\n        </credit-cards-info>\\n      </payment-info>\\n    </shopper-info>\\n  </shopper>\\n  <order>\\n    <ordering-shopper>\\n      <web-info>\\n        <ip>62.219.121.253</ip>\\n        <remote-host>www.merchant.com</remote-host>\\n        <user-agent>Mozilla/5.0 (Linux; X11)</user-agent>\\n      </web-info>\\n    </ordering-shopper>\\n    <cart>\\n      <cart-item>\\n        <sku>\\n          <sku-id>2152762</sku-id>\\n        </sku>\\n        <quantity>1</quantity>\\n      </cart-item>\\n    </cart>\\n    <expected-total-price>\\n      <amount>15.00</amount>\\n      <currency>USD</currency>\\n    </expected-total-price>\\n  </order>\\n</batch-order>\",\n      \"language\": \"xml\",\n      \"name\": \"Create Order and New Shopper Request: with encrypted card details\"\n    }\n  ]\n}\n[/block]\n<br>\n<a class=\"btn btn-primary\" href=\"#\" role=\"button\">Back to Top</a>","excerpt":"","slug":"client-side-encryption","type":"basic","title":"Client-Side Encryption"}

Client-Side Encryption


Client-side encryption refers to encrypting sensitive data (like the credit card number and security code) before sending it to your server. This enables you to drastically reduce your PCI compliance scope to SAQ A-EP. Client-side encryption can be easily implemented for web, Android, and iOS using a customized encryption library.

See:

How client-side encryption works

BlueSnap provides an encryption library for each platform: web, iOS, and Android. The encryption library uses your Client-Side Encryption key to encrypt sensitive payment fields like the credit card number and security code. The encryption is done on the checkout page on the client side device.

Encrypting payment information on the client side means that you don't have to handle sensitive data, because it is encrypted before it is sent to your server. This makes payments more secure and also reduces your PCI compliance burden.

Once you have the encrypted data on your server, you can then pass it on to BlueSnap for transaction processing via the Payment API. BlueSnap will use its private key to decrypt the data, process the transaction, and then send you information about the status of the transaction.

Implementing client-side encryption in your web form

Follow these steps in order to implement client-side encryption in your own web form:

Step 1: Add bluesnap.js and your public encryption key

Include the BlueSnap JavaScript library in your page, using this script:

<script src="https://gateway.bluesnap.com/js/cse/v1.0.3/bluesnap.js"></script>

The bluesnap.js resides on the BlueSnap server.

In a separate script tag under the first, create a new BlueSnap object and instantiate it with your public key:

<script>
var bluesnap = new BlueSnap
("YOUR_PUBLIC_KEY");
</script>

Replace YOUR_PUBLIC_KEY with your client-side encryption key. You can find it in the BlueSnap Merchant Console under Integration > BlueSnap API.

Note: You will need a BlueSnap account in order to get your public encryption key. If you don't have an account yet, you can sign up for one here.

Step 2: Set up your form to encrypt sensitive information

Add the 'data-bluesnap' attribute to the card number and security code fields in your checkout form. You can set the value of the data-bluesnap attribute to whatever you wish.

<div>
	<label for="creditCard">Card</label>
	<input type="text" placeholder="Enter Card" name="creditCard" id="creditCard" data-bluesnap="encryptedCreditCard">
</div>
<div>
	<label for="cvv">CVV</label>
	<input type="text" placeholder="Enter CVV" name="cvv" id="cvv" data-bluesnap="encryptedCvv">
</div>

In the same script tag where you instantiated the BlueSnap object, add code similar to the following in order to perform BlueSnap encryption once the shopper clicks the submit button:

<script>
  var bluesnap = new BlueSnap
  ("YOUR_PUBLIC_KEY");
  document.getElementById("submit-button").addEventListener("click", function(){
  bluesnap.encrypt("checkout-form");
  });
</script>

In bluesnap.encrypt("checkout-form"), above, checkout-form is the ID of the form. This tells the bluesnap.js library where to search for input fields with the data-bluesnap attribute.

What happens on submit?

This is what happens when the shopper clicks the submit button:

  1. Each of the fields with the data-bluesnap attribute is automatically encrypted on the client side.
  2. An HTML hidden input field is created for each of the encrypted fields. The name of the hidden input field is the value in the data-bluesnap attribute. The value of the hidden field is the encrypted string.
  3. An additional hidden field called ccLast4Digits is also generated. The value of this field is the last four digits of the credit card number (assuming that the credit card number field has a data-bluesnap attribute).
  4. The name attribute of the fields with the data-bluesnap attribute is removed, so that they will not be sent to your server.
  5. The hidden fields and the fields without the data-bluesnap attribute are posted to your server.

Following is an example of what would be posted to your server on submit:

Use POST, not GET

To reinforce security measures when using Client-side Encryption, use POST, not GET.
In addition, make sure not to store any sensitive information in cookies.

Example form

For an example of a checkout form after implementing client-side encryption, see: GitHub: Checkout-page-examples/BlueSnap_CheckoutForm_CSE_Tutorial.html

Step 3: Use the encrypted information when processing payments via the API

Once you have the encrypted card details, you can process payments as usual by including those details in your API requests. See Using encrypted data to process payments via the BlueSnap APIs .



Back to Top

Implementing client-side encryption in your iOS app

Follow the steps below to set up client-side encryption in your iOS app. The encryption process will occur directly on the client's iOS device.

  1. Download and extract the bluesnap-encrypter-ios.gz file from GitHub

  2. Drag the bluesnap-encrypter-ios folder into your project navigator in Xcode:

    • Check Copy items into destination group's folder
    • Check Create groups for any added folders

Configure X-Code for CSE

It's important to configure x-code for projects using CSE by activating Keychain Sharing.
Under your project settings, go to SharingKeychainOne Target, selection the Capabilities pane, and turn on KeyChainSharing

  1. Under your project settings, select the required Target, go to the Build Settings pane, under the the Linking section, go to Other Linker Flags and add the flag "-ObjC -all_load".

  2. Include the header file:
    #include "BlueSnapEncrypter.h"

  3. Initialize the encrypter object with your client-side encryption key, which you can find in the BlueSnap Merchant Console under Integration > BlueSnap API:
    NSString *publicKey=@"{your-public-key}"; BlueSnapEncrypter *encrypter = [[BlueSnapEncrypter alloc]initWithPublicKey:publicKey];

  4. Encrypt sensitive details, such as credit card number or cvv:
    NSString *secret = @“secret”; NSString *encrypted = [encrypter encryptText:secret];



Back to Top

Implementing client-side encryption in your Android app

Follow the steps below to set up client-side encryption in your Android app. The encryption process will occur directly on the client's Android device.

  1. Download this BlueSnap encryption library .jar file and add it to your Android application project:
    https://gateway.bluesnap.com/java/cse/v1.0.1/bluesnap-encrypter.jar

  2. In your Android project, configure the BlueSnap encrypter with your client-side encryption key, which you can find in the BlueSnap Merchant Console under Integration > BlueSnap API:
    BlueSnapEncrypter encrypter = new BlueSnapEncrypter("your-client-side-encryption-key");

  3. Call the encrypt method passing the sensitive payment data to be encrypted:
    String encryptedCreditCardNumber = encrypter.encrypt(4111111111111111); String encryptedSecurityCode = encrypter.encrypt(123);



Back to Top

Using encrypted data to process payments via the BlueSnap APIs

Once you have implemented client-side encryption, you will send the encrypted card number and security code in the encryptedCardNumber and encryptedSecurityCode properties. These properties are within the creditCard element in your requests. Note that you must include both of these properties in the request, or else you will receive an error message.

We recommend that you test client-side encryption with the API in the Sandbox environment.

Payment API Example

Here is an example of how you can send the encrypted card details in an Auth Capture request in the Payment API.

{
    "amount": 11,
    "recurringTransaction": "ECOMMERCE",
    "softDescriptor": "DescTest",
    "cardHolderInfo": {
        "firstName": "test first name",
        "lastName": "test last name"
    },
    "currency": "USD",
    "creditCard": {
        "expirationYear": 2019,
        "encryptedCardNumber": "$bsjs_1_0_3$B23uuxq8drUwOYZm3wZi+Qm69V5GPEt8PEio+Edwcm8akczQSK7odgLQH/Au+VqOCsGspW1Q9mPyQIzGLSZLVToAQVfq5C1ld+2ogIIsDL32Hd6IojboLyVlYT1FvPQoDyz19K6N0CUHh5uk0kCLuHSUyjvoJH38ojHZifbJSm/7S5vAtiuC3BJt2z8k9nauQaAXkbyoAYwrS1yDpqOt2k2lGhKcmdQ4ImDR0RL8m8xig6sFrki9oqo3Mju/M5r7wXXVTf7TMtWiQbzdfREOxKUnviXJZpncdHqVjj5GvPYun2qgopKVKr8F5+yd19TVW2gvA1kXBkXonFL9159Gxg==$zckJgo2i8jXDiAHwVVHBKypXFnWqF2e+6luBkmtQQRKniDXyXaalRVKLtYscBaGd$W7Ojqk1Q2iOJVeGL39RAsZTtfup3f1deSzvxrvC9rXA=",
        "encryptedSecurityCode": "$bsjs_1_0_3$MB1nBpok/YkuWPG1/7e6dyFFhDPHB8p8E9Yo+0YHHV+xkHuzFKr02wAnE8PJ8QCzWH+2ctXy5FN6wLKjwFrfTOgy0BJ9k9+NDEe8mhsu66wMlyc3lnwrbvMRCWN1O+5gUNCFExj7B0mDtf4gtxecXs74KZ5l5dbpGWdKUk5i7OewWyTqsONbn9taLfVBOwuIOy2Jgi4fx+yB8Q05KdZeHSNSBJh8H/47AUNAn5dM+d9iO6yGQB3obzEzzR3UtHlkGR52ZsgbbFh0JMm9lBM2ClgYM8jvmQjS9HX2ojt1fkbhuPEb1IY/M498a+1wDPpI4aMfDxO1lSpJneRSpY5k4g==$XaKq1NbPcS0iHy9N9jHekEIByHYS4G3wJXlC9EQjAGM=$BJn6X6mBYGUo8Eoq4RQz69gsi4Azl8jT973mNpG9Yuo=",
        "cardType": "VISA",
        "expirationMonth": "07"
    },
    "cardTransactionType": "AUTH_CAPTURE"
}

Extended Payment API Example

Here is an example of how you can send the encrypted card details in a Create Order and New Shopper request in the Extended Payment API.

<batch-order xmlns="http://ws.plimus.com">
  <shopper>
    <web-info>
      <ip>62.219.121.253</ip>
    </web-info>
    <shopper-info>
      <shopper-currency>USD</shopper-currency>
      <store-id>4677</store-id>
      <locale>en</locale>
      <shopper-contact-info>
        <title>Mr.</title>
        <first-name>John</first-name>
        <last-name>Doe</last-name>
        <email>jdoe@johndoeandsons.com</email>
        <company-name>JohnDoeAndSons</company-name>
        <address1>138 Market st</address1>
        <city>San Francisco</city>
        <zip>756543</zip>
        <state>CA</state>
        <country>US</country>
        <phone>1413555666</phone>
        <fax>1413555666789</fax>
      </shopper-contact-info>
      <payment-info>
        <credit-cards-info>
          <credit-card-info>
            <billing-contact-info>
              <first-name>John</first-name>
              <last-name>Doe</last-name>
              <address1>138 Market st</address1>
              <city>San Francisco</city>
              <zip>756543</zip>
              <state>CA</state>
              <country>US</country>
            </billing-contact-info>
            <credit-card>
              <encrypted-card-number>$bsjs_1_0_3$B23uuxq8drUwOYZm3wZi+Qm69V5GPEt8PEio+Edwcm8akczQSK7odgLQH/Au+VqOCsGspW1Q9mPyQIzGLSZLVToAQVfq5C1ld+2ogIIsDL32Hd6IojboLyVlYT1FvPQoDyz19K6N0CUHh5uk0kCLuHSUyjvoJH38ojHZifbJSm/7S5vAtiuC3BJt2z8k9nauQaAXkbyoAYwrS1yDpqOt2k2lGhKcmdQ4ImDR0RL8m8xig6sFrki9oqo3Mju/M5r7wXXVTf7TMtWiQbzdfREOxKUnviXJZpncdHqVjj5GvPYun2qgopKVKr8F5+yd19TVW2gvA1kXBkXonFL9159Gxg==$zckJgo2i8jXDiAHwVVHBKypXFnWqF2e+6luBkmtQQRKniDXyXaalRVKLtYscBaGd$W7Ojqk1Q2iOJVeGL39RAsZTtfup3f1deSzvxrvC9rXA=</encrypted-card-number>
              <encrypted-security-code>$bsjs_1_0_3$MB1nBpok/YkuWPG1/7e6dyFFhDPHB8p8E9Yo+0YHHV+xkHuzFKr02wAnE8PJ8QCzWH+2ctXy5FN6wLKjwFrfTOgy0BJ9k9+NDEe8mhsu66wMlyc3lnwrbvMRCWN1O+5gUNCFExj7B0mDtf4gtxecXs74KZ5l5dbpGWdKUk5i7OewWyTqsONbn9taLfVBOwuIOy2Jgi4fx+yB8Q05KdZeHSNSBJh8H/47AUNAn5dM+d9iO6yGQB3obzEzzR3UtHlkGR52ZsgbbFh0JMm9lBM2ClgYM8jvmQjS9HX2ojt1fkbhuPEb1IY/M498a+1wDPpI4aMfDxO1lSpJneRSpY5k4g==$XaKq1NbPcS0iHy9N9jHekEIByHYS4G3wJXlC9EQjAGM=$BJn6X6mBYGUo8Eoq4RQz69gsi4Azl8jT973mNpG9Yuo=</encrypted-security-code>
              <card-type>VISA</card-type>
              <expiration-month>07</expiration-month>
              <expiration-year>2019</expiration-year>
            </credit-card>
          </credit-card-info>
        </credit-cards-info>
      </payment-info>
    </shopper-info>
  </shopper>
  <order>
    <ordering-shopper>
      <web-info>
        <ip>62.219.121.253</ip>
        <remote-host>www.merchant.com</remote-host>
        <user-agent>Mozilla/5.0 (Linux; X11)</user-agent>
      </web-info>
    </ordering-shopper>
    <cart>
      <cart-item>
        <sku>
          <sku-id>2152762</sku-id>
        </sku>
        <quantity>1</quantity>
      </cart-item>
    </cart>
    <expected-total-price>
      <amount>15.00</amount>
      <currency>USD</currency>
    </expected-total-price>
  </order>
</batch-order>