有没有一种优雅的方法来检测移动浏览器？答案

【问题标题】：Is there an elegant way to detect mobile browsers?有没有一种优雅的方法来检测移动浏览器？
【发布时间】：2012-01-12 01:26:57
【问题描述】：

我有a website，当通过移动浏览器访问时，它会重定向到a different page。

我一直无法想出一种可靠地检测移动设备的方法。目前，我的 Javascript 代码是这样的：

if (document.documentElement.clientWidth < 680 || 
    document.documentElement.clientHeight < 450) 
  location.href = "handheld.aspx";

如果浏览器大小小于桌面版本支持的大小，则会重定向。这样做的问题是，一些移动浏览器开始缩小并具有与桌面设备相似的浏览器尺寸。

我对此进行了一些研究，主要找到了涉及嗅探用户代理刺痛并根据现有移动设备中的一堆字符串检查它的解决方案。如果可能的话，我想避免这条路线，因为它看起来非常混乱，并且将来新设备问世时会中断。

是否有一种不那么笨拙的方法来检测移动浏览器，或者至少有一种更可靠的方法来检测屏幕尺寸？

【问题讨论】：

如果你想测试显示大小，不要测试浏览器的大小，测试屏幕的大小：window.screen.width。如果您查看相关问题的列表，您会发现以前有人问过这个问题。确保您的手机页面具有返回完整网站的链接（理想情况下，使用 cookie 或其他东西来记住哪些用户返回了完整网站，这样他们就不必每次都手动进行）。
为什么要检测“移动浏览器”？您希望解决此类浏览器的哪些功能 - 减小屏幕尺寸？（可能的）触摸界面？带宽有限？

【解决方案1】：

您必须决定最想检测移动浏览器的哪个方面。您是否尝试检测屏幕尺寸并重定向到适合较小屏幕的网站设计。如果是这样，您可以使用window.screen (doc here)。

如果您尝试检测移动浏览器中的特定功能或缺少功能，则应使用功能检测来确定指定功能是否存在。这比检测浏览器用户代理要好得多。

【讨论】：

【解决方案2】：

没有。你要么检查屏幕大小，要么检查用户代理

【讨论】：

【解决方案3】：

如果您想轻松解决此问题，可以尝试handsetdetection javascript 它使您能够为重定向设置规则和条件，例如屏幕尺寸、供应商、操作系统、浏览器、显示宽度和高度。如果您喜欢统计数据，HD 有一个很棒的分析报告，您可以使用它来微调您的重定向是如何提供给您的网站用户/访问者的。

【讨论】：

【解决方案4】：

在新的屏幕尺寸不断出现的世界中，根据屏幕尺寸进行检测是一场失败的战斗。您应该使用服务器端检测并相应地修改您的视图。使用 Device Atlas 或 WURFL 之类的服务将使您面向未来，并为您提供更多您可能自己完成的功能。

郑重声明，从性能角度来看，基于 JS 的移动重定向是最糟糕的解决方案，应该避免。

【讨论】：