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:
Import resources for v6
If you are using Web Drop-in v6, import the resources you need for Cash App Pay:
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:
- /sessions: This is the default with Drop-in v5.0.0 or later.
- /payments: If you implemented an additional use case.
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 ofAdyenCheckout
.
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
Adyen's tokenization service allows you to securely store the shopper's payment details. You can configure to:
- Store Cash App Pay details
- Show stored Cash App Pay details
- Make a payment with stored Cash App Pay details
Store Cash App Pay details
Choose the endpoint you integrated:
Show stored Cash App Pay details
Make a payment with stored Cash App Pay details
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.