Payment-method icon

Cash App Pay Drop-in

This page explains how to add Cash App Pay to your existing Web Drop-in integration.

Requirements

Select the server-side flow that your integration uses:

Requirement Description
Integration type Make sure that you have built a Sessions flow Web Drop-in integration.
The minimum required version is 5.44.0.
Setup steps Before you begin:

Import resources for v6

If you are using Web Drop-in v6, import the resources you need for Cash App Pay:

Copy code
import { AdyenCheckout, CashAppPay} from '@adyen/adyen-web'

API reference

You do not need to send additional fields for Cash App Pay. To see optional fields that you can send for all payment methods, choose the endpoint you integrated:

Drop-in configuration

For Cash App Pay, you must pass the amount for the transaction value to be authorized.

  • If you use the /sessions endpoint, pass the amount when creating the session.
  • If you use the /payments endpoint, include the amount when creating an instance of AdyenCheckout.

You do not have to pass the amount for zero-value auth transactions.

Optional configuration

You can add the following optional configuration:

Parameter name Description Default
enableStoreDetails Set to true to show a toggle that lets the shopper choose whether to save their payment details. false
storePaymentMethod Set to true to save the shopper's payment details without showing a toggle. For example, use this for a page where the shopper enters their details for a subscription service that charges the shopper on a recurring basis. false
button Use the available style options to configure the layout of the Pay button for Cash App Pay.
showPayButton Show or hide the Adyen-provided Pay button. This Pay button triggers the onSubmit event when payment details are valid.

If you want to disable the button and then trigger the submit flow on your own, set showPayButton to false and call the .submit() method from your own button implementation.
true

The following event handler is supported for Cash App Pay:

Event Description
onClick(actions) Called when the shopper clicks the Cash App Pay Pay button. Call actions.resolve() or actions.reject() to continue or stop the payment flow.

Recurring payments

Cash App Pay supports tokenization of the shopper's payment details for recurring transactions.

We strongly recommend that you ask explicit permission from the shopper if you intend to make future recurring payments. Being transparent about the payment schedule and the amount reduces the risk of chargebacks.

You can:

Store Cash App Pay details

Select the server-side flow that your integration uses:

How you store card details with Drop-in depends on the Checkout API version you use:

v70 or later

Send additional parameters in the /sessions request to store payment details or configure Drop-in to let the shopper choose if they want to save their payment details.

In the /sessions request, include:

Parameter Description
recurringProcessingModel The type of transactions you can use the stored Cash App Pay details for.
shopperReference Your unique reference for the shopper.
storePaymentMethodMode The setting for storing the shopper's Cash App Pay details. Set storePaymentMethod to true in the Drop-in configuration to store the details.

Possible values for storePaymentMethodMode:

Value Description
disabled Your shopper's Cash App Pay details are not stored.
askForConsent Drop-in lets the shopper choose whether to save their payment details.
enabled Your shopper's Cash App Pay details are stored.

For example:

/sessions request for asking shopper consent to store Cash App Pay details
Expand view
Copy link to code block
Copy code
Copy code
curl https://checkout-test.adyen.com/v70/sessions \
-H 'X-API-key: ADYEN_API_KEY' \
-H 'Content-Type: application/json' \
-d '{
"amount":{
"currency":"USD",
"value": 1000
},
"merchantAccount": "ADYEN_MERCHANT_ACCOUNT",
"reference": "YOUR_ORDER_NUMBER",
"recurringProcessingModel": "CardOnFile",
"returnUrl": "https://your-company.com/checkout?shopperOrder=12xy..",
"storePaymentMethodMode": "askForConsent"
}'

v69

To ask the shopper if they want to store their Cash App Pay details, set enableStoreDetails to true when you configure Cash App Pay. This shows a toggle that lets the shopper save their payment details.

To store the shopper's payment details without showing a toggle, set storePaymentMethodMode to enabled in your /sessions request and set storePaymentMethod to true in the configuration object. Use this, for example, for a page where the shopper enters their details for a subscription service that charges the shopper on a recurring basis.

Show stored Cash App Pay details

When you make the /sessions request, include shopperReference to show the shopper's stored payment details.

By default, Drop-in shows available stored payment methods. If you do not want to show them, set showStoredPaymentMethods to false when configuring Drop-in.

Get the shopper's $cashtag

We recommend making sure that your recurring payments include the shopper's $cashtag. The $cashtag makes it easier for the shopper to recognize the recurring payment as a legitimate one. This helps to avoid chargebacks.

To obtain the shopper's $cashtag, you need to make a /payments/details request. If you are using the Sessions flow and want to include the $cashtag in recurring payments, you need to switch to the Advanced flow and implement both the /payments/details request and the /payments request.

  1. Make a POST /payments/details request. For instructions, see Submit additional payment details.
  2. From the /payments/details response, save the following additionalData details:

    Parameter Description
    additionalData.cashapp.cashtag The shopper's $cashtag.
    additionalData.recurring.shopperReference The shopper reference you specified in the payment request.
    additionalData.recurring.recurringDetailReference The token that was generated through the payment request.

    Note that the RECURRING_CONTRACT webhook also includes the shopper reference and the recurring detail reference, but not the $cashtag.

    /payments/details response with $cashtag and recurring details
    Expand view
    Copy link to code block
    Copy code
    Copy code
    {
    "additionalData": {
    "cashapp.cashtag": "$CASHTAG_C_TOKEN",
    "recurring.shopperReference": "YOUR_SHOPPER_REFERENCE",
    "recurring.recurringDetailReference": "M5N7TQ4TG5PFWR50"
    },
    "amount":{
    "currency":"USD",
    "value":1000
    },
    "merchantRreference":"YOUR_ORDER_NUMBER",
    "paymentMethod":{
    "type":"cashapp",
    "subtype":"redirect"
    },
    "pspReference":"V4HZ4RBFJGXXGN82",
    "resultCode":"Authorised"
    }

Make a payment with stored Cash App Pay details

When the shopper selects Pay, Drop-in submits the /payments request.

Test and go live

Test your Cash App Pay integration using the test environment. You can simulate various payment scenarios using Cash App Pay magic values. You can check the status of Cash App Pay test payments in your Customer Area, under Transactions > Payments.

When you are ready to go live, add Cash App Pay in your live Customer Area.