End-to-End Integration Overview

The below example illustrates the integration process with Upfront for a typical e-commerce website. This is not the only way the API is meant to be used, but meant to show a common example of how to integrate Upfront into your site.

1. Use Upfront.js to render <upfront-estimate /> on the product page.
2. The consumer on your website clicks the Upfront.js pop-up and completes qualification and we determine they are eligible for $500 of rebates.
3. When the user closes the pop-up, we pass a qualificationId back from Upfront.js. It is recommended to save this ID in your own DB to later reference. At this point, also invoke our API GET /qualification.
4. GET /qualification returns the total rebate discounts available for the consumer.
5. You factor the rebate discounts into your product pricing and offer the consumer the new lower price.
6. The consumer checks out by paying through your existing payment gateway solutions.
7. You call our API POST /purchase. This tells Upfront that the purchase is complete, and we should follow up with the consumer on any additional steps needed in order to finalize the rebates.