Displaying the hosted checkout iframe

The hosted checkout integration iframe is an embeddable HTML element that collects a customer's payment information and authorizes the transaction. To enable the iframe on your checkout page or on a webpage in your integration, you need to load the Toast hosted checkout Javascript SDK on the page. To load the SDK, add a script element to the head element of your HTML page.

<head>
      <script src="https://payments.sandbox.eng.toasttab.com/assets/loader.js"></script>
</head>

The script tag adds an object, Toast to the global Javascript window object, from which you can control the payment flow using the hosted checkout integration Javascript SDK functions:

initialize
monitor
fetchUpdates
createPaymentMethod
confirmIntent

All functions are used when you take a payment using the iframe. For more information on the SDK functions, see SDK functions.