Full SDK
With Yuno Full SDK, you can seamlessly integrate Yuno into your system. This approach simplifies integration, maintenance, and operations without requiring additional compliance work.
Key features
- User experience: Yuno manages the entire checkout process.
- Customization: Configure payment methods and UI elements directly from Yuno's dashboard.
- Flexibility: Add new payment methods and features without extra development.
- Single integration: Support multiple payment methods through a single implementation, regardless of the customer's chosen method.
What you can do with the full SDK
- Process payments seamlessly.
- Enroll a credit card while processing a payment.
- Use a vaulted token from an enrolled payment method.
Follow the step-by-step guides below to integrate the full SDK:
Payment workflow
The Full SDK provides a unified payment experience, allowing customers to complete transactions using multiple payment methods within a single integration. The diagram below illustrates the complete process:
Step 1: Create a customer
If your system does not already have a customer_id
, you must create one to associate payment methods with the customer.
- Use the Create customer endpoint to generate a new
customer_id
. - If no customer session is used, the payment process will proceed without stored user data (e.g., pre-filled fields or saved payment methods).
Note: Skipping the customer session simplifies integration but removes features that enhance conversion rates by reducing checkout friction.
Omit customer session step
When you choose to not use a customer_session
, the payment will be created without a customer id
, leaving it empty when creating the payment. As a result, the process will not use any stored customer date, such as pre-filled form fields or saved payment details.
While skipping the customer session can simplify integration, it removes features designed to streamline the user experience, which can improve conversion rates by reducing friction during checkout.
Step 2: Create a checkout session
Each payment requires a new checkout session, which grants access to all available payment methods for a specific customer.
- Use the Create checkout session endpoint.
- Provide the
customer_id
to retrieve a newcheckout_session
.
Step 3: Implement the SDK and retrieve a one-time token
The Full SDK displays all available payment methods and collects additional customer details if required.
To initialize the SDK:
- Include the SDK library in your project.
- Initialize it with your API credentials and
checkout_session
. - Call
yuno.startCheckout()
to launch the checkout process. - Display the checkout interface in a browser or mobile app.
- Add a payment button that calls
yuno.startPayment()
when clicked.
During this process, the SDK may collect customer details such as card information, email, phone number, or document ID.
After a successful initialization, the SDK returns a one-time token (OTT) via the yunoCreatePayment()
callback function.
For platform-specific SDK setup, refer to:
Step 4: Create the payment
With the one-time token, create the payment. This process gathers all order details, including customer specifics, total amount, currency, products, and shipping details. Use the Create payment endpoint, informing the one_time_token
in the payment_method.token
attribute.
The response from Create payment will include the sdk_action_required
, which defines if additional actions are required based on the payment type:
- Synchronous payment: If
sdk_action_required
isfalse
, the payment is complete. - Asynchronous payment: If
sdk_action_required
istrue
, additional actions are required to complete the payment. Use thecontinuePayment
function to complete the payment. See the instructions in Step 5.
Status
During integration, use the payment status
and sub_status
as your primary reference for the payment's state. Since a payment might have multiple associated transactions, concentrating on the payment status
/sub_status
ensures you're informed of the most recent state. This provides a clear basis for decision-making regardless of the number of transactions involved.
Step 5: Continue payment (if needed)
If sdk_action_required
is true
, call continuePayment()
to display additional screens or steps for the customer.
Yuno recommends implementing continuePayment()
since some asynchronous payment methods require customer actions to finalize the transaction.
Step 6: Get payment status
Call the yunoPaymentResult()
function to obtain the payment status
. Based on the status, you can show your customer the corresponding screen depending on the final result of the payment.
Step 7: Receive payment result through webhook
Yuno recommends configuring webhooks in your dashboard. Webhooks ensure your system remains updated with payment statuses in real-time, removing the need for manual status checks.
Payment workflow using a vaulted token
If a customer has an enrolled payment method, they can use a vaulted token from the enrollment process to complete transactions without entering payment details again.
This workflow follows the same steps as the payment workflow, but instead of collecting new payment details, the SDK retrieves the stored vaulted token:
- Create a checkout session.
- Implement the SDK and retrieve a one-time token, using the vaulted token.
- Create the payment.
- Continue payment (if needed).
- Retrieve payment status.
- Receive payment result via webhook.
For these steps, follow the guidelines in the payment workflow.
Enroll a credit card while paying
With the Full SDK, you can save credit/debit cards for future purchases with the same payment request without the enrollment integration. You can obtain the vaulted token in two ways:
- Via API: Set
vault_on_success = true
when using the Create payment endpoint. You will receive thevaulted_token
that corresponds to the card used by the customer payer in the response. - Via SDK settings: Set
cardSaveEnable = true
in the SDK complementary features (Web, iOS, Android, and Flutter). The SDK will display a checkbox for users to select if they want to save the card for future purchases. If the user checks the box, you will receive thevaulted_token
.
You should only use one option to enroll a card.
To enroll alternative payment methods, you have to use the Lite SDK.
After enrolling a payment method, you can use the vaulted token to perform payments. To access information about the payment methods enrolled by each user, you can use one of the following endpoints:
Using a vaulted token
Even if the user selects an enrolled payment method, Yuno recommends using the SDK to tokenize the information instead of directly using the vaulted token with Yuno's API. This approach provides several benefits:
- Support 3DS: Enhanced security for online payments.
- Fraud Screening: Better protection against fraudulent transactions.
- Collect Required Information: Gather additional fields required by the provider if necessary.
Using a vaulted token
Even if the user selects an enrolled payment method, Yuno recommends using the SDK to tokenize the information instead of directly using the vaulted token with Yuno's API. This approach provides several benefits:
- Support 3DS: Enhanced security for online payments.
- Fraud Screening: Better protection against fraudulent transactions.
- Collect Required Information: Gather additional fields required by the provider if necessary.
Updated 8 days ago