web-dev-qa-db-de.com

Wie erkennen Sie zwischen einem Desktop und einem Mobile Chrome User Agent?

Bei einer Chrome Desktop Extension-Startseite versuche ich herauszufinden, ob ein Benutzer Chrome für Desktop oder Chrome für Mobile unter Android verwendet. Derzeit identifiziert das folgende Skript Android Chrome genauso wie Desktop Chrome. Auf dem Desktop-Chrome sollte der Link "Chrome" angezeigt werden. Befindet sich jedoch jemand in Chrome für Android, zeigt sollte den Link "Mobile-Other" an. 

Skript:

<script>$(document).ready(function(){
    var ua = navigator.userAgent;
    if (/Chrome/i.test(ua))
       $('a.chrome').show();

    else if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile/i.test(ua))
       $('a.mobile-other').show();

    else
       $('a.desktop-other').show();
  });</script>

Chrome Android User Agent:

Mozilla/5.0 (Linux; <Android Version>; <Build Tag etc.>) AppleWebKit/<WebKit Rev> (KHTML, like Gecko) Chrome/<Chrome Rev> Mobile Safari/<WebKit Rev>
16
WoJo

Das Problem ist, dass der Benutzeragent immer "Chrome" hat, unabhängig davon, ob es sich um eine Desktop- oder mobile Version handelt. Sie müssen also zuerst den genaueren Fall prüfen.

$(document).ready(function(){
    var ua = navigator.userAgent;

    if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(ua))
       $('a.mobile-other').show();

    else if(/Chrome/i.test(ua))
       $('a.chrome').show();

    else
       $('a.desktop-other').show();
});
23
imtheman

So aktualisieren Sie den Code von @ imtheman gemäß der neuesten Benutzer-Agent-Zeichenfolge von Chrome für iOS:

$(document).ready(function(){
var ua = navigator.userAgent;

if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(ua))
   $('a.mobile-other').show();

else if (/Chrome/i.test(ua))
   $('a.chrome').show();

else
   $('a.desktop-other').show();
});
2
Charlse Peng