Announcing Cash App Pay for Developers

We’re thrilled to announce that developers and partners can now add Cash App Pay to their online checkout flow with Square Web Payments SDK and Square Checkout API. Cash App is a popular mobile payment app listed as the #1 finance app in the App Store with more than 70M annual active users in the U.S. Cash App Pay is a new payment method that lets customers seamlessly pay with their Cash App account, whether it’s through their account balance or a linked bank account. Since rolling out Cash App Pay to our Square Online and Square Point of Sale sellers in late 2021, millions of unique buyers have already paid hundreds of thousands of Square sellers with Cash App Pay.

Here’s how Cash App Pay works: Customers click the Cash App Pay button at checkout, scan the QR code on desktop or let Cash App open automatically on mobile, and pay from the app on a mobile device. No card number, expiration date, CVV, or billing address required — it’s a seamless and secure payment experience through a familiar peer-to-peer payment app.

With this release, developers can:

• Enable a fast, familiar checkout experience with just a few lines of code. Developers only need to write a few lines of code within the Square Web Payments SDK to add Cash App Pay to their Square-powered online checkout flow. Cash App Pay is prebuilt into Checkout API, so no additional integration work is required.

• Build and maintain a single integration for Square and Cash App Pay payments. Rather than building multiple integrations with Square APIs and Cash App APIs, this release decreases the developer resources required and reduces maintenance costs.

• Help sellers consolidate transaction data in Square Dashboard. With a single integration, all Square and Cash App Pay funds flow into sellers’ Square accounts for simpler cash flow management.

Square partners like Jotform, Reference Health, Magento, Iris Works, Kyoo, BillyCart, and Payable Forms have already started to build integrations with Cash App Pay.

"We’re excited to offer Cash App Pay on Jotform as a payment option for fast and effortless online payments to more than 15M customers globally. Square makes it easy to add new payment methods, and we're eager to add this one to our Web Payments SDK integration."

— Ender Ozmen, Head of Payments at Jotform

How it Works

Below is a short walk-through on how to add Cash App Pay to your Web Payments SDK integration. For the full walk-through, view our developer documentation.

First, add an element for attaching Cash App Pay.

<form id="payment-form">
   <!-- Add the cash-app-pay button div below -->
   <div id="cash-app-pay"></div>
   <div id="card-container"></div>
   <button id="card-button" type="button">Pay $1.00</button>
</form>
<div id="payment-status-container"></div>

Then, add these functions.

function buildPaymentRequest(payments) {
   const paymentRequest = payments.paymentRequest({
     countryCode: 'US',
     currencyCode: 'USD',
     total: {
       amount: '1.00',
       label: 'Total',
     },
   });
    return paymentRequest;
}
 async function initializeCashApp(payments) {
   const paymentRequest = buildPaymentRequest(payments)
   const cashAppPay = await payments.cashApp(paymentRequest,{
     redirectURL: 'https://my.website/checkout',
     referenceId: 'my-website-00000001',
   });
   await cashAppPay.attach('#cash-app-pay');
   return cashAppPay;
 }

The initializeCashApp function requires a redirectURL value to indicate where to send buyers after completing a payment on a mobile device. The redirectURL value is only for mobile payments and is not used for desktop QR payments.

Now, in the DOMContentLoaded event listener, add the following code after you initialize the Cash App payment method:

 let cashAppPay;
 try {
   cashAppPay = await initializeCashApp(payments);
 } catch (e) {
   console.error('Initializing Cash App Pay failed', e);
 }

Get the payment token from the Cash App Pay payment method and attach it to a DOM element.

cashAppPay.addEventListener('ontokenization', function (event) {
   const { tokenResult, error } = event.details;
   if (error) {
     // developer handles error
   }
   else if (tokenResult.status === 'OK') {
     // developer passes token to backend for use with CreatePayment
   }
 }); 

Get started

Cash App Pay is available to developers and partners in the U.S. through Web Payments SDK and Checkout API. To start building, check out our developer documentation, technical reference, and payments pricing. As always, please share your feedback in our community Slack channel or Square Developer Forums. If you want to keep up to date with the rest of our content, be sure to follow this blog and our Twitter account.