Is there a correct/recommended way of detecting my UWP app I'm running on a Phone?

Question

Trying out Windows Universal apps with JavaScript I noticed the WinJS.Utilities.isPhone property is no longer available, which makes sense since there would be no reason to ask for that at runtime.

I do want to know just for testing purposes if there is a proper way of detecting the device my app is running in.

EDIT: My question is NOT about detecting a mobile browser. I'm talking about about a brand new Universal Windows App for Window 10 that can run on phones, desktops, tablets, Xbox, HoloLEns, IoT devices et all. WinJS had a property that would tell me whether I was running on the phone or not. That property is now gone. Please don't close this question due to duplicate with "detecting mobile browser". That is NOT what I need.

Felipe

possible duplicate of Detecting a mobile browser – Acyl

it is not a duplicate... I extended my question so every body understands what I'm asking... please read the whole question before proposing an answer – Felipe

Answer 1

Caveat: Any form of device detection is fragile due to the dynamic nature of hardware - a new device could come along tomorrow that breaks your app's logic. It is best to use these APIs only for telemetry / analytics rather than to trigger runtime behaviour.

More often than not, what you really want to know is some attribute of the device or the app that is not inherently tied to the device family (does this device support SystemTray API? Is there a keyboard attached? Is the window more than 500px wide? etc.).

That said, in Windows 10 you can query the DeviceFamily via AnalyticsInfo.VersionInfo.DeviceFamily and it will tell you things like "Mobile" or "Desktop" or "Xbox" etc. (where "Mobile" could be any class of device - phone, tablet, etc.). There is also a property DeviceForm that might be helpful, but again you can't really rely on it at runtime to deterministically say you're running on "a phone."

So basically the answer is "you can use these APIs for telemetry but don't hard-code any values into your app lest it break when a new device arrives on the market." At the very least, always make sure you handle the case where the returned value isn't one you know about a-priori.

Scamp

This is exactly the kind of answer I was looking for! – Felipe

I totally understand what Microsoft was trying to do with UWP, but in some places the ugly side of WinRT still shines through. Take a look at the WebAuthenticationBroker class. It just DOESN'T work the same way on a Phone or Desktop device. And you always end up having two entirely (and I mean ENTIRELY) different implementations of the same thing. So yes, the DeviceFamily helper is absolutely required. – Bunker

Such a pity that UWP doesnt have separation for mobile and tablet? How can we design our UI for surface tablets in this case? – Agitator

Is screen size insufficient for your needs? – Scamp

Answer 2

You can also check out the following links http://www.abeautifulsite.net/detecting-mobile-devices-with-javascript/ http://www.sitepoint.com/detect-mobile-devices-jquery/

and of course a similar post here on stackoverflow with a good answer

Detecting a mobile browser

And talking about Windows 10, extracting from Winjs Github repo, here is the answer.

https://github.com/winjs/winjs/issues/601#issuecomment-87137485

Contractor

Again, people don't read the questions. I'm talking about a UWP app, not web. I want to know if WinJS brings an out-of-the-box property like it used to – Felipe

dear sebagomez i´m check and this property is supported with WP8.1 apps msdn.microsoft.com/en-us/library/windows/apps/dn607959.aspx also i´m sorry you´re right .. i´m making a partial read, but i think if it is not longer availableyou should consider adding an external library to perform the verification process – Contractor

I'm talking about windows 10 – Felipe

Dear sebagomez you must be more specific in the original question , and research about it all he could do now is to check the screen resolution and work from there to your validations , as mentioned here github.com/winjs/winjs/issues/601 – Contractor

thaks Carlos, you can add an answer referencing that issue and I'd mark it as the answer – Felipe

Answer 3

There are numerous JS libs to detect which platform/device is used.

I personally love using this lib: https://github.com/kaimallea/isMobile

You will then be able to detect mobile device in such a way:

isMobile.apple.tablet
isMobile.android.phone

and so on.

In case you have an idea to implement such lib yourself, keep in mind that it takes some efforts to keep it up-to-date, because ways of detecting mobile device may change over time.

In general, common way of detecting user device is checking query headers.

Keep in mind, though, that you can't absolutely rely on this information - headers may be easily modified. Google for User Agent for more info.

So "omitting auth process for users with phones" is extremely bad idea

Pitzer

Sorry, but I'm talking about a UWP app, not a web app. Although your first answer might also work. Will take a look at that. Thanks – Felipe