BlueSnap.comDeveloper DocsShopper SupportStatusTalk to Sales

Embedded Checkout FAQs

Suggest Edits

What is Embedded Checkout?

This solution uses a secure form to capture and tokenize your shopper's payment data, so sensitive data never touches your environment. When your shopper completes their purchase, you’ll include the token in the API request to complete the transaction.

Visit our Embedded Checkout Guide for full implementation details.

What credentials do I need to use Embedded Checkout?

You need a BlueSnap account and API credentials. Every API request must be authenticated using a HTTP Basic Authentication header, as follows:
Authorization: Basic {Base64 encoding of 'username:password'}

Refer to Authentication & Headers for more information.

Does the Embedded Checkout script require jQuery?

No. Our solution does not require jQuery. You can use our solution using plain JavaScript. However, you can use jQuery, or JS frameworks like AngularJS and React if you want to.

How can I create an Embedded Checkout token?

Send a server-to-server POST request to:
BLUESNAPDOMAINPATH/services/2/payment-fields-tokens, where BLUESNAPDOMAINPATH is either:

  • Sandbox: https://sandbox.bluesnap.com
  • Production: https://ws.bluesnap.com

The response provides the token in the location header.
For example:
BLUESNAPDOMAINPATH/services/2/payment-fields-tokens/HOSTEDFIELDTOKENID

Can I reuse the Embedded Checkout token?

For each session, you need to create a new token using the Create Token request. The token expires 60 minutes after creation. Within these 60 minutes, you can do the following:

  1. Client-side — Call bluesnap.submitCredentials to submit the shopper's payment details to BlueSnap and bind them to the token. This function can be called as many times as necessary during the 60 minutes, and before sending the token in a request from your server to BlueSnap.

  2. Server-side — After the shopper's card details are associated with the token (assuming the token has not yet expired), you can send the token in a request to BlueSnap to either submit the payment for processing or save the payment information to a shopper. After the token is successfully submitted in a request to BlueSnap, it expires and cannot be used again in another request.

How can I replace the Embedded Checkout token?

Simply call bluesnap.hostedPaymentFieldsCreation with the new token and the BlueSnap object (bsObj).

How do I create or update a vaulted shopper with the Embedded Checkout token?

To create or update a vaulted shopper with the token, include pfToken inside paymentSources > creditCardInfo.

For code samples, refer to our Developer documentation:

Can I change the placeholder text inside the Embedded Payment Form?

Yes. Inside the BlueSnap object, you can change the placeholder text.

For example: 

var bsObj = {
  ... 
  ccnPlaceHolder: "4111 1111 1111 1111",
  cvvPlaceHolder: "123", 
  expPlaceHolder: "MM/YY"
};

Back to Top

Updated 4 months ago