Initialize the Square Payments object

Initialize the Square Payments object with your application ID and the ID of the seller location where the payment is taken.

  
    
    
  const payments = Square.payments(APPLICATION_ID, LOCATION_ID);

Create an ACH object

Get a new ACH instance with all of the behaviors and properties needed to take the payment. You need to include a redirectURI and transactionId

  
    
    
  const ach = await payments.ach({
  redirectURI: window.location.href,
  transactionId: 'my-distinct-transaction-id',
});

Get the one-time payment token from the ACH object

Get the payment token from the ACH object when the buyer completes the form. Calling ach.tokenize will trigger a modal whereby the buyer will be able to select their bank account. The tokenize method accepts the account holder's name, intent, and the amount as required arguments.

If the buyer's bank information is valid, ontokenization event listener will receive a one-time use token to make a call to the Payments API CreatePayment endpoint to charge a customer. Otherwise, it will return an error you can present to the customer.

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

await ach.tokenize({
  accountHolderName: 'John Doe',
  intent: 'CHARGE',
  amount: {
    total: 500,
    currencyCode: 'USD',
  },
});