LogoLogo
NymCardAPI catalogContact usnFront catalog
  • NYMCARD DOCUMENTATION
  • Get Started
    • nCore API Quick Tutorial
    • API Core Principles
    • Program management
      • Manage documents by APIs
      • User KYB process
      • Necessary parameters per user type
      • User ID verification by SDK
      • User KYC process
    • Issuance
      • Users
      • Cards
    • Issuing Physical Cards
      • Individual card issuance
      • Bulk card issuance
      • Card fulfillment
      • Card PIN management
      • Card replacement
      • Proxy number usage
    • Issuing Virtual Cards
      • Migration of virtual to physical card
    • Funding and transfers
      • Funding
      • Internal funding source
      • External funding source
        • From card
        • From bank account
        • Lean API flow
        • DAPI direct API flow
      • Transfers
      • Western Union APIs
      • Checkout widget
    • Product Management
      • Card product
      • Balance limits
      • Velocity limits
      • Fees
      • Charges
      • Multi-currency
      • Authorization controls
        • Enhancements for MCC list management
    • Transactions
      • Payment ecosystem
      • Transaction lifecycle
      • Transaction types
      • Transaction endpoints scenarios
      • Multi-clearing process
    • Webhooks
      • Introduction to webhooks
      • nCore webhook events
      • Steps to configure a webhook
      • Webhooks samples
      • Webhook changes for simulation
      • Webhooks management
    • Security
      • PCI widget
      • 3D Secure
      • OTP SMS templates
    • Release announcements
      • Embedded Lending Release Notes
      • Changes in the release on 13/07/2023
      • Changes in the release on 23/05/2023
      • Changes in the release on 04/04/2023
  • For developers
    • nCore API catalog
    • nFront API catalog
Powered by GitBook
On this page
  • Introduction
  • Checkout widget usage
  • Loading Funds from already added card
  • Loading Funds using new card
  • Deleting already added card

Was this helpful?

  1. Get Started
  2. Funding and transfers

Checkout widget

PreviousWestern Union APIsNextProduct Management

Last updated 1 day ago

Was this helpful?

This functionality is deployed only on staging at the moment.

Introduction

Checkout is a payment gateway designed for processing debit and credit card payments online, offering access to local payment methods through global payment platforms. NymCard has integrated with Checkout, enabling users to transfer funds from their debit or credit cards to their NymCard wallet.

This document describes the Checkout widget, which allows non-PCI-compliant customers to securely collect and submit card details. It supports the following functionalities:

  • Users can manually input the card number and other required details.

  • The widget can read card details from an image for seamless data entry.

Checkout widget usage

In order to open the Checkout widget, take the following steps:

  1. Perform “” API. LUT is a limited usage token, which expires after 10 minutes after being created. Each LUT will work for 10 requests. For creating LUT you need to fill the following parameters:

  • 'source_id' - put "default_pci_source" here

  • ‘operation’ - put "CHECKOUT_TOKEN" here

Below there is an example of request:

curl -X POST "https://{env_url}/v1/orders/users/{id}:createLut" \
          -H "Content-Type: application/json" \
          --header "ApiKey: tenant1-key" \
          -d '{
            "source_id": "default_pci_source",
            "operation": "CHECKOUT_TOKEN"
          }'

Response sample:

{"token":"SMJXdC/sCRogr0K7fuMz0/6QFLBDLglA2rCeZAPgS9Rb04L/BW3mYXkY2L4nab8b"}

2. Encode token together with ‘cardId’ and 'userId', values using Base64 encryption format.

Below you can find an example of data which should be encoded:

{ "token":"4hNuBSoaezq+KygTkjjihvLtzQMcNZc/pvQbTDd/bXJDDqi0wHli32aPqUd6mcnf",
"userId":"Sunny_25APRIL_DevEnv_0000",
"cardId":"muhaycheckoutAEDCardAccount07MAY25"}

3. Take the following URL and add base64 encrypted token to it. Below you can see an example:

https://{widget_url}/cards/eyAidG9rZW4iOiJJTjlmVlpuQmlxV1dvcHgvbmlIWGo5Qi9mRnk4ckJyamYvTC9WYkR5MkJQMnArcWNkTnpUMGZlRHp5R2grZHZCIiwidXNlcklkIjoiU3VubnlfMjVBUFJJTF9EZXZFbnZfMDAwMCIsImNhcmRJZCI6Im11aGF5Y2hlY2tvdXRBRURDYXJkQWNjb3VudDA3TUFZMjUifQ==

4. The mobile app will need to create an iframe to display the widget inside a native view. Below you can find an example code (please adapt it to your own standards/code):

For iOS (Swift/Objective-C):

let webView = WKWebView(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: self.view.frame.size.height))
let url = URL(string: "https://your-widget-url.com")!
let request = URLRequest(url: url)
webView.load(request)
self.view.addSubview(webView)

For Android (Java/Kotlin):

WebView webView = new WebView(this);
webView.loadUrl("https://your-widget-url.com");
setContentView(webView);

5. The checkout widget will be loaded. Below you can find two flows for performing checkout payments:

  • Using existing saved card details

  • Using the card details of a newly-created card

Loading Funds from already added card

Take the following steps:

  1. Select the Receiver Card and call the checkout widget.

  2. Widget will display the list of already added cards. Select the necessary card and click Confirm:

  1. Enter money amount which you want to transfer, select the way how the fee will be deducted (Deduct from amount or Charge from the card) and click Pay Now:

  1. If 3DS setting is set as true, then you will get screen where you can enter the OTP code:

  1. After that you will receive a message about a successful operation.

Loading Funds using new card

Take the following steps:

  1. Select the Receiver Card and call the checkout widget.

  2. Widget will display the list of already added cards together with Add a new card button. Click on it:

  1. Enter such card details, as Card number, expiry, CVV, cardholder name. Activate Save card details toggle button to save details for further payments. Click Confirm button:

  1. Enter money amount which you want to transfer, select the way how the fee will be deducted (Deduct from amount or Charge from the card) and click Pay now:

  1. If 3DS setting is set as true, then you will get screen where you can enter the OTP code:

  1. After that you will receive a message about a successful operation.

Deleting already added card

If you want to delete already added card, take the following steps:

  1. Select the Receiver Card and call the checkout widget.

  2. Widget will display the list of already added cards. Click on the Bin icon next to the card which you want to delete:

  1. Confirm the deletion by clicking the Remove button:

After that you will receive a message about a successful deletion.

Create LUT