For AI agents: a documentation index is available at the root level at /llms.txt and /llms-full.txt. Append /llms.txt to any URL for a page-level index, or .md for the markdown version of any page.
HomeGuides
HomeGuides
  • About Afterpay
    • What Is Afterpay?
    • How Does Afterpay Work?
  • Afterpay Button
    • Afterpay Messaging
  • Express Checkout
    • Express Checkout Overview
    • Adding the Afterpay Express Checkout Button
    • Process The Credit Card
    • Complete the Express Checkout Process
    • Integrated Shipping
    • Checkout Widget
  • Cash App Pay
    • Using the Cash App Pay Button
    • Getting Started
    • Advanced Rendering Control
    • Mobile Redirection
    • Customer On-File Payments
LogoLogo
Cash App Pay

Mobile Redirection

Was this page helpful?
Previous

Customer On-File Payments

Next
Built with

On Mobile, instead of a QR code, the customer is redirected to the Cash App. When the customer approves, the customer is taken back to the url specified in the redirectConfirmUrl in the initializeForCashAppPay call. This can be the same page where the Cash App Pay button is rendered e.g. merchant.com/checkout, or a new page e.g. merchant.com/review

Query Params can be added to the redirectConfirmURL

If you want to determine if the page is loading as a result of redirect from the Cash App, you can add a query param to your redirectConfirmURL. e.g. merchant.com/checkout?cashapppay=true

The redirectCancelURL is not used by Cash App Pay

On mobile, the customer will always be redirected to the redirectConfirmUrl for approved and declined flows

The page the redirectConfirmUrl points to should initialize afterpay-button.js and define the below onComplete callback on page load. The data returned by onComplete includes the virtual card object and customer’s cashtag.

1function onPageLoad () {
2  var cashAppPayListenerOptions = { 
3        onComplete: function(event) {
4          // event.data includes the virtual card object + customer's cashtag
5          const { status, virtualCard, token, cashtag } = event.data;
6        },
7        eventListeners: {
8            "CUSTOMER_INTERACTION": ({ isMobile }) => {
9                console.log(`CUSTOMER_INTERACTION`)
10                if (isMobile) {
11                    // Capture mobile metrics
12                } else {
13                    // Capture desktop metrics
14                };
15            },
16            "CUSTOMER_DISMISSED": () => {
17              console.log(`CUSTOMER_REQUEST_FAILED`);
18            },
19            "CUSTOMER_REQUEST_DECLINED": () => {
20                console.log(`CUSTOMER_REQUEST_DECLINED`)
21            },
22              "CUSTOMER_REQUEST_APPROVED": () => {
23                console.log(`CUSTOMER_REQUEST_APPROVED`)
24            },
25            "CUSTOMER_REQUEST_FAILED": () => {
26                console.log(`CUSTOMER_REQUEST_FAILED`)
27            }
28        }
29      }
30
31    AfterPay.initializeCashAppPayListeners({countryCode: "US", cashAppPayListenerOptions});
32}