{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-products/hosted-checkout/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":[]},"type":"markdown"},"seo":{"title":"Embedded Checkout (iFrame) — Overview","description":"Official Banxa API documentation – on-ramp and off-ramp transfers with identity verification and compliance.","llmstxt":{"hide":false,"sections":[{"title":"Table of contents","includeFiles":["**/*"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"embedded-checkout-iframe--overview","__idx":0},"children":["Embedded Checkout (iFrame) — Overview"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The embedded checkout loads the Banxa checkout flow inside your application using an iFrame (web) or WebView (mobile). The customer completes their transaction without leaving your product."]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"how-it-works","__idx":1},"children":["How it works"]},{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Your app creates a checkout URL — either via a ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-checkout/docs/referral-integration/constructing-referral-urls"},"children":["Referral link"]}," or the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["checkoutUrl"]}," returned by ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["POST /v2/buy"]}," or ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["POST /v2/sell"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The URL is loaded as the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["src"]}," of an iFrame element (web) or inside a WebView component (mobile)."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The customer completes the Banxa checkout flow within the embedded view."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["On completion, Banxa redirects to your ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["redirectUrl"]}," — you can detect this navigation event in the WebView to dismiss the component."]}]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"advantages","__idx":2},"children":["Advantages"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The customer stays within your application throughout the transaction."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["You control the surrounding UI and context."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Consistent with a native-feeling product experience."]}]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"considerations","__idx":3},"children":["Considerations"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"camera-access","__idx":4},"children":["Camera access"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Banxa requires camera access for KYC document capture. On web, the iFrame must have the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["allow=\"camera; microphone\""]}," attribute. On mobile, the WebView must have camera permissions enabled."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"ios-liveness-check","__idx":5},"children":["iOS liveness check"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Sumsub KYC liveness verification requires ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["SFSafariViewController"]}," on iOS. It will not complete inside a standard ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["WKWebView"]},". If your customers will encounter liveness checks, use ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["SFSafariViewController"]}," as your WebView implementation."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"payment-method-compatibility","__idx":6},"children":["Payment method compatibility"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Some payment methods have restrictions inside iFrames and WebViews:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Apple Pay on web"]}," — requires merchant certificate and domain configuration to work inside an iFrame. Contact your Banxa account manager to ensure Apple Pay is correctly set up for your integration."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Apple Pay on iOS"]}," — works inside a correctly configured ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["WKWebView"]}," or ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["SFSafariViewController"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Google Pay on Android"]}," — requires Custom Chrome Tabs, not a standard WebView. If Google Pay is enabled for your integration, use Custom Chrome Tabs."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["iDEAL, Klarna, PayPal"]}," — redirect out of the iFrame to complete the payment. The customer is returned to the Banxa order status page afterwards."]}]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"implementation","__idx":7},"children":["Implementation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["→ ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-checkout/docs/checkout-experience/iframe/iframe-web"},"children":["Web Implementation"]}," ","→ ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-checkout/docs/checkout-experience/iframe/webview-mobile"},"children":["Mobile Implementation"]}]}]},"headings":[{"value":"Embedded Checkout (iFrame) — Overview","id":"embedded-checkout-iframe--overview","depth":1},{"value":"How it works","id":"how-it-works","depth":2},{"value":"Advantages","id":"advantages","depth":2},{"value":"Considerations","id":"considerations","depth":2},{"value":"Camera access","id":"camera-access","depth":3},{"value":"iOS liveness check","id":"ios-liveness-check","depth":3},{"value":"Payment method compatibility","id":"payment-method-compatibility","depth":3},{"value":"Implementation","id":"implementation","depth":2}],"frontmatter":{"title":"Embedded iFrame Checkout Overview | Banxa Docs","description":"Embed Banxa checkout inside your app using an iFrame or WebView. Covers camera access requirements, iOS liveness check limits, and payment method compatibility.","seo":{"title":"Embedded Checkout (iFrame) — Overview"}},"lastModified":"2026-05-19T23:30:38.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/products/hosted-checkout/docs/checkout-experience/iframe/iframe-overview","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}