0

I develop apps for Android/iOS using Cordova/Phonegap. I generally use a single code base for my web and mobile content. I use a SQLite database and/or other native plugins when it is a mobile app and have to avoid those LOCs when I'm on web.

But I'm facing a problem identifying whether my app is being run on a web browser on Desktop/Mac/Android/iOS or as a mobile app (Android/iOS).

I have tried userAgent sniffing, but this regex technique fails especially when running the code on mobile browsers. Following is the code I used to identify OS and version of the device:

getOSAndVersion: function() {
        var that = this;
        var userOS;    // will either be iOS, Android or unknown
        var userOSver; // this is a string, used to denote OS version
        var ua = navigator.userAgent;
        var uaindex;

        if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(ua)) {
            window.deviceType = "Mobile";                                  
        } else {
            window.deviceType = "Web";                    
        }

        // determine OS
        if (ua.match(/iPad/i) || ua.match(/iPhone/i)) {
            userOS = 'iOS';
            uaindex = ua.indexOf('OS ');
        }
        else if (ua.match(/Android/i)) {
            userOS = 'Android';
            uaindex = ua.indexOf('Android ');
        }
        else {
            userOS = 'unknown';
        }

        // determine version
        if (userOS === 'iOS' && uaindex > -1) {
            userOSver = ua.substr(uaindex + 3, 3).replace('_', '.');
        }
        else if (userOS === 'Android' && uaindex > -1) {
            userOSver = ua.substr(uaindex + 8, 3);
        }
        else {
            userOSver = 'unknown';
        }
        return { osVersion: userOSver, os: userOS, deviceType: window.deviceType };
    }

Is there any other technique I can use to reliably identify where my code is being run?

P.S. : I'm averse to using any other Cordova/JS plugin to identify it but still open for discussion.

Anuj Batwe
  • 35
  • 7

2 Answers2

1

In Cordova when app is runing into app the url is prefixed by file:// and when running in mobile browser the url is prefixed with http or https protocal.

Solution :

  1. Get url of you current page (check this)
  2. Identify its prefix if file:// the its app
  3. If http or https then mobile browser
Community
  • 1
  • 1
KOTIOS
  • 11,177
  • 3
  • 39
  • 66
  • @MyMasterPiece thanks a lot. Worked great in Android. can you confirm whether this works in iOS? – Anuj Batwe Jun 20 '16 at 12:19
  • 1
    yes its working in IOS also, you can also chk in any of online simulator also – KOTIOS Jun 20 '16 at 12:26
  • This didn't work for me on iOs when I loaded a live site in this way: ``. Which has its limitations I guess. – Jake Oct 28 '16 at 20:28
0

You could just check if cordova is defined?

if (cordova) {
    // Running in your app
} else {
    // Not running in your app, so website
}
Simon Prickett
  • 3,838
  • 1
  • 13
  • 26