Checkout flow - Onramp

4min
To open payment page directly with widget and to skip the quotation page, follow below steps.
Create order via api and keep the orderID which you have received in api response.
Initialize widget with orderID received in step 2.
Step 1: 
JS
curl --location --request POST 'https://stg.api.onmeta.in/v1/orders/create' \
--header 'Accept: application/json' \
--header 'x-api-key: string' \
--data-raw '{"buyTokenSymbol":"string","chainId":"string","fiatCurrency":"string","fiatAmount":"string","buyTokenAddress":"string","receiverAddress":"string"}'
curl --location --request POST 'https://stg.api.onmeta.in/v1/orders/create' \
--header 'Accept: application/json' \
--header 'x-api-key: string' \
--data-raw '{"buyTokenSymbol":"string","chainId":"string","fiatCurrency":"string","fiatAmount":"string","buyTokenAddress":"string","receiverAddress":"string"}'
﻿
Note: you need to have auth token to call create order api as above else you will receive 401 Unauthorized error.
﻿
Response :
JS
{
    "success": true,
    "data": {
        "orderId": "989073230",
        "pgOrderId": "1212121",
        "upiCode": "",
        "redirect_actions": {
            "qr_checkout_string": "...",
            "deepLinks": [
                {
                    "name": "Phonepe",
                    "url": "...",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/Phonepe_53UkYwiQw.svg"
                },
                {
                    "name": "Google Pay",
                    "url": "....",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/gpay_cQIoYpPHF.svg"
                },
                {
                    "name": "Paytm",
                    "url": "...",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/paytm_OWArcqFdy.svg"
                },
                {
                    "name": "Others",
                    "url": "..",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/bhim_t366jHPDh.svg"
                },
                {
                    "name": "QR",
                    "url": "..",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/bhim_t366jHPDh.svg"
                }
            ]
        }
    },
    "error": {}
}
{
    "success": true,
    "data": {
        "orderId": "989073230",
        "pgOrderId": "1212121",
        "upiCode": "",
        "redirect_actions": {
            "qr_checkout_string": "...",
            "deepLinks": [
                {
                    "name": "Phonepe",
                    "url": "...",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/Phonepe_53UkYwiQw.svg"
                },
                {
                    "name": "Google Pay",
                    "url": "....",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/gpay_cQIoYpPHF.svg"
                },
                {
                    "name": "Paytm",
                    "url": "...",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/paytm_OWArcqFdy.svg"
                },
                {
                    "name": "Others",
                    "url": "..",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/bhim_t366jHPDh.svg"
                },
                {
                    "name": "QR",
                    "url": "..",
                    "imageUrl": "https://ik.imagekit.io/z3vwasz5xwz/Meta_widget/Payment_icons/bhim_t366jHPDh.svg"
                }
            ]
        }
    },
    "error": {}
}
﻿
Step 2: 
JS
<script src="https://stg.platform.onmeta.in/onmeta-sdk.js"></script>
<div id="widget"></div>

<script>
      let createWidget = new onMetaWidget({
        elementId: "widget",
        apiKey: "bujbw93003j4",
        userEmail: "[email protected]",
        onRamp: "enabled",
        fiatType: "inr",
        fiatAmount: 100, //needs to be same as create order value
        orderId: "6496b1f3dbde72d010890d84", // orderId from step 1
        walletAddress: "", 
      });
</script>
<script src="https://stg.platform.onmeta.in/onmeta-sdk.js"></script>
<div id="widget"></div>

<script>
      let createWidget = new onMetaWidget({
        elementId: "widget",
        apiKey: "bujbw93003j4",
        userEmail: "test@test.com",
        onRamp: "enabled",
        fiatType: "inr",
        fiatAmount: 100, //needs to be same as create order value
        orderId: "6496b1f3dbde72d010890d84", // orderId from step 1
        walletAddress: "", 
      });
</script>
﻿
once you pass orderID to widget Initialisation params, it will fetch order details and load the widget with prefilled data and take user directly to payment page.
Updated 02 Dec 2023
Did this page help you?
Steps to integrate custodial wallet (Offramp)
SDK integration