How to detect platform using Ionic 4

Is there a workaround for this yet?
Detecting ‘core’ or desktop browser in any way other than screen size?

This just got updated yesterday. Looks like ‘core’ is supposed to work. I know it doesn’t now, but maybe in the next update?

1 Like

I am using

this.isApp = (!document.URL.startsWith(‘http’) || document.URL.startsWith(‘http://localhost:8080’));

So if isApp is true I am running native on Android or IOS else it is in the browser

@btsiders Great, looking forward to it. Thanks for the heads up.
@developergeme Thanks for that too. I’ll try it tomorrow if there is no update.
Cheers

Desktop is now detected in 4.0.0-beta.4

1 Like

For me it’s still showing android platform while detecting in desktop.

Below is my ionic info :

Ionic:
ionic (Ionic CLI) : 4.1.1 (C:\Users\test\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : @ionic/angular 4.0.0-beta.1
@angular-devkit/core : 0.7.2
@angular-devkit/schematics : 0.7.2
@angular/cli : 6.1.2
@ionic/ng-toolkit : 1.0.5
@ionic/schematics-angular : 1.0.4

Cordova:

cordova (Cordova CLI) : 8.0.0
Cordova Platforms : android 6.2.3
Cordova Plugins : cordova-plugin-ionic-keyboard 2.0.5, cordova-plugin-ionic-webview 2.0.0, (and 4 other plugins)

System:

Android SDK Tools : 26.1.1 (C:\Users\test\AppData\Local\Android\sdk)
NodeJS : v8.11.3 (C:\Program Files\nodejs\node.exe)
npm : 5.6.0
OS : Windows 10

Your are still using beta.1.

Here is a post with some upgrade instructions;

Note: the current is Beta 5 but the desktop detection came in beta 4.

Thanks for upgrade instructions.

On Ionic 4 Platform is unber ‘@ionic/angular’

import { Platform } from ‘@ionic/angular’;

I did

console.log(platform.platforms());

to get the platform names when I was debugging on my browser. Note that this gives different platform names if you are testing from real android or ios device.

I also did

if(platform.is('mobileweb')){ .... }

to check if my platform was a browser.

i get the result same :-1:
if (this.platform.is(‘desktop’)) {
alert(‘desktop’);
} else if (this.platform.is(‘ios’)) {
alert(‘ios’);
} else if (this.platform.is(‘android’)) {
alert(‘android’);
// fallback to browser APIs
}
But default http://localhost:8100/home
show the result ‘android

I tried console.log(platform.platforms()); and tested this statement in different devices, once on browser and once on real device, it did return different platform values available.

image

1 Like

i also use second way
image
But output get on browser
image

That’s the thing. It outputs different platforms based on the device. So we can’t predict accurately which platform we are actually on.

You can use Capacitor’s Device API:

import { Plugins } from '@capacitor/core';

const { Device } = Plugins;

const info = await Device.getInfo();
console.log(info);

It outputs platform:

{model: "Macintosh", platform: "web", appVersion: "", osVersion: "10.14.5", manufacturer: "Google Inc.", …}

1 Like

This works for me: https://stackoverflow.com/a/60306165/1077309

if your using capacitor, I found this way to be really cool and simple

import { Capacitor } from '@capacitor/core'

...

console.log(Capacitor.isNative) // --> false
console.log(Capacitor.platform) // --> "web"
console.log(Capacitor.getPlatform()) // --> "web"

this is on a Mac OSX testing (due to having the inapp purchase)

more info:

if Browser insect mode with device frame ios then platform.is(‘ios’) is triggering.
and platform.is(‘cordova’) not working in ionic 3.
any suggestion please.