Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Phone Browser Detection

I have an web application where mobile phone users see a mobile optimized website. The new Samsung Galaxy SIII user agent provides no clue that the request is coming from a mobile phone. What are the best pratices to detect mobile phones?

I'm aware of javascript feature detection (ie. modernizer) but am hoping for something better. Below is the Samsung Galaxy SIII user agent:

Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.34 Safari/534.24

EDIT: The SIII has two possible user agents. Above is the 'desktop' version. Fun stuff. See link below for details.

http://www.anandtech.com/Show/Index/5310?cPage=19&all=False&sort=0&page=5&slug=samsung-galaxy-nexus-ice-cream-sandwich-review

like image 424
SemanticZen Avatar asked Jul 22 '12 05:07

SemanticZen


People also ask

How do you detect a mobile browser in JS?

How to use navigator. userAgent to detect browser type and display content based on the specific browser? Alright, so, there might be a unique use case where you want to detect a specific browser, such as Chrome and Firefox (or in this case, Android and iPhone), and then use that data to display specific content.

How do you check which browser is being used?

In the browser's toolbar, click on “Help"or the Settings icon. Click the menu option that begins “About” and you'll see what type and version of browser you are using.

What is browser detection in JavaScript?

JavaScript has a standard object called navigator that contains data about the browser being used. The navigator object has a lot of properties, but the . userAgent property — a string that contains data about the browser, operating system, and more– is all we'll need.


2 Answers

Looking at that user agent, I'd have to say that, that would be extremely difficult to differentiate from a non-handheld device.

The problem with browser detection is that it's obviously easy to tweak the user agent string, and thus you never really know if what the server is telling you is honest or not.

You have two options in this case:

  • You can check every single header the phone sends and maybe see if there is one that could make it unique

  • Or find some type of work-around by testing page load time etc..., As a whimsical example, browsers on handheld devices usually render pages a bit slower than their desktop counterparts, so after testing every possible mobile device with something like:

-

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ) {
 // some code..
}

You can see if a page with nothing else but a simple script is not loading in it's ideal time.

You get the point.

Also, try going here and see if it can detect you: http://detectmobilebrowsers.com/

like image 65
pat34515 Avatar answered Oct 10 '22 08:10

pat34515


The "desktop mode" user agent is designed so that the web server doesn't deliver a mobile/tablet interface when the user has deliberately chosen to have the desktop mode - it is a usability anti-pattern to remove that choice from the user.

If you absolutely *must* override the user's choice, then in JavaScript currently (2013) if all the following are true then it very likely is an Android device:

  1. 'ontouchstart' in document.documentElement
  2. navigator.vendor === 'Google Inc.'
  3. /^Linux armv/.test(navigator.platform)

However the above will give false positives and negatives with some less common browser setups e.g. an ARM based ChromeBook with touch, e.g. maybe Chromium running on Linux with an ARM processor (although perhaps that is Linux/ARM), e.g. maybe other browsers Firefox/Opera etc e.g. an Android device that is not touch based like a TV e.g. can Chrome run on Windows RT with an ARM processor? e.g. an Android running on Intel.

like image 41
robocat Avatar answered Oct 10 '22 09:10

robocat