Building a checkout process with the Payment Request API
There is one more amp-iframe
application that's worth exploring here. Earlier in the book, we built an e-commerce prototype, with configurable product options, a product image carousel, and a shopping cart. But what e-commerce prototype would be complete without a checkout process? Let's see how AMP can accommodate us here.
Completing the e-commerce prototype is difficult in AMP due to JavaScript restrictions. However, it's possible to build a checkout solution combining amp-iframe
with a recent HTML5 API: the Payment Request API. First, what is the Payment Request API?
The HTML5 Payment Request API
Traditionally, making payments on the web has been difficult, especially on mobile, where it takes users a long time to enter the required personal, delivery, and credit card information to complete a transaction. The HTML5 Payment Request API is an API designed to make this process more seamless for the user.
The Payment Request API provides...