Automatyczne wykrywanie przeglądarki mobilnej (przez user-agent?) [zamknięte]

Istnieją Skrypty open source na Detect Mobile Browser, które robią to w Apache, ASP, ColdFusion, JavaScript i PHP.

Tak sobie pomyślałem, ale co, jeśli pracowałbyś nad tym problemem z przeciwnej strony? Zamiast określać, które przeglądarki są mobilne, dlaczego nie określić, które przeglądarki nie są? Następnie Zakoduj swoją witrynę do domyślnej wersji mobilnej i Przekieruj do wersji standardowej. Istnieją dwie podstawowe możliwości przeglądania mobilnej przeglądarki. Albo ma obsługę javascript, albo nie. więc jeśli przeglądarka nie ma obsługi javascript, domyślnie będzie to wersja mobilna. Jeśli ma Obsługa JavaScript, Sprawdź rozmiar ekranu. Wszystko poniżej określonego rozmiaru będzie prawdopodobnie również przeglądarką mobilną. Wszystko większe zostanie przekierowane do standardowego układu. Następnie wszystko, co musisz zrobić, to określić, czy użytkownik z wyłączonym JavaScript jest mobilny, czy nie.
Według W3C liczba użytkowników z wyłączonym JavaScript wynosiła około 5%, a większość z nich wyłączyła go, co oznacza, że faktycznie wiedzą, co robią z przeglądarką. Czy są one dużą częścią twojego publiczność? Jeśli nie, to nie martw się o nich. Jeśli tak, to jaki jest najgorszy scenariusz? Masz tych użytkowników, którzy przeglądają mobilną wersję Twojej witryny, i to dobrze.

Oto Jak to robię w JavaScript:

function isMobile() {
  var index = navigator.appVersion.indexOf("Mobile");
  return (index > -1);
}

Zobacz przykład na www.tablemaker.net/test/mobile.html gdzie potraja rozmiar czcionki w telefonach komórkowych.

Moim ulubionym mechanizmem wykrywania przeglądarek mobilnych jest WURFL . Jest często aktualizowany i działa z każdą główną platformą programistyczną / językową.

Rozważałeś użycie CSS3 media queries? W większości przypadków można zastosować niektóre style css specjalnie dla docelowego urządzenia bez konieczności tworzenia osobnej mobilnej wersji witryny.

@media screen and (max-width:1025px) {
   #content {
     width: 100%;
   }
}

Możesz ustawić szerokość na dowolną, ale 1025 złapie widok krajobrazowy iPada.

Będziesz również chciał dodać następujący meta tag do swojej głowy:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Sprawdź Ten artykuł w HTML5 Rocks dla kilku dobrych przykładów

Dla ANDROID , IPHONE, IPAD, BLACKBERRY, PALM, WINDOWS CE, PALM

 <script language="javascript"> <!--
     var mobile = (/iphone|ipad|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));
              if (mobile) {
                  alert("MOBILE DEVICE DETECTED");
                  document.write("<b>------------------------------------------<br>")
                  document.write("<b>" + navigator.userAgent + "<br>")
                  document.write("<b>------------------------------------------<br>")
                  var userAgent = navigator.userAgent.toLowerCase();
                  if ((userAgent.search("android") > -1) && (userAgent.search("mobile") > -1))
                         document.write("<b> ANDROID MOBILE <br>")
                   else if ((userAgent.search("android") > -1) && !(userAgent.search("mobile") > -1))
                       document.write("<b> ANDROID TABLET <br>")
                   else if ((userAgent.search("blackberry") > -1))
                       document.write("<b> BLACKBERRY DEVICE <br>")
                   else if ((userAgent.search("iphone") > -1))
                       document.write("<b> IPHONE DEVICE <br>")              
                   else if ((userAgent.search("ipod") > -1))
                       document.write("<b> IPOD DEVICE <br>")
               else if ((userAgent.search("ipad") > -1))
                       document.write("<b> IPAD DEVICE <br>")
                       else
                   document.write("<b> UNKNOWN DEVICE <br>")
              }
              else
                  alert("NO MOBILE DEVICE DETECTED"); //--> </script>

Plik przeglądarki urządzenia mobilnego to świetny sposób na wykrywanie mobilnych (i innych) przeglądarek dla ASP.NET projekty: http://mdbf.codeplex.com/

Możesz wykryć klientów mobilnych po prostu przez navigator.userAgent, i załadować alternatywne Skrypty na podstawie wykrytego typu klienta jako:

 $(document).ready(function(e) {

        if(navigator.userAgent.match(/Android/i)
          || navigator.userAgent.match(/webOS/i)
          || navigator.userAgent.match(/iPhone/i)
          || navigator.userAgent.match(/iPad/i)
          || navigator.userAgent.match(/iPod/i)
          || navigator.userAgent.match(/BlackBerry/i)
          || navigator.userAgent.match(/Windows Phone/i)) {

         //write code for your mobile clients here.

          var jsScript = document.createElement("script");
          jsScript.setAttribute("type", "text/javascript");
          jsScript.setAttribute("src", "js/alternate_js_file.js");
          document.getElementsByTagName("head")[0].appendChild(jsScript );

          var cssScript = document.createElement("link");
          cssScript.setAttribute("rel", "stylesheet");
          cssScript.setAttribute("type", "text/css");
          cssScript.setAttribute("href", "css/alternate_css_file.css");
          document.getElementsByTagName("head")[0].appendChild(cssScript); 

    }
    else{
         // write code for your desktop clients here
    }

    });

Możesz sprawdzić ciąg User-Agent. W JavaScript jest to naprawdę proste, jest to po prostu właściwość obiektu navigator.

var useragent = navigator.userAgent;

Można sprawdzić, czy urządzenie, jeśli iPhone lub Blackberry w JS z czymś takim

var isIphone = !!agent.match(/iPhone/i),
    isBlackberry = !!agent.match(/blackberry/i);

Jeśli isIphone jest prawdą, że uzyskujesz dostęp do witryny z Iphone ' a, jeśli isBlackBerry uzyskujesz dostęp do witryny z Blackberry.

Możesz użyć wtyczki" UserAgent Switcher " dla Firefoksa, aby to przetestować.

Http://blog.sebarmeli.com/2010/11/02/how-to-redirect-your-site-to-a-mobile-version-through-javascript/

protected void Page_Load(object sender, EventArgs e)
{
    if (Request.Browser.IsMobileDevice == true)
    {
        Response.Redirect("Mobile//home.aspx");
    }
}

Ten przykład działa w asp.net

Nie powiedziałeś, jakiego języka używasz. Jeśli jest to Perl to jest trywialne:

use CGI::Info;

my $info = CGI::Info->new();

if($info->is_mobile()) {
   # Add mobile stuff
}

unless($info->is_mobile()) {
   # Don't do some things on a mobile
}

Yes user-agent służy do wykrywania przeglądarek mobilnych. Dostępnych jest wiele darmowych skryptów, aby to sprawdzić. Oto jeden z takich kodu php, który pomoże przekierować użytkowników mobilnych do różnych stron internetowych.

Umieściłem to demo ze skryptami i przykładami dołączonymi razem:

Http://www.mlynn.org/2010/06/mobile-device-detection-and-redirection-with-php/

Ten przykład wykorzystuje funkcje php do wykrywania agenta użytkownika i oferuje dodatkową korzyść polegającą na umożliwieniu użytkownikom określenia preferencji dla wersji witryny, która zazwyczaj nie byłaby domyślna w oparciu o typ przeglądarki lub urządzenia. Odbywa się to za pomocą Plików cookie (utrzymywanych przy użyciu php po stronie serwera jako w przeciwieństwie do javascript.)

Pamiętaj, aby sprawdzić link do pobrania w artykule dla przykładów.

Mam nadzieję, że się spodoba!

MobileESP posiada PHP, Java, APS.NET (C#), Ruby i JavaScript. posiada również licencję Apache 2, więc jest darmowa do użytku komercyjnego. Najważniejsze dla mnie jest to, że identyfikuje tylko przeglądarki i platformy, a nie rozmiary ekranu i inne metryki, co sprawia, że jest ładny i mały.

Jest zupełnie nowe rozwiązanie wykorzystujące Zend Framework. Zacznij od linku do Zend_HTTP_UserAgent:

Http://framework.zend.com/manual/en/zend.http.html