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-webviewversion 13.15 or later. - Set
paymentRequestEnabledtotrue.
Flutter
- Use
webview_flutter_androidversion 4.10.0 or later. - On Android, call
setPaymentRequestEnabled(true)on theAndroidWebViewControllerafter you confirm thatWebViewFeatureType.paymentRequestis 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 (
javaScriptEnabledanddomStorageEnabled). - Enable multiple windows and handle
onOpenWindowso popups attach a second WebView. - Intercept
samsungpay://andsamsungapps://inonShouldStartLoadWithRequeston 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.openattaches a second WebView. - Intercept
samsungpay://andsamsungapps://inNavigationDelegate.onNavigationRequeston 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.
onCreateWindowcreates a popup WebView, sends the message to the target, and returnstrue.- The main WebView and popup WebViews intercept
samsungpay://andsamsungapps://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.
Updated about 3 hours ago