---
title: "Web Drop-in"
description: "Add UPI to your Drop-in integration."
url: "https://docs.adyen.com/payment-methods/upi/web-drop-in"
source_url: "https://docs.adyen.com/payment-methods/upi/web-drop-in.md"
canonical: "https://docs.adyen.com/payment-methods/upi/web-drop-in"
last_modified: "2026-05-24T12:54:31+02:00"
language: "en"
---

# Web Drop-in

Add UPI to your Drop-in integration.

[View source](/payment-methods/upi/web-drop-in.md)

How you add UPI depends on your integration.

Choose the [server-side flow](/online-payments/build-your-integration) that your integration uses:

## Sessions flow Drop-in

### Drop-In-Before-You-Begin

## Requirements

| Requirement          | Description                                                                                                                                                           |   |
| -------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------- | - |
| **Integration type** | Make sure that you have an existing Sessions flow [Web Drop-in integration](/online-payments/build-your-integration/sessions-flow?platform=Web\&integration=Drop-in). |   |
| **Checkout API**     | Make sure that you use Checkout API v68 or later.                                                                                                                     |   |
| **Setup steps**      | Before you begin, [add UPI in your Customer Area](/payment-methods/add-payment-methods).                                                                              |   |

### Drop-In-Add-Parameters-Sessions-Request

## Add additional parameters to your /sessions request

You do not need to add any parameters when you [create a payment session](/online-payments/build-your-integration/sessions-flow?platform=Web\&integration=Drop-in#create-a-payment-session).

### Drop-In-Import-Optional

## Import UPI (optional)

When you [import Adyen Web](/online-payments/build-your-integration/sessions-flow?platform=Web\&integration=Drop-in#get-adyen-web), you can optionally import individual payment methods to optimize performance by using [tree shaking](https://developer.mozilla.org/en-US/docs/Glossary/Tree_shaking). To do this, include `UPI`.

**Import**

```javascript
import { AdyenCheckout, Dropin, Upi } from '@adyen/adyen-web';
```

### Drop-In-Add-Configuration

## Add additional configuration for UPI

You do not need to add any configuration parameters for UPI.

### Drop-In-Test-And-Go-Live

## Test and go live

Depending on your account setup, you may have access to the UPI simulator which you can use to test your UPI integration. Contact your Account Manager or our [Support Team](https://ca-test.adyen.com/ca/ca/contactUs/support.shtml?form=other) if you have questions about the simulator.

You can also use your personal account on a UPI app to test your integration by making live payments with a low value.

## Advanced flow Drop-in

### Drop-In-Before-You-Begin

## Requirements

| Requirement          | Description                                                                                                                                                                                                                   |   |
| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | - |
| **Integration type** | Make sure that you have an existing Advanced flow [Web Drop-in integration](/online-payments/build-your-integration/advanced-flow?platform=%7B%7BgetParameter%28%27platform%27%29%7D%7D\&integration=Drop-in).                |   |
| **Action handling**  | Make sure that your existing integration is set up to [handle the additional action](/online-payments/build-your-integration/advanced-flow/?platform=Web\&integration=Drop-in#handle-the-redirect). `action.type`: **await**. |   |
| **Setup steps**      | Before you begin, [add UPI in your Customer Area](/payment-methods/add-payment-methods).                                                                                                                                      |   |

### Drop-In-Import-Optional

## Import UPI (optional)

When you [import Adyen Web](/online-payments/build-your-integration/advanced-flow/?platform=Web\&integration=Drop-in#get-adyen-web), you can optionally import individual payment methods to optimize performance by using [tree shaking](https://developer.mozilla.org/en-US/docs/Glossary/Tree_shaking). To do this, include `UPI`.

**Import**

```javascript
import { AdyenCheckout, Dropin, Upi } from '@adyen/adyen-web';
```

### Drop-In-Add-Configuration

## Add additional configuration for UPI

You do not need to add any configuration parameters for UPI.

### Drop-In-Add-Parameters-Payments-Request

## Add additional parameters to your /payments request

When you [make a payment](/online-payments/build-your-integration/advanced-flow/?platform=Web\&integration=Drop-in#make-a-payment), add the following parameters:

| Parameter                                                                                                                             | Required                                                                                    | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             |
| ------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [paymentMethod.appId](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-paymentMethod-UpiIntentDetails-appId) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | Required when the payment option is UPI Intent (`paymentMethod.type`: **upi\_intent**). The identifier of the Third Party Application Provider (TPAP) that the shopper uses to make the UPI payment. Possible values: - **gpay**: Google Pay - **phonepe**: PhonePe - **bhim**: BHIM (Bharat Interface for Money) - **paytm**: Paytm - **amazonpay**: Amazon Pay - **cred**: Cred - **wapay**: WhatsApp Pay - **jupiter**: Jupiter - **navi**: navi - **supermoney**: Super.money - **mobikwik**: MobiKwik - **freecharge**: Freecharge |

**Example request for UPI intent**

```bash
curl https://checkout-test.adyen.com/v72/payments \
-H "x-API-key: ADYEN_API_KEY" \
-H "content-type: application/json" \
-d '{
    "amount": {
        "currency": "INR",
        "value": 15100
    },
    "countryCode": "IN",
    "merchantAccount": "ADYEN_MERCHANT_ACCOUNT",
    "reference": "YOUR_ORDER_NUMBER",
    "paymentMethod": {
        "type": "upi_intent",
        "appId": "gpay"
    },
    "returnUrl": "https://your-company.example.com/checkout?shopperOrder=12xy.."
}'
```

### Drop-In-Test-And-Go-Live

## Test and go live

Depending on your account setup, you may have access to the UPI simulator which you can use to test your UPI integration. Contact your Account Manager or our [Support Team](https://ca-test.adyen.com/ca/ca/contactUs/support.shtml?form=other) if you have questions about the simulator.

You can also use your personal account on a UPI app to test your integration by making live payments with a low value.