!
也想出现在这里? 联系我们
广告位

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

随着移动网络流量逐渐超过桌面电脑的流量,大家对移动版网站越来越重视了,现在国际主流的做法是以自适应的方式增加网站对移动客户端的友好度,另外一种比较常见的方法就是专门为移动网络开发一个版本。两种方式各有利弊,自适应的方式当然是通过 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. if(browser.versions.mobile || browser.versions.ios || browser.versions.android || browser.versions.iPhone || browser.versions.iPad){
  24. alert('手机站链接');
  25. cambrian.render('head')
  26. }
  27. }
  28. browserRedirect();
  29. </script>

给TA打赏
共{{data.count}}人
人已打赏
WordPress教程

WordPress 正文顶端或者末尾插入内容

2024-6-14 14:20:51

WordPress教程

WordPress主题添加自定义用户联系信息

2024-6-14 14:21:05

下载说明

  • 1、微码盒所提供的压缩包若无特别说明,解压密码均为weimahe.com
  • 2、下载后文件若为压缩包格式,请安装7Z软件或者其它压缩软件进行解压;
  • 3、文件比较大的时候,建议使用下载工具进行下载,浏览器下载有时候会自动中断,导致下载错误;
  • 4、资源可能会由于内容问题被和谐,导致下载链接不可用,遇到此问题,请到文章页面进行反馈,以便微码盒及时进行更新;
  • 5、其他下载问题请自行搜索教程,这里不一一讲解。

站长声明

本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有;若为付费资源,请在下载后24小时之内自觉删除;若作商业用途,请到原网站购买;由于未及时购买和付费发生的侵权行为,与本站无关。本站发布的内容若侵犯到您的权益,请联系本站删除,我们将及时处理!
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索