Total Pageviews

Wednesday, 19 December 2012

利用PHP將手機瀏覽器導向WAP頁面



你的站點有來自手機的訪客嗎?你的站點在手機瀏覽器下排版完美嗎?

如果你有來自手機界面的訪問者,你很可能需要將他們引導至一個不同的頁面,一個特別為手機瀏覽器優化的界面。

1.在頁面頭部添加判斷

通過PHP和瀏覽器頭信息,我們可以輕鬆地實現將手機用戶轉向經過專門設計的WAP界面。我恰好使用了WP-T-WAP插件實現了界面的WAP化,WAP瀏覽的地址是http://urdomain.com/wap
我希望手機訪客在打開http://urdomain.com地址時,自動導向http://urdomain.com/wap。怎麼辦呢?

答案非常簡單。

打開header.php文件。在第一行插入以下代碼:

< ?php
$agent = $_SERVER['HTTP_USER_AGENT'];
if(strpos($agent,”NetFront”) || strpos($agent,”iPhone”) || strpos($agent,”MIDP-2.0″) || strpos($agent,”Opera Mini”) || strpos ($agent,”UCWEB”) || strpos($agent,”Android”) || strpos($agent,”Windows CE”) || strpos($agent,”SymbianOS”))
header(“Location:http://urdomain.com/wap”);
?>

這段代碼的含義是,當瀏覽器返回的UA信息為Opera Mini、UCWEB等內容時,將頁面轉向http://urdomain.com/wap。

1.1 補充:增加手機瀏覽器的跳轉提示

當你使用上面的方法設置跳轉時,可能會遇到這種狀況:手機訪問者直接訪問類似http://urdomain.com/archive/xxx的子頁面,而不是首頁。這時,改判斷語句仍然會執行命令,將手機訪問者引導至手機界面的首頁,使訪客無法獲取想要的信息。

怎麼辦呢?

你可以在這段語句之外再加入一個判斷,只有在當前頁面為首頁時執行此命令。
在WordPress環境下這個判斷的寫法是
<?php if ( is_home() ) { … }?>
那麼全部的代碼是:

<?php
$agent = $_SERVER['HTTP_USER_AGENT'];
if ( is_home() && ((strpos($agent,”NetFront”) || strpos($agent,”iPhone”) || strpos($agent,”MIDP-2.0″) || strpos($agent,”Opera Mini”) || strpos($agent,”UCWEB”) || strpos($agent,”Android”) || strpos($agent,”Windows CE”) || strpos($agent,”SymbianOS”)) )
header(“Location:http://urdomain.com/wap”);
}
?>

這樣我們又遇到一個問題:手機訪問者在瀏覽子頁面時,並不知道你提供了WAP界面,而你恰恰又很希望推銷的你的WAP界面。

我們可以修改這個判斷語句,讓它不再直接跳轉,而是在特定瀏覽器下顯示提示信息,告訴手機用戶可以轉換至WAP界面瀏覽。

代碼寫法如下:

<?php
$agent = $_SERVER['HTTP_USER_AGENT'];
if(strpos($agent,”NetFront”) || strpos($agent,”iPhone”) || strpos($agent,”MIDP-2.0″) || strpos($agent,”Opera Mini”) || strpos ($agent,”UCWEB”) || strpos($agent,”Android”) || strpos($agent,”Windows CE”) || strpos($agent,”SymbianOS”)) { ?>
<div id=”mobile”><p>系統檢測到您正在使用手機瀏覽器,您可以訪問<a href=”http://urdomain.com/wap”>移動界面</a>以獲取更好的瀏覽體驗。 </p></div>
<?php } ?>

當然了,你可以綜合這兩種方法,讓手機訪客在訪問首頁時自動跳轉,而訪問其他界面時顯示提示信息。

2.需要足夠的手機瀏覽器UA信息

當瀏覽器訪問頁面時,它會向服務器提交一個標誌字符,這段字符被稱作UA(User Agent),他們看起來大概是這個樣子:

Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1) )

是的,UA很長,甚至還包含了系統信息。但是當我們進行判斷時,只需要核對最關鍵的字符。比如我需要判斷當前用戶是否使用了IE 8(我的確就是用的IE8),那麼在上面的判斷語句中就應該寫成strpos($agent,”MSIE 8.0″) 。

我準備了8種最常見的瀏覽器/平台分別是NetFront、iPhone、JAVA(MIDP-2.0)、Opera Mini、UCWEB、Android、Windows CE/Mobile、SymbianOS。就目前的狀況來說,這8種平台已經包含了國內幾乎全部的手機訪客,當然,完整的手機瀏覽客戶端列表不止這麼多, 我羅列一些:

2.0 MMP, 240×320, 400X240, AvantGo, BlackBerry, Blazer, Cellphone, Danger, DoCoMo, Elaine/3.0 EudoraWeb, Googlebot-Mobile, hiptop, IEMobile, KYOCERA/WX310K, LG/U990, MIDP-2., MMEF20, MOT -V, NetFront, Newt, Nintendo Wii, Nitro, // Nintendo DS Nokia, Opera Mini, Palm, PlayStation Portable, portalmmm, Proxinet, ProxiNet, SHARP-TQ-GX10, SHG-i900, Small, SonyEricsson, Symbian OS, SymbianOS , TS21i-10, UP.Browser, UP.Link, webOS, // Palm Pre, etc. Windows CE, WinWAP, YahooSeeker/M1A1-R2D2

你可以根據這個列表添加或替換上面的PHP判斷語句。但是我仍然推薦我已經選好的8種平台,因為目前會使用手機瀏覽互聯網——特別是個人博客的用戶,基本上都是高端玩家。

另外你可以寫一個簡單的頁面,用來判斷你的手機UA

<?phpecho $_SERVER['HTTP_USER_AGENT']; ?>

保存為ua-test.php,上傳至服務器,用你的手機訪問這個頁面.