Web Payments SDK and ACH Beta

The eCommerce industry is booming. According to a recent study by Digital Commerce 360, consumers spent approximately $861 billion online with U.S. merchants in 2020. That’s the highest annual U.S. eCommerce growth in at least two decades and this trend is not going away any time soon. While businesses scrambled to build an online presence in the height of the global pandemic, many are now adopting more sophisticated eCommerce websites that will serve them in the years to come.

To support this shift, we’re excited to publicly release Web Payments SDK to offer an enhanced, online shopping experience for buyers. This new JavaScript SDK is customizable so businesses can offer a fully branded experience, and it’s highly responsive so businesses never miss a sale. And there’s more — not only does Web Payments SDK support credit cards, debit cards, gift cards, Apple Pay, and Google Pay, but we’re also introducing ACH payment support in beta in the U.S. Now businesses can accept online payments directly debited from a bank account at a low cost, adding to one of many ways that sellers can get paid with Square. Plus, Square handles the responsibility of managed payments on behalf of developers and sellers, so businesses never need to worry about bank authentication or compliance, and developers can focus on building their apps.

A handful of Square Partners started as early alpha adopters of Web Payments SDK and have since launched their integrations, including Magento, GlobalTill, Kyoo, TicketSocket, and vCita. These partners build solutions that span eCommerce platforms, retail, ticketing, mobile ordering, and more. But our partners aren’t the only ones using Web Payments SDK. Our own first-party products like Square Invoices, Virtual Terminal, and Checkout API are also powered by the SDK.

GlobalTill is a one-stop point-of-sale solution to manage retail, wholesale, and eCommerce businesses. We chose Square’s Payment Platform for its omnichannel payment integrations from in-person to online. Our development team integrated with Web Payments SDK quickly thanks to clear documentation and the responsive team at Square. Now our customers and their buyers can enjoy a seamless online payment experience.

Michael MacKinnon, Founder of GlobalTill

How it works

You can take a payment with just a few lines of code. Start by including our new versioned script that's served from our global CDN for faster checkouts.

<script src="https://sandbox.web.squarecdn.com/v1/square.js"></script>

We provide a professionally designed card input form out of the box that localizes automatically for your buyers around the world. Just tell us where to put it.

<div id="card-container"></div>
<button id="card-button" type="button">Pay now</button>

Existing developers can use their same application credentials.

const applicationId = "{YOUR_SANDBOX_APPLICATION_ID}";
const locationId = "{YOUR_SANDBOX_LOCATION_ID}";
const payments = Square.payments(applicationId, locationId);

Payment methods are now more modular, require less configuration, and share familiar patterns, such as "attach then tokenize."

const card = await payments.card();

await card.attach("#card-container");

document
    .getElementById("card-button")
    .addEventListener("click", async function() {
        const { token } = await card.tokenize();
        // create payment with token as source_id in /v2/payments
    });

Square SDKs make it easy to use the tokens that Web Payments SDK creates to take payments, and existing developers can use the same backend code as before.

curl https://connect.squareupsandbox.com/v2/payments \
  -X POST \
  -H 'Square-Version: 2021-05-13' \
  -H 'Authorization: Bearer ACCESS_TOKEN' \
  -H 'Content-Type: application/json' \
  -d '{
    "amount_money": {
      "amount": 100,
      "currency": "USD"
    },
    "idempotency_key": "1bf46c7b-f705-4381-96c5-09aaf42a6a52",
    "source_id": "token_from_card.tokenize"
  }'

Start building

Web Payments SDK is publicly available to developers in the U.S., Canada, UK, Ireland, Australia, and Japan. ACH payments are available in beta within Web Payments SDK in the U.S. only. The SDK is free for developers and businesses pay the standard payment processing rate by payment method (learn more about pricing). Web Payments SDK replaces SqPaymentForm, which is now deprecated. All SqPaymentForm developers will need to migrate to Web Payments SDK with a few simple front end updates (no backend changes are required).

Check out the Web Payments SDK documentation and technical reference to get started. 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!