Online Payment Options
Learn about the website payment processing options in the Square developer platform.
The option that you chose depends on whether you have already built a buyer checkout experience in your application. Whether you are building a new custom checkout experience or adding Square payments to an existing one, you can use the Web Payments SDK. If you want to use a Square-rendered and hosted checkout experience, use the Checkout API.
You have already built a buyer checkout experience and you want to add Square as the payment acceptance step in the buyer checkout.
The Web Payments SDK gives you a customizable UI for a secure PCI-compliant way of accepting the buyer's chosen supported payment source. Use of this SDK requires you to create and complete the actual payment on your backend with the Payments API.
The following image shows that the SDK renders a payment form in a simple form with a help text string below it. It can be rendered any place in your checkout page.
You are planning to either build your own checkout page or you are going to use a configurable checkout page built and hosted by Square.
New custom checkout page. The client Web Payments SDK gives you a customizable UI for a secure PCI-compliant way of accepting the buyer's chosen supported payment source. Use of this SDK requires you to create and complete the actual payment on your backend with the Payments API.
Square-hosted checkout page. The Checkout API allows you to populate a Square-hosted checkout page with order details and accept a payment with minimal coding. Use the URL provided by the Checkout API to redirect the buyer to the Square checkout page. Payment creation and capture are handled by Square servers.
The following image shows the Square-hosted checkout page with the Google Pay method configured, a total amount, but with no order details.
Note
For online payment pricing, see Online and in app-payments.
If you need more assistance, contact Developer Support or ask for help in the Developer Forums.