Save Cards and Addresses
You can use the Payments Checkout to store your customer's credit card and address information, which you can then use for their future transactions. This takes two easy steps:
- Create a profile for your customer.
- Using the customerId in the Payments Checkout response (or the id, if you use an API call), create a single-use customer token. When you then use this single-use customer token as the singleUseCustomerToken parameter in the Payments Checkout, any card and address information associated with the customer will be displayed on your Checkout page.
The customer can save a card by clicking on 'save my card for future transactions'. However, this card will only be saved if the customer completes a Payment in the same session.
Creating a Customer Profile
To use this functionality, the merchant needs to first create a customer profile with Paysafe. There are two ways to create a customer profile:
- Create the profile in a Payments Checkout request.
- Create the profile using the API request to create a customer.
Paysafe recommends that you use the Payments Checkout request to create a customer profile if you are integrating with Paysafe Payments Checkout.
Create the Profile in the Payments Checkout Request
When you create a payment handle with the Payments Checkout, the resultCallback is returned, which contains the customerOperation parameter.
If the customer selected the saveCard option in the Checkout while doing their payment, then the customerOperation parameter returned in the resultCallback will have the value set to ADD.
The saveCard option is presented by default by Paysafe in the Checkout.
In the case where customerOperation has the value of ADD, then the merchant must include an additional parameter along with the rest of the request payload when processing a Payment request – either the merchantCustomerId parameter or the customerId parameter.
If the merchant has never created a customer entity for this customer, they would include CustomerId with a value the merchant has stored for that customer.
Request Body :
{
...
"merchantCustomerId": "user1"
}
In the case of a successful payment request with either of these added parameters, two new parameters are then returned in the response:
- customerId – a customer profile
- multiUsePaymentHandleToken – a multi-use payment handle
Response Body :
{
...
"customerId": "ccb24e28-6e38-47ce-8815-94706c5b608c",
"multiUsePaymentHandleToken": "uyfiuewyrw273uw"
}
If the merchant provided their own customer information for the merchantCustomerId parameter (and not a unique id from a customer creation request), then they need store the value for the customerId parameter in the response in order to use it as the customer_id value in customer-related requests that require it, like updating a customer or adding an address to a customer.
The multiUsePaymentHandleToken returned in the response to this payment request would be the equivalent of the paymentHandleToken returned in the response when you create a payment handle for a customer, and used for the same purposes.
Create the Profile Using the Customer API
The second way to create a customer profile is by using the API request to Create a Customer. The merchant should then store the unique id provided in Paysafe's response as the customer_id for that user in customer-related requests that require it.
Response Body :
{
...
"id": "ccb24e28-6e38-47ce-8815-94706c5b608c"
}
Either of these methods allow you to create a customer profile for a user – just be sure to save the corresponding customer ID in your database for that user.
Creating a Single-Use Customer Token
The Checkout can display existing cards and addresses for a user. To use this functionality, the merchant needs to make use of the customer ID and make an API call to create a single-use customer token. The single-use customer token in the response should then be provided as the value for singleUseCustomerToken in the Checkout options while invoking the Checkout. In this case, when the checkout is loaded, the user would be able to see their saved payment details.
Two steps are involved:
- Create a Single-Use Customer Token.
Make an API call to create a single-use customer token, using the customer ID for that user. This generates a single-use customer token – the field singleUseCustomerToken in the response – which is valid for 15 minutes. - Use the singleUseCustomerToken field from the response in step 1 above and provide this value for the singleUseCustomerToken parameter in the Checkout options.
Request Body :
{
...
"singleUseCustomerToken": "SPFAB1cA5iwdu48H"
}
<html>
<head>
<script src="https://hosted.test.paysafe.com/checkout/v2/paysafe.checkout.min.js"></script>
</head>
<body>
<button onclick="checkout()"> Pay $25 </button>
</body>
<script>
function checkout() {
paysafe.checkout.setup("API Key", {
"currency": "USD",
"amount": 10000,
"singleUseCustomerToken": "SPFAB1cA5iwdu48H",
"locale": "en_US",
...
}
}
</script>
</html>
In the case where a customer ID already exists for a customer, then the parameter merchantCustomerId should not be passed in the Payment Request.
Save Cards for Play+ (Sightline) Deposits
Additional notes on Save Cards feature in Play+ Deposit:
- The customer can save a card in Play+ deposit (load funds) flow by clicking on 'save my card for future transactions'. However, this card will only be saved if the customer completes a Payment using Play+ wallet balance after the deposit in the same session.
- If the customer makes multiple deposits using multiple cards and then makes a payment, the last card used to make the deposit is the one that will be saved.
- When a customer makes a Play+ deposit but uses a different payment method to complete the payment, the card used to make the deposit will not be saved.
- The save card feature is available in Play+ Deposit and Card Payment. If the customer saves a card in Play+ deposit screen, it will be reflected in the Card Payment screen and vice-versa.