Configure Android WebView for Google Pay and Samsung Pay

Google Pay and Samsung Pay can fail in an Android WebView that hosts Checkout even when they work in a mobile browser. The WebView needs extra configuration that a browser provides by default.

Use these steps for Embedded Checkout, Embedded Express, and Hosted Checkout loaded in an Android WebView. Customers who pay in Chrome or Samsung Internet on the device do not need these steps.

Shared WebView requirements

Configure every WebView that loads Checkout as follows:

  • Load an HTTPS page that your backend serves. Do not inject HTML with source={{html}} in React Native, and do not use a localhost address.
  • Load Checkout with a full URI and allow the checkout origin in the WebView.
  • Enable JavaScript.
  • Enable DOM storage.

Missing origin configuration can cause the checkout page to keep loading after a customer selects a payment method.

Google Pay

Google Pay in a WebView uses the Payment Request API. Enable Payment Request on the Android WebView. See Google Pay in Android WebView for the vendor steps.

Native Android

Use Android System WebView with Payment Request support, then enable it on the WebView settings, for example with WebSettingsCompat.setPaymentRequestEnabled from AndroidX WebKit when WebViewFeature.PAYMENT_REQUEST is available.

React Native

  • Use react-native-webview version 13.15 or later.
  • Set paymentRequestEnabled to true.

Flutter

  • Use webview_flutter_android version 4.10.0 or later.
  • On Android, call setPaymentRequestEnabled(true) on the AndroidWebViewController after you confirm that WebViewFeatureType.paymentRequest is supported.

Samsung Pay

Samsung Pay Web Checkout opens a payment window and then hands off to the Samsung Wallet app. An Android WebView must support that popup and must launch Samsung's custom URL schemes. If it does not, Samsung Pay sometimes shows Something went wrong. Try again later. while the same checkout succeeds in a mobile browser. Peach Payments Checkout never receives the Samsung Pay wallet request.

The merchant WebView needs this configuration. Peach Payments Checkout APIs do not change. See Samsung Pay WebView integration for Samsung's reference.

Native Android

Enable the following WebView settings:

webView.settings.javaScriptEnabled = true
webView.settings.domStorageEnabled = true
webView.settings.javaScriptCanOpenWindowsAutomatically = true
webView.settings.setSupportMultipleWindows(true)

Implement WebChromeClient.onCreateWindow so that window.open creates and attaches a second WebView, then call message.sendToTarget() and return true. Do not return false or leave onCreateWindow unimplemented.

In shouldOverrideUrlLoading on the main WebView and on every popup WebView, intercept samsungpay:// and samsungapps://, start an Intent for those URLs, and fall back to the Galaxy Store if Samsung Wallet is not installed.

React Native

Map the native requirements onto react-native-webview:

  • Enable JavaScript and DOM storage (javaScriptEnabled and domStorageEnabled).
  • Enable multiple windows and handle onOpenWindow so popups attach a second WebView.
  • Intercept samsungpay:// and samsungapps:// in onShouldStartLoadWithRequest on the main WebView and on popup WebViews.

If you intercept navigation, do not read .url from an undefined request. Guard the URL, for example with request?.url, or the app can crash when the customer selects Samsung Pay.

Flutter

Map the native requirements onto webview_flutter:

  • Use JavaScriptMode.unrestricted.
  • Enable multiple windows and implement popup creation so window.open attaches a second WebView.
  • Intercept samsungpay:// and samsungapps:// in NavigationDelegate.onNavigationRequest on the main WebView and on popup WebViews.

Verification checklist

After you ship a new app build, confirm the following:

  • The WebView loads Checkout from an HTTPS origin with JavaScript and DOM storage enabled.
  • Google Pay can complete a payment in the Android app on a device that supports Google Pay.
  • onCreateWindow creates a popup WebView, sends the message to the target, and returns true.
  • The main WebView and popup WebViews intercept samsungpay:// and samsungapps:// and fall back to the Galaxy Store when Samsung Wallet is missing.
  • Samsung Pay can complete a payment on a Samsung device with Samsung Wallet installed.
  • Google Pay and Samsung Pay still complete in a mobile browser on the same device.

Did this page help you?