BlogsShopifyBrowser Payment Request API Integration

Browser Payment Request API Integration

Browser Payment Request API Integration

1
posts
2018

This feature thread tracks the development and enhancement of integrating new browser payment APIs to streamline the checkout experience. Initial efforts focused on evaluating the Payment Request API, including its `canMakePayment()` method and the payment sheet UI. Experiments were conducted to measure its impact on checkout completion rates and purchase speed, comparing it against traditional checkout flows. The integration involved building an isolated Ruby app leveraging Shopify's existing APIs and app ecosystem, injecting script tags onto merchant storefronts, and overriding the checkout button to initiate the Payment Request flow. Considerations for alternative payment flows, such as discount codes and gift cards, were also addressed. Future work will involve analyzing experiment data and exploring broader adoption.

2018

Shaping the Future of Payments in the Browser - Shopify

9/4/2018

This post details Shopify's initial experiment with the Payment Request API to improve browser-based checkout experiences. It outlines the project's definition, hypothesis (market readiness, unchanged or improved CCR, better/faster purchase experience), and A/B experiment setup. Key technical contributions include: defining merchant and audience eligibility criteria, segmenting users into control and experiment groups, integrating the experiment into an isolated Ruby app using Shopify's Rails engine and REST Admin API, injecting JavaScript via script tags, overriding the 'checkout' button, and interacting with Shopify's Checkout API. It also addresses the challenge of supporting discount codes and gift cards by providing opt-out flows. The post introduces Payment Request API terminology like `canMakePayment()` and `basic-card`.