Questions for Migrating to Web Payments SDK from SqPaymentForm in ASP.NET

Hi,

I have begun the migration from the SqPaymentForm to the Web Payments SDK. I’m trying to use the Payments API, but would prefer using the Checkout API if possible. I only work on Square code a few times a year, so I don’t have a lot of experience with it.
We use ASP.NET (vbscript) with Bootstrap and Javascript for a single-page website. We will be only using the Card payment method as the other payment methods are not applicable.

I have the package for Square 17.2.0.0 installed. I have implemented this sample code (https://github.com/square/web-payments-quickstart/blob/main/public/examples/card.html) using the Payments API. I’m trying use only Javascript. It runs without errors, but I don’t get a finished transaction in the developer dashboard.
Our old way of using SqPaymentForm was implemented in the code-behind in vbscript translated from C# using the Checkout API.

Here are my questions:

  1. How to I define the amount? It looks like it should be added to the body object that is provided to fetch for paymentResponse, but I don’t see that in the documentation.

  2. I had to change line 35 in the sample

return paymentResponse.json();

to be

return paymentResponse;

as I was getting an error “square.js:1 Unexpected token < in JSON at position 4”. The text it was returning was not in JSON format, so formatting as JSON was failing. Is this the correct fix, or should I make a different change?

  1. For this line

const paymentResponse = await fetch(‘/payment’, {

I changed the path to ‘/’ as it was trying to reach a payment page like “(url)/payment” that does not exist. This website is designed as a single page. Is this correct?

  1. Can the Web Payments SDK be used with the Checkout API? How do I provide the dynamic token to the code-behind and run the code-behind subroutine after the Square “Pay” button is clicked?

client = (New SquareClient.Builder()).Environment(environment).AccessToken(access_token).Build()

I have examined all of the code samples I can find, but they are all mostly the same.
Thank you for your help.

:wave: Glad to see you’ve been making progress with the Web Payments SDK. Currently there isn’t a way to update the existing Checkout API with the Web Payments SDK. Are you wanting to continue down the path with Web Payments SDK our would you prefer to wait till we have a replacement for the existing Checkout API? :slightly_smiling_face:

We would like to make the change now so we don’t have to worry about it later when the SqPaymentForm is discontinued.
So, Plan B would be to use the javascript version of the Payments API.
Do you have any solutions to the issues I was finding for questions 1-3? I’m sure the line with the fetch command is wrong, but I’m not sure of the correct way to use it for Square.
Thank you.

Does anyone have any information on my questions?
Thanks.

The Quickstart is in Node and if it helps we do have an example in C#. Currently all our examples have the amount hard coded in the payment request. This is cause the Web Payments SDK is used for tokenizing the card and it’s entirely up to you and what best fits your business need to pass the amount to the CreatePayment request.

As for the change you had to make what are the steps to reproduce? We’ve been unable to replicate the error. :slightly_smiling_face: