Deteksi otomatis peramban seluler (melalui agen-pengguna?) [Ditutup]

Bagaimana saya bisa mendeteksi jika pengguna melihat situs web saya dari peramban web seluler sehingga saya dapat mendeteksi dan menampilkan versi situs web saya secara otomatis?

Ya, membaca tajuk Agen-Pengguna akan membantu.

Ada beberapa daftar keluar ada agen pengguna mobile dikenal sehingga Anda tidak perlu mulai dari awal. Apa yang saya lakukan ketika saya harus membangun database agen pengguna yang dikenal dan menyimpan yang tidak diketahui saat mereka terdeteksi untuk revisi dan kemudian secara manual mencari tahu apa mereka. Hal terakhir ini mungkin berlebihan dalam beberapa kasus.

Jika Anda ingin melakukannya di tingkat Apache, Anda dapat membuat skrip yang secara berkala menghasilkan seperangkat aturan penulisan ulang memeriksa agen pengguna (atau hanya sekali dan melupakan agen pengguna baru, atau sebulan sekali, apa pun yang sesuai dengan kasus Anda), seperti

RewriteEngine On

RewriteCond %{HTTP_USER_AGENT} (OneMobileUserAgent|AnotherMobileUserAgent|...)
RewriteRule (.*) mobile/$1

yang akan pindah, misalnya, permintaan ke http: //domain/index.html ke http: //domain/mobile/index.html

Jika Anda tidak suka pendekatan memiliki skrip membuat ulang file htaccess secara berkala, Anda dapat menulis modul yang memeriksa Agen Pengguna (saya tidak menemukan yang sudah dibuat, tetapi menemukan ini contoh yang sangat sesuai ) dan mendapatkan agen pengguna dari beberapa situs untuk memperbaruinya. Maka Anda dapat memperumit pendekatan sebanyak yang Anda inginkan, tetapi saya pikir dalam kasus Anda pendekatan sebelumnya akan baik-baik saja.

Ada skrip open source di Detect Mobile Browser yang melakukan ini di Apache, ASP, ColdFusion, JavaScript dan PHP.

Hanya pemikiran tetapi bagaimana jika Anda mengatasi masalah ini dari arah yang berlawanan? Daripada menentukan browser mana yang mobile, mengapa tidak menentukan browser mana yang tidak? Kemudian kode situs Anda ke default ke versi seluler dan arahkan ke versi standar. Ada dua kemungkinan dasar saat melihat peramban seluler. Entah itu memiliki dukungan javascript atau tidak. Jadi, jika peramban tidak memiliki dukungan javascript, maka peramban itu akan default ke versi seluler. Jika memang memiliki dukungan JavaScript, periksa ukuran layar. Apa pun di bawah ukuran tertentu kemungkinan juga akan menjadi peramban seluler. Apa pun yang lebih besar akan diarahkan ke tata letak standar Anda. Maka yang perlu Anda lakukan adalah menentukan apakah pengguna dengan JavaScript dinonaktifkan adalah seluler atau tidak.
Menurut W3C jumlah pengguna dengan JavaScript dinonaktifkan sekitar 5% dan dari pengguna tersebut sebagian besar telah mematikannya yang menyiratkan bahwa mereka benar-benar tahu apa yang mereka lakukan dengan browser. Apakah mereka bagian besar dari audiens Anda? Jika tidak maka jangan khawatir tentang mereka. Jika demikian, apa skenario terburuknya? Anda memiliki para pengguna yang meramban versi seluler situs Anda, dan itu bagus.

Inilah cara saya melakukannya dalam JavaScript:

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

Lihat contoh di www.tablemaker.net/test/mobile.html di mana ukuran fontnya tiga kali lipat pada ponsel.

Mekanisme Deteksi Browser Seluler favorit saya adalah WURFL . Ini sering diperbarui dan berfungsi dengan setiap platform pemrograman / bahasa utama.

Sudahkah Anda mempertimbangkan untuk menggunakan kueri media css3? Dalam kebanyakan kasus, Anda dapat menerapkan beberapa gaya css khusus untuk perangkat yang ditargetkan tanpa harus membuat versi seluler situs yang terpisah.

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

Anda dapat mengatur lebar untuk apa pun yang Anda inginkan, tetapi 1025 akan menangkap tampilan lanskap iPad.

Anda juga ingin menambahkan tag meta berikut ke kepala Anda:

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

Lihat artikel ini di HTML5 Rocks untuk beberapa contoh yang bagus

untuk 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>

File Browser Perangkat Seluler adalah cara yang bagus untuk mendeteksi broswers seluler (dan lainnya) untuk proyek ASP.NET: http://mdbf.codeplex.com/

Anda dapat mendeteksi klien seluler hanya melalui navigator.userAgent, dan memuat skrip alternatif berdasarkan jenis klien yang terdeteksi sebagai:

 $(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
    }

    });

Anda dapat memeriksa string User-Agent. Dalam JavaScript, itu sangat mudah, itu hanya properti dari objek navigator.

var useragent = navigator.userAgent;

Anda dapat memeriksa apakah perangkat apakah iPhone atau Blackberry di JS dengan sesuatu seperti

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

jika isIphone benar Anda mengakses situs dari iPhone, jika isBlackBerry Anda mengakses situs dari Blackberry.

Anda dapat menggunakan plugin "UserAgent Switcher" untuk firefox untuk mengujinya.

Jika Anda juga tertarik, mungkin ada baiknya memeriksa skrip saya "redirection_mobile.js" yang dihosting di github di sini https://github.com/sebarmeli/JS-Redirection-Mobile-Site dan Anda dapat membaca detail lebih lanjut di salah satu artikel saya di sini:

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");
    }
}

Contoh ini berfungsi di asp.net

Anda belum mengatakan bahasa apa yang Anda gunakan. Jika itu Perl maka itu sepele:

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
}

Ya agen pengguna digunakan untuk mendeteksi browser seluler. Ada banyak skrip gratis yang tersedia untuk memeriksanya. Berikut adalah salah satu kode php yang akan membantu Anda mengarahkan pengguna seluler ke situs web yang berbeda.

Saya menempatkan demo ini dengan skrip dan contoh yang disertakan bersama:

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

Contoh ini menggunakan fungsi php untuk deteksi agen pengguna dan menawarkan manfaat tambahan dari mengizinkan pengguna untuk menyatakan preferensi untuk versi situs yang biasanya tidak akan menjadi default berdasarkan browser atau tipe perangkat mereka. Ini dilakukan dengan cookie (dikelola menggunakan php di sisi server sebagai lawan javascript.)

Pastikan untuk memeriksa tautan unduhan di artikel untuk contohnya.

Semoga kamu menikmati!

MobileESP memiliki pengait PHP, Java, APS.NET (C #), Ruby dan JavaScript. ia juga memiliki lisensi Apache 2, jadi gratis untuk penggunaan komersial. Kuncinya bagi saya adalah itu hanya mengidentifikasi browser dan platform bukan ukuran layar dan metrik lainnya, yang membuatnya tetap kecil.

Ada solusi baru menggunakan Zend Framework. Mulai dari tautan ke Zend_HTTP_UserAgent:

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