PHP和JAVASCRIPT判断访客终端是电脑还是手机
2013-11-27 13:13
531 查看
当用户使用手机等移动终端访问网站时,我们可以通过程序检测用户终端类型,如果是手机用户,则引导用户访问适配手机屏幕的移动站点。本文将介绍分别使用PHP和JAVASCRIPT代码判断用户终端类型。
查看演示DEMO
我们使用PHP的$_SERVER['HTTP_USER_AGENT']来获取手机用户浏览器的用户代理,然后匹配已有的各种手机浏览器代理库,如果含有匹配的关键字,则判断为手机(移动终端)用户。
上述代码中函数is_mobile()来判断用户终端类型,将收集到的当今各种手机的HTTP_USER_AGENT归结到数组$mobile_agents中,并进行匹配。使用时只需调用函数is_mobile()。如以下代码表示,当匹配用户为手机访问时,页面跳转到网站手机版m.helloweba.com。
您也可以直接在前端页面上加入一段Javascript脚本来判断用户的终端类型。Javascript也是通过获取浏览器的user-agent信息,然后匹配已有的user-agent信息库。
以上代码还不是很完善,有兴趣的朋友欢迎补充。
当然,我们也可以通过响应式布局来匹配各种不同屏幕,这样可以节约开发成本,但是当客户对移动网站的功能需求,对于独立的移动站点最好是采用在网站入口处判断用户访问终端类型,一般是我们在主站首页就做判断,如果是手机访客则跳转到手机版页面,否则按正常PC方式访问页面。
查看演示DEMO
PHP版
我们使用PHP的$_SERVER['HTTP_USER_AGENT']来获取手机用户浏览器的用户代理,然后匹配已有的各种手机浏览器代理库,如果含有匹配的关键字,则判断为手机(移动终端)用户。function is_mobile() { $user_agent = $_SERVER['HTTP_USER_AGENT']; $mobile_agents = array("240x320","acer","acoon","acs-","abacho","ahong","airness","alcatel", "amoi","android","anywhereyougo.com","applewebkit/525","applewebkit/532","asus","audio", "au-mic","avantogo","becker","benq","bilbo","bird","blackberry","blazer","bleu", "cdm-","compal","coolpad","danger","dbtel","dopod","elaine","eric","etouch","fly ", "fly_","fly-","go.web","goodaccess","gradiente","grundig","haier","hedy","hitachi", "htc","huawei","hutchison","inno","ipad","ipaq","iphone","ipod","jbrowser","kddi", "kgt","kwc","lenovo","lg ","lg2","lg3","lg4","lg5","lg7","lg8","lg9", "lg-","lge-","lge9","longcos","maemo", "mercator","meridian","micromax","midp","mini","mitsu","mmm","mmp","mobi","mot-", "moto","nec-","netfront","newgen","nexian","nf-browser","nintendo","nitro","nokia", "nook","novarra","obigo","palm","panasonic","pantech","philips","phone","pg-", "playstation","pocket","pt-","qc-","qtek","rover","sagem","sama","samu","sanyo", "samsung","sch-","scooter","sec-","sendo","sgh-","sharp","siemens","sie-","softbank", "sony","spice","sprint","spv","symbian","tablet","talkabout","tcl-","teleca","telit", "tianyu","tim-","toshiba","tsm","up.browser","utec","utstar","verykool","virgin", "vk-","voda","voxtel","vx","wap","wellco","wig browser","wii","windows ce", "wireless","xda","xde","zte"); $is_mobile = false; foreach ($mobile_agents as $device) { if (stristr($user_agent, $device)) { $is_mobile = true; break; } } return $is_mobile; }
上述代码中函数is_mobile()来判断用户终端类型,将收集到的当今各种手机的HTTP_USER_AGENT归结到数组$mobile_agents中,并进行匹配。使用时只需调用函数is_mobile()。如以下代码表示,当匹配用户为手机访问时,页面跳转到网站手机版m.helloweba.com。
if (is_mobile()) { header('Location:http://m.helloweba.com'); } else { echo '请使用手机访问.'; }
Javascript版
您也可以直接在前端页面上加入一段Javascript脚本来判断用户的终端类型。Javascript也是通过获取浏览器的user-agent信息,然后匹配已有的user-agent信息库。if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iOS|iPad|Backerry| WebOS|Symbian|Windows Phone|Phone)/i))) { location.replace("http://m.helloweba.com") }else{ document.write("请使用手机访问."); }
以上代码还不是很完善,有兴趣的朋友欢迎补充。
当然,我们也可以通过响应式布局来匹配各种不同屏幕,这样可以节约开发成本,但是当客户对移动网站的功能需求,对于独立的移动站点最好是采用在网站入口处判断用户访问终端类型,一般是我们在主站首页就做判断,如果是手机访客则跳转到手机版页面,否则按正常PC方式访问页面。
相关文章推荐
- 处理showModalDialog在谷歌浏览器下获取不到返回值的方法
- javascript:navigator.userAgent
- 学习Javascript基础
- WPF:使用Json.NET在TreeView中树形显示JSON数据
- js屏蔽键盘按键
- json转换需要的jar包
- JS浏览器兼容问题
- js 刷新iframe,调用父窗口函数
- 纯javascript 九九乘法表
- Extjs4.x Vtype扩展实现开始日期小于结束日期
- c#模拟js escape方法
- javascript解析人体运动
- javascript实现图片的移动
- javascript 变量作用域(scope)与变量提前(hoisting)
- JavaScript中关联数组对象
- 如何用JS写九九乘法表
- 提升JSP应用程序性能速度的配置方法
- Extjs4中如何获取组件(通过ID或通过Name)
- [ javascript ] everything is tools!
- Js实现当前点击a标签变色,其他a标签回复原色