1

I'm using UserAgentData browser API to detect whether user has visited my page from mobile device or not. In browsers which supports it, it is quite simple and works well:

const isMobile = window.navigator.userAgentData?.mobile

Problem is that if device is mobile I want to also detect its type, whether it is phone or tablet. I do not want to parse navigator.userAgent string (or use existing libraries which do the same thing). I also do not want to look at device screen width/height and orientation, as as I understand device pixel density can be misleading here. So I'm using high entropy data from userAgentData API to obtain device model:

const detailedUserAgentData = await window.navigator.userAgentData?.getHighEntropyValues(['model']);

Here I have device model name, but still don't know what to do with it - is there any publicly available, open source, regularly updated data base from which I could obtain device type just by its name?

Furman
  • 2,017
  • 3
  • 25
  • 43
  • You indicate that you don't want to look at device or screen width/height but you want to know if you are seeing a phone or tablet. Can I ask what you will do with your findings once you know phone or tablet? I can only presume the difference will change how you render content... (smaller screen gets X, larger screen gets Y)... and if so, don't you really want to know screen size? (the key being to apply the DPI AND device pixel ratio to get the right screen size) – scunliffe Mar 18 '22 at 14:23
  • I don't need that knowledge to render anything, just for statistical purposes (to see how many people visits my page from phone, tablet and desktop devices). "apply the DPI" - any tip how can I do that? – Furman Mar 19 '22 at 09:05

0 Answers0