Lite SDK (Payment)

Overview

With the Lite version of the Yuno SDK, you have full control of your own payment experience. The main difference with the full SDK integration is that this version allows merchants to consult a service that will provide a list of the payment methods they have available for payment and enrollment. With this information, the merchants have control of which payment methods they want to show to the user in the checkout and enroll to their platform, but after a payment method is selected, the workflow remains the same for both SDK implementations. This particular implementation of the SDK allows you to:

• Create Payments
• Enrollment payment methods for future payments

---

Payment Workflow

Step 1: Create a customer

The first step of the payment flow is to create a customer. A customer will have payment methods associated, this is why it is important. You can create a customer using the Create Customer Endpoint. As a result, you will receive the id of the customer that was created in the Yuno DB.

If you have created a customer that is going to pay previously you can skip this step.

Step 2: Create a checkout session

You use checkout sessions to create payments. You will create a new checkout session every time you make a payment. With a checkout session, you will have access to all payment methods available for that customer (both previously enrolled or not) to make a purchase, which you can then offer to your customers.

You can create it using Checkout Session Endpoint. To create a new checkout session, you will need the customer id, generated when you created the customer on the Yuno system. This endpoint will provide the checkout session id that you can use for your payment.

Once you have performed the first two steps, you will need to implement one of our SDKs to continue the payment flow.

Step 3: Display payment methods

Query the available payment methods you have enabled via the Yuno integration by making a GET call to the Retrieve Payment Methods endpoint using the checkout_session created in the previous step.

Display the available payment methods retrieved in the last step to the customer. Here the users will select the payment method they want to pay within your platform. By using SDK Lite, the merchant is responsible for displaying the payment methods and capturing the customer's selection.

Step 4: Implement the SDK and obtain the One Time Token

In this step, you will have to initialize Yuno's SDK with your API credentials and the checkout session previously created in step two. Below you will find a checklist to initialize the Yuno SDK:

Checklist

1. Include the library in your project.
2. Initialize SDK with the public key.
3. Start the checkout process. Configure SDK by calling the function yuno.startCheckout() with the desired configuration.
4. Mount the SDK in Web or add the view in Mobile to display the checkout to your user. Once your user selects a payment method, proceed with step 5.
5. You must create a payment button on your front end. When the user clicks the payment button, begin the payment process by calling the function yuno.startPayment().

• If needed, the SDK will collect the additional payment information. This can include, card information or the customer payer information, required by the provider. (email, phone number, document, etc).

6. Once this process is completed, the SDK will provide a One-Time-Token in the callback function yunoCreatePayment(). This function must be defined when you configure the SDK in the function yuno.startCheckout().

For more detailed information on how to initiate Yuno's SDK please refer to one of the following sections according to the corresponding platform:

Step 5: Create the payment

Once you have completed the first three steps, you can create a payment. A payment gathers all crucial details regarding the order, customer specifics, total amount, currency, products, shipping details, and more. You can create it using Create Payment endpoint, please consider that you will have to send the one_time_token obtained in the previous step in order for the payment to work.

Note:

The response of the payment endpoint will provide an important parameter called sdk_action_required.

• When the selected payment method is synchronous, the API response will provide the final payment status. In this scenario, the field sdk_action_required in the API response will be false. The payment process concludes at this step.

• For asynchronous payment methods, additional action via the SDK will be necessary. This will be indicated by the API through the field sdk_action_required in the response, which will be set to true.

Step 6: Continue Payment

If in the response of the create payment you receive the parameter sdk_action_required set to true, you will need to invoke the Full SDK again, you can do this using the function continuePayment. Calling this function will display the additional screens or steps the customer needs to perform in order to complete the payment.

We recommend incorporating the method continuePayment from the SDK after creating the payment. This is because certain asynchronous payment methods demand additional action from the customer for completion.

Step 7: Get Payment Status

Call the function yunoPaymentResult() to obtain the payment status. Once you have this status you can use it to show your user the corresponding screen depending on the final result of the payment.

Step 8: Receive the payment result through a webhook

We also recommend configuring Webhooks in your Yuno dashboard. Webhooks are the best way to ensure your system is up-to-date with payment progress and status. Since the event notifications trigger automatically, your system won't need to perform recurrent requests to Yuno.

For more detailed information on how to initiate Yuno's SDK please refer to one of the following sections according to the corresponding platform:

---

Enroll a credit card with a payment

Yuno enables you to save a credit/debit card for future purchases with the same payment request without having to integrate the enrollment integration. There are several ways to obtain a vaulted token:

• Set the parameter vault_on_sucess = true in the Create Payment Endpoint. In the payment response, you will receive the vaulted_token that corresponds to the card used by the customer payer.
• You can also set the function cardSaveEnable = true in the SDK to display a checkbox for the user to select if he wants to save the card for future purchases. If the user checks the box in the response of the payment you will receive the vaulted_token that corresponds to the card used by the customer payer.

Note: Please only use one of the two options to enroll a card.

For alternative payment methods please refer to the following link.

After the payment is made, the user will have the credit card available for future purchases and you can see the detailed information by using one of the following services:

• Get payment methods by checkout session
• Get payment methods by customer

---

Payment workflow with Vaulted Token

After the user has enrolled in one of the available payment methods, a payment can be processed back-to-back using the vaulted_token obtained during enrollment. This eliminates the need to request further information from the user.

Step 1: Create a checkout session

Use the customer ID of an existing customer to create a Checkout Session. To create a new checkout session, you will need the customer id, generated when you created the customer on the Yuno system. This endpoint will provide the checkout session id that you can use for your payment.

Step 2: Display enrolled payment methods

Query the available payment methods you have enabled via the Yuno integration by making a GET call to the Retrieve Payment Methods endpoint using the checkout_session created in the previous step.

Display the available payment methods retrieved in the last step to the customer. Here the users will select the payment method they want to pay within your platform. By using SDK Lite, the merchant is responsible for displaying the payment methods and capturing the customer's selection.

Once you have performed the first two steps, you will need to implement one of our SDKs to continue the payment flow.

Step 3: Create the payment

Once you have completed the first three steps, you can create a payment. A payment gathers all crucial details regarding the order, customer specifics, total amount, currency, products, shipping details, and more. You can create it using Create Payment endpoint, please consider that you will have to send the one_time_token obtained in the previous step in order for the payment to work.

Step 4: Receive the payment result through a webhook

We also recommend configuring Webhooks in your Yuno dashboard. Webhooks are the best way to ensure your system is up-to-date with payment progress and status. Since the event notifications trigger automatically, your system won't need to perform recurrent requests to Yuno.

Step 5: Payment status (Optional)

Use the Status Function, which is an SDK function, to display the payment result to the customer.