Detect if user is using webview for android/iOS or a regular browser

Question

How to detect if the user is browsing the page using webview for android or iOS?

There are various solutions posted all over stackoverflow, but we don't have a bulletproof solution yet for both OS.

The aim is an if statement, example:

if (android_webview) {     jQuery().text('Welcome webview android user'); } else if (ios_webview) {     jQuery().text('Welcome webview iOS user'); } else if (ios_without_webview) {     // iOS user who's running safari, chrome, firefox etc     jQuery().text('install our iOS app!'); } else if (android_without_webview) {     // android user who's running safari, chrome, firefox etc     jQuery().text('install our android app!'); } 

What I've tried so far

Detect iOS webview (source):

if (navigator.platform.substr(0,2) === 'iP'){    // iOS (iPhone, iPod, iPad)   ios_without_webview = true;    if (window.indexedDB) {     // WKWebView     ios_without_webview = false;      ios_webview = true;    }  } 

Detect android webview, we have a number of solutions like this and this. I'm not sure what's the appropriate way to go because every solution seems to have a problem.

Answer 1

Detecting browser for iOS devices is different from the Android one. For iOS devices you can do it by checking user agent using JavaScript:

var userAgent = window.navigator.userAgent.toLowerCase(),     safari = /safari/.test( userAgent ),     ios = /iphone|ipod|ipad/.test( userAgent );  if( ios ) {     if ( safari ) {         //browser     } else if ( !safari ) {         //webview     }; } else {     //not iOS }; 

For Android devices, you need to do it through server side coding to check for a request header.

PHP:

if ($_SERVER['HTTP_X_REQUESTED_WITH'] == "your.app.id") {     //webview } else {     //browser } 

JSP:

if ("your.app.id".equals(req.getHeader("X-Requested-With")) ){     //webview } else {     //browser } 

Ref:detect ipad/iphone webview via javascript

Answer 2

Note: This solution is PHP-based. HTTP headers can be faked so this is not the nicest solution but you can have a start with this.

//For iOS  if ((strpos($_SERVER['HTTP_USER_AGENT'], 'Mobile/') !== false) && (strpos($_SERVER['HTTP_USER_AGENT'], 'Safari/') == false) {     echo 'WebView'; } else{     echo 'Not WebView'; }  //For Android  if ($_SERVER['HTTP_X_REQUESTED_WITH'] == "com.company.app") {     echo 'WebView'; } else{     echo 'Not WebView'; }