Wykryj użytkowników iPada przy użyciu jQuery?

Question

Czy istnieje sposób na sprawdzenie, czy bieżący użytkownik używa iPada przy użyciu jQuery/JavaScript?

Answer 1

Wykrywanie iPad

Powinieneś być w stanie wykryć użytkownik iPada przez przyjrzeniu nieruchomości userAgent:

var is_iPad = navigator.userAgent.match(/iPad/i) != null; 

iPhone/Detekcja iPod

Podobnie, Właściwość sprawdzania urządzeń takich jak iPhone lub iPod:

function is_iPhone_or_iPod(){ 
    return navigator.platform.match(/i(Phone|Pod))/i) 
} 

Uwagi

Chociaż to działa, należy generalnie unikać wykonywania wykrywania przeglądarki specyficzne jak często może być zawodna (i mogą być sfałszowane). W większości przypadków preferowane jest używanie rzeczywistego feature-detection, co można zrobić za pomocą biblioteki takiej jak Modernizr.

Jak wskazano w Brennen's answer, mogą wystąpić problemy podczas wykonywania tego wykrycia w aplikacji Facebook. Zobacz odpowiedź na ten scenariusz.

Pokrewne zasoby

• jQuery HowTo: Detect iPad users using JavaScript
• jQuery HowTo: Detecting & Redirecting iPad/iPhone Users
• David Walsh's Blog : Detecting iPad use
• Detecting iPad use via PHP

Answer 2

Używam tego:

function fnIsAppleMobile() 
{ 
    if (navigator && navigator.userAgent && navigator.userAgent != null) 
    { 
     var strUserAgent = navigator.userAgent.toLowerCase(); 
     var arrMatches = strUserAgent.match(/(iphone|ipod|ipad)/); 
     if (arrMatches != null) 
      return true; 
    } // End if (navigator && navigator.userAgent) 

    return false; 
} // End Function fnIsAppleMobile 


var bIsAppleMobile = fnIsAppleMobile(); // TODO: Write complaint to CrApple asking them why they don't update SquirrelFish with bugfixes, then remove 

Answer 3

Chociaż accepted solution jest poprawna dla iPhone, będzie nieprawidłowo deklarują zarówno isiPhone i isiPad być prawdziwe dla użytkowników odwiedzających witrynę na swoim iPadzie z aplikacji Facebook.

Tradycyjna mądrość polega na tym, że urządzenia iOS mają klienta użytkownika dla przeglądarki Safari i agenta użytkownika dla interfejsu UIWebView. To założenie jest nieprawidłowe, ponieważ aplikacje na iOS mogą i dostosowują swój agent użytkownika. Głównym sprawcą jest Facebook.

Porównaj te ciągi agenta użytkownika z urządzeniami z iOS:

# iOS Safari 
iPad: Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9B176 Safari/7534.48.3 
iPhone: Mozilla/5.0 (iPhone; CPU iPhone OS 5_0 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9A334 Safari/7534.48.3 

# UIWebView 
iPad: Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/98176 
iPhone: Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Mobile/8B117 

# Facebook UIWebView 
iPad: Mozilla/5.0 (iPad; U; CPU iPhone OS 5_1_1 like Mac OS X; en_US) AppleWebKit (KHTML, like Gecko) Mobile [FBAN/FBForIPhone;FBAV/4.1.1;FBBV/4110.0;FBDV/iPad2,1;FBMD/iPad;FBSN/iPhone OS;FBSV/5.1.1;FBSS/1; FBCR/;FBID/tablet;FBLC/en_US;FBSF/1.0] 
iPhone: Mozilla/5.0 (iPhone; U; CPU iPhone OS 5_1_1 like Mac OS X; ru_RU) AppleWebKit (KHTML, like Gecko) Mobile [FBAN/FBForIPhone;FBAV/4.1;FBBV/4100.0;FBDV/iPhone3,1;FBMD/iPhone;FBSN/iPhone OS;FBSV/5.1.1;FBSS/2; tablet;FBLC/en_US] 

Zauważ, że na iPadzie, ciąg agenta użytkownika Facebook UIWebView obejmuje „iPhone”.

Stary sposób zidentyfikować iPhone/iPad w JavaScript:

IS_IPAD = navigator.userAgent.match(/iPad/i) != null; 
IS_IPHONE = navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null); 

Jeśli było iść z tym podejściem do wykrywania iPhone i iPad, by skończyć z IS_IPHONE i IS_IPAD zarówno bycia prawdziwym, jeśli użytkownik pochodzi z Facebooka na iPadzie. To może stworzyć dziwne zachowanie!

Prawidłowy sposób zidentyfikować iPhone/iPad w JavaScript:

IS_IPAD = navigator.userAgent.match(/iPad/i) != null; 
IS_IPHONE = (navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null); 
if (IS_IPAD) { 
    IS_IPHONE = false; 
} 

Oświadczamy IS_IPHONE się fałszywe na iPadach na pokrycie dziwacznej Facebook UIWebView iPad agenta użytkownika. Jest to jeden z przykładów na to, jak wąskie gardło użytkownika nie jest wiarygodne. Im więcej aplikacji na iOS dostosuje ich agent użytkownika, tym więcej problemów będzie miało podsłuchiwanie użytkownika. Jeśli możesz uniknąć wąchania agenta użytkownika (wskazówka: Zapytania o media CSS), ZRÓB TO.

Answer 4

Używam tego:

//http://detectmobilebrowsers.com/ + tablets 
(function(a) { 
    if(/android|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(ad|hone|od)|iris|kindle|lge |maemo|meego.+mobile|midp|mmp|netfront|opera m(ob|in)i|palm(os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino|playbook|silk/i.test(a) 
    || 
    /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s)|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp(i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac(|\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt(|\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg(g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v)|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v)|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-|)|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) 
    { 
     window.location="yourNewIndex.html" 
    } 
})(navigator.userAgent||navigator.vendor||window.opera); 

Answer 5

Nie potrzeba jQuery tutaj. Użycie agenta użytkownika do określenia platformy, na której pracujesz, to klasyczne podejście. To nie jest tak proste, jak się wydaje - już wspomniano, że istnieje wiele przypadków skrajnych, w które możesz wpaść.

Napisałem ten kod is-mobile component, który może wykryć, czy używasz iPada, iPhone'a i innych platform, a także bierze pod uwagę różne przypadki skrajne.

Zapraszam do importowania i używać go w sposób pokazany na poniższych przykładach:

isMobile.iPad() => true/false 
isMobile.iPhone() => true/false 
isMobile.iOS() => true/false 
isMobile.Android() => true/false 
isMobile.any() => true/false