56

I use Javascript code

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

for mobile device detection, but Chrome at iOS is not detected. Is there a way to detect it? Thanks.

cr1msaun
  • 717
  • 1
  • 5
  • 10
  • Why do you need to do this? – Blender Dec 10 '12 at 19:34
  • i need this for special visual effects visible only on desktops – cr1msaun Dec 10 '12 at 19:39
  • 1
    Detect if the browser has touch support and apply a class to the `body` element. Modernizr does this. – Blender Dec 10 '12 at 19:40
  • 1
    People get way too sensitive about this being always bad practice. I'm utilising this so we can give browser-specific instructions to users about how to enable cookies. Perfectly valid, and until said instructions become accessible via a Javascript `window` property (probably never), it'll remain perfectly valid. – andrewb Oct 28 '16 at 02:20

4 Answers4

141

According to Google Developers, the UA string looks like this:

Mozilla/5.0 (iPhone; U; CPU iPhone OS 5_1_1 like Mac OS X; en) AppleWebKit/534.46.0 (KHTML, like Gecko) CriOS/19.0.1084.60 Mobile/9B206 Safari/7534.48.3

Where it differs from iOS Safari in that it says CriOS instead of Version. So this:

if(navigator.userAgent.match('CriOS'))

Should do it.

Belladonna
  • 3,824
  • 2
  • 24
  • 33
  • 2
    You use browser sniffing to fight very specific browser bugs. – Yuji 'Tomita' Tomita Nov 07 '13 at 19:19
  • 17
    I have to use this because chrome on ios is considered an "unsupported browser" for facebook's login system. No way to do feature detection on that. – Soviut Feb 03 '14 at 18:22
  • Chrome on iOS works exactly the same as Safari, and even have less bugs related to auto-disappear of address bar and bottom navigation bar, which Chrome doesn't have. Chrome on iOS exists. In August 2017, 1,377,323 users in the U.S. are using Chrome on iPhone 6/7/S, and another 1,262,546 users are using Chrome on iPad, and users exist who're using Chrome on iPhone 5. @Soviut please consider changing your comment to update the situation in 2017. Hope Facebook considers iOS Chrome as supported browser now. – Brian Cannard Sep 04 '17 at 23:45
  • 7
    @BrianHaak Chrome on iOS doesn’t support webcam access. Safari does. A very specific reason to detect chrome on iOS. – jmc May 17 '18 at 05:53
  • 3
    @BrianHaak Chrome on iOS doesn't support serviceWorkers either even though Safari does. Decision by Apple to repress that part of it. – Martin Joiner Mar 14 '19 at 11:52
  • Apple Pay for mobile won't work on Chrome iOS or any other browser other than Safari iOS , this hack/trick will filter out Chrome , but how about other iOS safari based browsers like Firefox for iOS or Opera for iOS, this can't be counted as final solution unfortunately – Mg Gm Dec 13 '21 at 12:14
  • You also can't install PWAs from Chrome on iOS, you can only do so from Safari, so you would need to detect browsers so you can display a message instructing users either to install the PWA (if on Safari) or to navigate to Safari to continue installing. Honestly, this answer shouldn't have been so hard to find -- why did I have to wade through dozens of "you shouldn't do this" posts to get here? – ipenguin67 Aug 17 '23 at 16:20
18

if you want simple true/false answer:

if(/CriOS/i.test(navigator.userAgent) &&
/iphone|ipod|ipad/i.test(navigator.userAgent)){
    return true;
}else{
    return false;
}
Vasily Kabunov
  • 6,511
  • 13
  • 49
  • 53
Chen_Wayne
  • 583
  • 5
  • 4
-3

Perhaps, you could try:

var os = navigator.platform;

Then handle the os variable accordingly for your result.

You can also loop through each object of the navigator object to help get you more familiarized with the objects:

<script type="text/javascript">
for(var i in navigator){
    document.write(i+"="+navigator[i]+'<br>');
}
</script>

As found in this anwser: jQuery/Javascript to detect OS without a plugin?

Community
  • 1
  • 1
marcelo-ferraz
  • 3,147
  • 4
  • 38
  • 55
-5

you can use 51Degrees' free cloud based solution to get this information. As part of the free cloud service you have access to the BrowserName property which includes Chrome for iOs.

Some sample code you could use is below. You can get the free cloud key by going through the store page here https://51degrees.com/products/store/rvdsfcatid/cloud-device-detection-7

<!DOCTYPE html>
<html>
<body>
<p id="id01"></p>
<script>
var xmlhttp = new XMLHttpRequest();
<!-- Insert Cloud key here. -->
var key = "Licence Key"
<!-- Receives UserAgent from clients connection. -->
var ua = window.navigator.userAgent;

<!-- Lists the properties required. -->
var url = ("https://cloud.51degrees.com/api/v1/"+key+"/match?user-agent="+ua+"&Values=\
    BrowserName");

<!-- Parses the JSON object from our cloud server and returns values. -->
xmlhttp.onreadystatechange = function(){
    if ( xmlhttp.readyState == 4 && xmlhttp.status == 200){
        var match = JSON.parse(xmlhttp.responseText);
        var text = ""
        document.getElementById("id01").innerHTML=\
        "UserAgent:"+ua+"</br>"+
        "BrowserName:"+match.Values.BrowserName;
    }
}       
<!-- Sends request to server. -->
xmlhttp.open("GET", url, true);
xmlhttp.send();     
</script>
</body>
</html>

For more information on use of the JavaScript Cloud API you can view more tutorials here https://51degrees.com/Developers/Documentation/APIs/Cloud-API/JavaScript-Cloud

Disclosure: I work at 51Degrees

Zarwalski
  • 69
  • 1
  • 9