Integrating in WebViews

Apart from the previously mentioned integration methods you may choose to embed the Onramper widget in a WebView. Embedding the Onramper widget in a WebView requires additional steps to ensure a seamless experience. This document outlines those steps and highlights specific considerations for WebView configurations.

Cloudflare Turnstile

Onramper utilises Cloudflare Turnstile in certain workflows to block unwanted traffic and optimize user performance. To integrate Turnstile with WebViews, follow these steps:

• WebView Configurations
• Allowing required origins

Apart from the above we have seen the following specific behaviour:

React Native Webview

If you're using the react-native-webview package update the following parameters:

originWhitelist={['https://*', 'http://*', 'about:blank', 'about:srcdoc']}

(iOS only) Make sure to have allowsInlineMediaPlayback property set to true.

Checkout: Redirects vs New Tabs

By default, the widget opens order checkout UI in a new tab. When integrating in mobile apps, it typically makes more sense to redirect customers instead. In order to achieve that, you can add this URL parameter to the widget URL: &redirectAtCheckout=true.