1. David Wu首页
  2. WordPress
  3. WordPress安装教程

判断用户在移动端访问还是桌面端访问

随着移动网络流量逐渐超过桌面电脑的流量,大家对移动版网站越来越重视了,现在国际主流的做法是以自适应的方式增加网站对移动客户端的友好度,另外一种比较常见的方法就是专门为移动网络开发一个版本。两种方式各有利弊,自适应的方式当然是通过 CSS 来实现,专门的移动网站往往是通过程序判断来是实现的,wordpress 给我们提供了一个非常便利的函数来实现这个需求。

WordPress 方法:

  1. if( wp_is_mobile() ) {
  2. // 显示移动版网站内容
  3. } else {
  4. // 显示桌面版网站内容
  5. }

通过这个函数,我们也可以实现在一个网站上专门为移动浏览器或桌面浏览器显示某些内容,相比 CSS 的方法,各个平台的浏览器只加载相应的内容,可以剩下一些不必要的流量。

PHP 方法:

  1. <?php
  2. function isMobile()
  3. {
  4.     // 如果有HTTP_X_WAP_PROFILE则一定是移动设备
  5.     if (isset ($_SERVER['HTTP_X_WAP_PROFILE']))
  6.     {
  7.         return true;
  8.     }
  9.     // 如果via信息含有wap则一定是移动设备,部分服务商会屏蔽该信息
  10.     if (isset ($_SERVER['HTTP_VIA']))
  11.     {
  12.         // 找不到为flase,否则为true
  13.         return stristr($_SERVER['HTTP_VIA'], "wap") ? true : false;
  14.     }
  15.     // 脑残法,判断手机发送的客户端标志,兼容性有待提高
  16.     if (isset ($_SERVER['HTTP_USER_AGENT']))
  17.     {
  18.         $clientkeywords = array ('nokia',
  19.             'sony',
  20.             'ericsson',
  21.             'mot',
  22.             'samsung',
  23.             'htc',
  24.             'sgh',
  25.             'lg',
  26.             'sharp',
  27.             'sie-',
  28.             'philips',
  29.             'panasonic',
  30.             'alcatel',
  31.             'lenovo',
  32.             'iphone',
  33.             'ipod',
  34.             'blackberry',
  35.             'meizu',
  36.             'android',
  37.             'netfront',
  38.             'symbian',
  39.             'ucweb',
  40.             'windowsce',
  41.             'palm',
  42.             'operamini',
  43.             'operamobi',
  44.             'openwave',
  45.             'nexusone',
  46.             'cldc',
  47.             'midp',
  48.             'wap',
  49.             'mobile'
  50.             );
  51.         // 从HTTP_USER_AGENT中查找手机浏览器的关键字
  52.         if (preg_match("/(" . implode('|', $clientkeywords) . ")/i", strtolower($_SERVER['HTTP_USER_AGENT'])))
  53.         {
  54.             return true;
  55.         }
  56.     }
  57.     // 协议法,因为有可能不准确,放到最后判断
  58.     if (isset ($_SERVER['HTTP_ACCEPT']))
  59.     {
  60.         // 如果只支持wml并且不支持HTML那一定是移动设备
  61.         // 如果支持wml和html但是wml在html之前则是移动设备
  62.         if ((strpos($_SERVER['HTTP_ACCEPT'], 'vnd.wap.wml') !== false) && (strpos($_SERVER['HTTP_ACCEPT'], 'text/html') === false || (strpos($_SERVER['HTTP_ACCEPT'], 'vnd.wap.wml') < strpos($_SERVER['HTTP_ACCEPT'], 'text/html'))))
  63.         {
  64.             return true;
  65.         }
  66.     }
  67.     return false;
  68. }
  69. ?>

Script 方法一

  1. 	<script type="text/javascript">
  2. 	function browserRedirect() {
  3. 		var sUserAgent= navigator.userAgent.toLowerCase();
  4. 		var bIsIpad= sUserAgent.match(/ipad/i) == "ipad";
  5. 		var bIsIphoneOs= sUserAgent.match(/iphone os/i) == "iphone os";
  6. 		var bIsMidp= sUserAgent.match(/midp/i) == "midp";
  7. 		var bIsUc7= sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
  8. 		var bIsUc= sUserAgent.match(/ucweb/i) == "ucweb";
  9. 		var bIsAndroid= sUserAgent.match(/android/i) == "android";
  10. 		var bIsCE= sUserAgent.match(/windows ce/i) == "windows ce";
  11. 		var bIsWM= sUserAgent.match(/windows mobile/i) == "windows mobile";
  12. 		if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
  13. 			alert('手机站链接');
  14. 		}
  15. 		else {
  16. 			alert('PC站链接');
  17. 		}
  18. 	}
  19. 	browserRedirect();
  20. 	</script>

Script 方法二

  1. 	<script type="text/javascript">
  2. 		function browserRedirect() {
  3. 			var browser={
  4. 				versions:function(){
  5. 				   var u = navigator.userAgent, app = navigator.appVersion;
  6. 				   return {//移动终端浏览器版本信息   
  7. 						trident: u.indexOf('Trident') > -1, //IE内核  
  8. 						presto: u.indexOf('Presto') > -1, //opera内核  
  9. 						webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核  
  10. 						gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核  
  11. 						mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端  
  12. 						ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端  
  13. 						android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器  
  14. 						iPhone: u.indexOf('iPhone') > -1 , //是否为iPhone或者QQHD浏览器  
  15. 						iPad: u.indexOf('iPad') > -1, //是否iPad    
  16. 						webApp: u.indexOf('Safari') == -1, //是否web应用程序,没有头部与底部  
  17. 						weixin: u.indexOf('MicroMessenger') > -1, //是否微信   
  18. 						qq: u.match(/\sQQ/i) == " qq" //是否QQ  
  19. 						};
  20. 				}(),
  21. 				language:(navigator.browserLanguage || navigator.language).toLowerCase()
  22. 			}
  23. 
    
  24. 			if(browser.versions.mobile || browser.versions.ios || browser.versions.android || browser.versions.iPhone || browser.versions.iPad){
  25. 				alert('手机站链接');
  26. 				cambrian.render('head')
  27. 			}
  28. 		}
  29. 		browserRedirect();
  30. 	</script>

原创文章,作者:DavidWu,如若转载,请注明出处:https://www.davidwu.net/archives/102138

服务项目 服务内容 收费标准(元)
开发定制 WordPress主题/插件开发定制 (以最终需求为准)
主题/插件汉化 汉化团队WordPress主题/插件,翻译率95% (以标的主题/插件的句子数量为准)
服务器环境配置 基于您现有服务器,搭建配置网站运行环境,结合我们多年来实战经验,可完美支持WordPress等PHP程序运行,并配置伪静态规则、优化目录权限等问题。服务器我们强烈推荐使用Linux系统。 100元/次
网站托管 若贵站目前尚无技术人员,无法完成服务器环境配置,可选择我们的网站托管服务,直接交付正常运行的WordPress站点,并且无需担心服务器的后续维护工作,一切都由我们来帮您完成。 标配套餐:1000元/年/站点 高配套餐:联系客服获取
网站加速优化 从服务器后端配置优化到WordPress数据库缓存、前端页面缓存、JS和CSS压缩合并,全方位优化网站加载速度,实现秒开。(此服务仅针对(云)服务器/VPS) 500元/次(仅站内优化200元/次)
主题配置 本站所有主题均支持,可快速实现,若有任何问题可以咨询客服解决,若您希望我们提供配置服务,可选购此服务。 英文主题安装 60元/次 汉化主题安装 30元/次
HTTPS配置 HTTPS已经不断普及,并且有着更高的安全性以及SEO上的优待。该服务收取的为服务费,SSL证书产生的费用请自行承担。 100元/次
网站搬家 迁移网站所有文件和数据库信息、网站相关配置的调整、以及迁移中的疑难问题故障排除。 标准收费:500元/次 若网站数据量大,需协商
网站运维 提供整站的运维服务,保证网站正常运行。包含:网站故障定位及排除、网站数据备份和恢复、网站攻击及木马等问题的处理等 标准收费:2000元/年 IP 5000以上需协商

发表评论

邮箱地址不会被公开。 必填项已用*标注