JasperCK Coding Lab: [PHP]辨認USER上網的裝置和瀏覽器

開發網站平台時常常需要考慮到user是用什麼裝置連進來，
因為不同裝置或瀏覽器在支援上會有差異，
(ex. iOS對flash的支援)
或針對行動裝置用戶傳送不同的效果或頁面等，
都可能要用到這樣的判斷，
實際研究後，發現只要在server端做個判斷功能即可。
辨識功能主要透過 $_SERVER[ ] 的回傳資訊和建立一個變數(ex. $browser)來作邏輯判斷。
利用$_SERVER['USER_AGENT']可以回傳user的作業系統和瀏覽器版本。

如果user使用智慧型行動裝置，$_SERVER['HTTP_X_WAP_PROFILE']則會回傳1個link(連結至行動裝置資訊的xml檔)，藉由判斷他回傳有無，判別是否來自行動裝置
(據說不是所有行動裝置都會傳送這個link,不過至少到N95都有，所以應該影響不大)
ok，接下來就是code了！
改寫後程式碼如下:

<?php
//Detect mobile user client 
function checkMobile() {

    $mbBrowser = 0;
    $userAgent = $_SERVER['HTTP_USER_AGENT'];    //取得用戶端的使用環境
    $accept = $_SERVER['HTTP_ACCEPT'];
    
    //"i" 不區分大小寫
    if (preg_match('/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone|android)/i',
      strtolower($userAgent))) {
    
      $mbBrowser++;
    }
    //非行動裝置
    if (strpos(strtolower($userAgent),'windows') > 0) {
      $mbBrowser = 0;
    }
    //有HTTP_X_WAP_PROFILE則必是行動裝置
    if ((strpos(strtolower($accept),'application/vnd.wap.xhtml+xml') > 0)
      or ((isset($_SERVER['HTTP_X_WAP_PROFILE'])
      or isset($_SERVER['HTTP_PROFILE'])))) {
 
      $mbBrowser++;
    }
    //額外放入暴力判斷
    $mobileSource = strtolower(substr($userAgent, 0, 4));
    $mbArray = array(
    'w3c ','acs-','alav','alca','amoi','audi','avan','benq','bird','blac',
    'blaz','brew','cell','cldc','cmd-','dang','doco','eric','hipt','inno',
    'ipaq','java','jigs','kddi','keji','leno','lg-c','lg-d','lg-g','lge-',
    'maui','maxo','midp','mits','mmef','mobi','mot-','moto','mwbp','nec-',
    'newt','noki','oper','palm','pana','pant','phil','play','port','prox',
    'qwap','sage','sams','sany','sch-','sec-','send','seri','sgh-','shar',
    'sie-','siem','smal','smar','sony','sph-','symb','t-mo','teli','tim-',
    'tosh','tsm-','upg1','upsi','vk-v','voda','wap-','wapa','wapi','wapp',
    'wapr','webc','winw','winw','xda ','xda-'
    );
    if (in_array($mobileSource,$mbArray)) {
      $mbBrowser++;
    }
    //ALL_HTTP是ASP的variable
    if (strpos(strtolower($_SERVER['ALL_HTTP']),'OperaMini') > 0) {
      $mbBrowser++;
    }

    if ($mbBrowser > 0) {
      return true;
    } else {
      return false;
    }   
}
?>

next, test it!
簡單做個html+css頁面讓output美觀點，假設我想讓mobile-device user看見手機，non-mobile user看見PC， HTML+CSS code:

<html>
<head>
<title>Detect Mobile Test</title>

<style type="text/css">
	#pic {
	z-index:1;
	position: absolute;
	left:0px;
	top:0px;
	}
	#word {
	position: absolute;
	font-size:120%;
	z-index:2;
	left:65px;
	top:100px;
	}
</style>

</head>
<body>
<?php 

if(checkMobile()) {
	echo '<div id="word">by Mobile</div>';
	echo '<div id="pic"><img src="./mobile.jpg" /></div>';
}
else {
	echo '<div id="word">by PC</div>';
	echo '<div id="pic"><img src="./monitor.jpg" /></div>';
}
?>
</body>
</html>

1. 模擬user來自非行動裝置