How to tell if a visitor is accessing a website from a mobile phone?

Question

I'm not sure If I asked this proper way. Let me explain... I notice that facebook is "not" responsive web page because when I change width of browser on my laptop facebook.com won't change when I'm doing it. On the other hand when I use my phone and run in browser facebook.com know already that I'm using something mobile and it gets proper size to my device.

Question: How is it working, Is it some kind of trick to optimize our websites ?

Answer 1

I don't know exactly for Facebook, but if there is no sign of detection with JavaScript or CSS media queries, then they are probably doing it the old school way, ie with user agent strings .

Whenever you make a request to a website, your browser sends a string in the request header, in my case it's:

User-Agent: Mozilla/5.0 (X11; Linux i686; rv:32.0) Gecko/20100101 Firefox/32.0 Iceweasel/32.0a2

The server which received the request can use that string to get an idea of what operating system and browser you are using, you can see that in my case it's Debian for the OS and Iceweasel (=firefox) for the browser, you can be 99% sure that I'm browsing on a Desktop computer.

Answer 2

我相信用户代理将是您最好的选择。

navigator.userAgent

Answer 3

when we are browsing in our desktop the server detects that we are on desktop and it simply send default(desktop) index page of fb which is not responsive.but on other hand if we are using other client such as tablet or a mobile ,server detects it .so it redirect web documnet to other mobile friendly page of fb or it will change css for it which is not same as in desktop page.it means that server detect our device and browser.the one of such php detection script which can be used to detect is:

//php  technique
<?php
$agent = $_SERVER['HTTP_USER_AGENT']; // Put browser name into local variable
if (preg_match("/iPhone/", $agent)) { 
header("location: iphone_home.html");
} else if (preg_match("/android/", $agent)) { 
header("location: android_home.html");
}?>

//javascript technique
<script language="javascript" type="text/javascript">

var agent = navigator.userAgent.toLowerCase();
if (agent.indexOf('iphone') != -1) { // iPhone Device

    // If it is an iPhone put specific code to run here for iPhone users

} else if (agent.indexOf('android') != -1) { // Google phones running Android OS

    // If it is a Google phone put specific code to run here for Android users

}
</script>

//php technique to detect OS and browser of user

<?php
$agent = $_SERVER['HTTP_USER_AGENT']; 
$browserArray = array(
    'Windows Mobile' => 'IEMobile',
'Android Mobile' => 'Android',
'iPhone Mobile' => 'iPhone',
'Firefox' => 'Firefox',
    'Google Chrome' => 'Chrome',
    'Internet Explorer' => 'MSIE',
    'Opera' => 'Opera',
    'Safari' => 'Safari'
); 
foreach ($browserArray as $k => $v) {

if (preg_match("/$v/", $agent)) {
     break;
}   else {
 $k = "Browser Unknown";
}
} 
$browser = $k;
$osArray = array(
    'Windows 98' => '(Win98)|(Windows 98)',
    'Windows 2000' => '(Windows 2000)|(Windows NT 5.0)',
'Windows ME' => 'Windows ME',
    'Windows XP' => '(Windows XP)|(Windows NT 5.1)',
    'Windows Vista' => 'Windows NT 6.0',
    'Windows 7' => '(Windows NT 6.1)|(Windows NT 7.0)',
    'Windows NT 4.0' => '(WinNT)|(Windows NT 4.0)|(WinNT4.0)|(Windows NT)',
'Linux' => '(X11)|(Linux)',
'Mac OS' => '(Mac_PowerPC)|(Macintosh)|(Mac OS)'
); 
foreach ($osArray as $k => $v) {

if (preg_match("/$v/", $agent)) {
     break;
}   else {
 $k = "Unknown OS";
}
} 
$os = $k;

echo $agent;
echo "<h2>You are using: <em>$browser - $os</em></h2>";
?>