9

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.

sebagomez
  • 9,501
  • 7
  • 51
  • 89
  • possible duplicate of [Detecting a mobile browser](http://stackoverflow.com/questions/11381673/detecting-a-mobile-browser) –  May 05 '15 at 19:25
  • 1
    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 – sebagomez May 06 '15 at 14:08

3 Answers3

12

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.

Peter Torr - MSFT
  • 11,824
  • 3
  • 18
  • 51
  • This is exactly the kind of answer I was looking for! – sebagomez May 08 '15 at 20:10
  • 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. – Eugen Timm Nov 12 '15 at 12:05
  • Such a pity that UWP doesnt have separation for mobile and tablet? How can we design our UI for surface tablets in this case? – Emil Feb 06 '19 at 00:18
  • Is screen size insufficient for your needs? – Peter Torr - MSFT Feb 07 '19 at 16:27
1

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

Answer from Github WinJS repo

Community
  • 1
  • 1
carlos a.
  • 188
  • 10
  • 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 – sebagomez May 05 '15 at 15:22
  • dear sebagomez i´m check and this property is supported with WP8.1 apps https://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 – carlos a. May 05 '15 at 15:40
  • I'm talking about windows 10 – sebagomez May 05 '15 at 15:50
  • 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 https://github.com/winjs/winjs/issues/601 – carlos a. May 05 '15 at 16:07
  • thaks Carlos, you can add an answer referencing that issue and I'd mark it as the answer – sebagomez May 05 '15 at 16:52
0

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

borisano
  • 1,270
  • 1
  • 16
  • 28
  • 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 – sebagomez May 05 '15 at 15:21