Skip to main content

Mobile

When integrating Topper with a mobile app you can either open Topper on a user's browser (where no extra configuration is required), WebView or Safari View Controller.

On WebView and Safari View Controller scenarios, please ensure the following steps have been completed:

Query parameters are the preferred way to tell Topper which mobile context it is running in. However, for iOS and Android WebViews, Topper can also detect this context automatically as a fallback, by inspecting the browser's user agent when the corresponding query parameter hasn't been set. This does not change the recommended integration path of explicitly setting is_android_webview or is_ios_webview which still gives you the most predictable behavior, but it adds a safety net for cases where the parameter is missing.

Safari View Controller is the exception due to its user agent being indistinguishable from a regular Safari browser, so there's no reliable way for Topper to detect it automatically. Therefore is_safari_view_controller=1 must always be set for that scenario to be recognized.

Cloudflare Turnstile​

We use Cloudflare Turnstile to confirm users are real and to block unwanted bots without slowing down the experience. Please be sure to follow these Webview configurations, update the allowed origins to include challenges.cloudflare.com, about:blank, about:srcdoc, and enable https and http connections.

If you use the react-native-webview package, update your WebView originWhitelist to originWhitelist={['https://*', 'http://*', 'about:blank', 'about:srcdoc']}.

If you use Flutter, Turnstile is compatible and tested with Flutter’s WebView implementation.