检测手机与平板电脑
有没有办法检测用户是使用平板电脑还是手机？ 例如，一个人使用平板电脑（任何版本为3+和iPad的安卓平板电脑）上网，他们肯定会喜欢查看与坐在台式电脑上的人相同的未被剥离的版本。 电话冲浪者肯定更喜欢网站的精简版本，因为它加载速度更快，并且可能更容易用拇指导航。 这可以通过检查此处找到的userAgent oct屏幕宽度来完成：
在jQuery中检测移动设备的最佳方法是什么？
但问题出现在像谷歌Galaxy Nexus这样的手机上，它具有与平板电脑相同的分辨率，但只有屏幕尺寸的一半。 在我看来，即使分辨率很高，显示移动版也会更好，因为屏幕很小。
有没有办法检测到这一点，还是我必须做出妥协？
我认为你在平板电脑，手机或任何其他支持网络的设备之间进行了根本性的区分。 屏幕的物理尺寸似乎是您要用来指定所投放内容的指标。
在这种情况下，我会尝试基于HTTP头中的用户代理传递的值（ [mobiforge.com …] ）来实现逻辑，并优雅地降级以提示用户信息是否不可用。
你的逻辑可能看起来像这样：
- 如果用户代理在HTTP标头中提供物理屏幕大小
物理尺寸= UA值。 - 否则，如果用户代理提供分辨率和像素尺寸
物理尺寸=像素尺寸除以分辨率。 - （可选）否则， 使用客户端脚本来检测分辨率和PPI
- 否则，如果用户代理字符串看起来像某种移动设备（正则表达式）
提示用户选择。 - 除此以外
假设一个默认选项。
更新 ：我的答案现在已经三年了。 值得注意的是，对响应式设计的支持已经取得了显着进展，现在常见的是向所有设备提供相同的内容，并依靠css媒体查询以对其正在查看的设备最有效的方式呈现网站。
如果您在理论上使用媒体查询，则可以使用@media掌上电脑，但支持几乎不存在。
识别高分辨率移动设备的最简单方法是查看屏幕的DPI和设备像素比（目前通过webkit / mozilla供应商特定标签）
@media (-webkit-max-device-pixel-ratio: 2), (max--moz-device-pixel-ratio: 2), (min-resolution: 300dpi) { ... } 编辑：window.devicePixelRatio在JS中执行上述操作
这里有一篇很好的文章，有很多关于识别移动设备的想法。
http://davidbcalhoun.com/2010/using-mobile-specific-html-css-javascript
根据谷歌的建议： 在这里找到 （也由Greg引用）这是我之前在项目中使用的。
if(/Mobile/i.test(navigator.userAgent) && !/ipad/i.test(navigator.userAgent) ){ console.log("it's a phone");//your code here }
它可能不是最优雅的解决方案……但它确实起到了作用。
如果你使用Cordova我喜欢这个：
cordova plugin add uk.co.workingedge.phonegap.plugin.istablet
然后在你的代码中的任何地方调用：
window.isTablet
不幸的是，截至目前，区分移动设备和平板电脑的唯一可靠方法是通过用户代理字符串。
我还没有找到包含设备尺寸的用户代理。
如果你试图计算设备的ppi，它们几乎都不可避免地会出现96ppi，无论是桌面还是手机。
在用户代理字符串中搜索iPad / iPod / iPhone以检测任何Apple设备。 这将告诉您是否有Apple的平板电脑或手机/ iPod。 幸运的是，i-devices的味道要少得多，因此也可以更容易区分它们。
要识别Android设备，请在用户代理字符串中搜索“Android”。 要确定它是平板电脑还是手机，手机用户代理（原生Android浏览器和Chrome）将包含“Mobile Safari”，而平板电脑只包含“Safari”。 Google推荐使用此方法：
作为移动网站的解决方案，我们的Android工程师建议在User-Agent字符串以及“android”中专门检测“mobile”。
可以在这里找到更全面的描述：
http://googlewebmastercentral.blogspot.com/2011/03/mo-better-to-also-detect-mobile-user.html
当然这并不理想，但看起来是唯一可靠的手段。 作为警告，通过查看用户代理字符串的大样本列表（接近一百个），我确实看到一个或两个旧设备没有正确地遵守“移动”与“移动Safari”的区别。
您可以使用Device Atlas之类的东西来检测用户代理的这些function。 提供您可以自己托管的API，他们还提供云服务。 两者都是溢价（付费）
或者你可以使用像Wurfl这样的东西，根据我的经验，它不太准确。
为什么在你问他们时试着猜猜用户有什么？ 您可以使用分辨率来猜测正在使用哪种设备，并询问用户他们想要的视图，如果它属于可能的移动设备或平板电脑类别。 如果你发现它错了，那么这对用户来说是一件麻烦事。 在我看来，他们曾经问过哪种类型的设备更方便。
我认为WURFL可能值得关注： http ：//wurfl.sourceforge.net/help_doc.php它更加硬核，因为它更多的服务器端解决方案，而不是简单地通过简单的媒体查询（例如你自己的或使用类似Foundation CSS的框架或使用纯javascript（adapt.js）。
比以下可以做的事情：
$is_wireless = ($requestingDevice->getCapability('is_wireless_device') == 'true'); $is_smarttv = ($requestingDevice->getCapability('is_smarttv') == 'true'); $is_tablet = ($requestingDevice->getCapability('is_tablet') == 'true'); $is_phone = ($requestingDevice->getCapability('can_assign_phone_number') == 'true'); if (!$is_wireless) { if ($is_smarttv) { echo "This is a Smart TV"; } else { echo "This is a Desktop Web Browser"; } } else { if ($is_tablet) { echo "This is a Tablet"; } else if ($is_phone) { echo "This is a Mobile Phone"; } else { echo "This is a Mobile Device"; } }
参考： http ： //wurfl.sourceforge.net/php_index.php
或者在Java中：
WURFLHolder wurfl = (WURFLHolder) getServletContext().getAttribute(WURFLHolder.class.getName()); WURFLManager manager = wurfl.getWURFLManager(); Device device = manager.getDeviceForRequest(request); String x = device.getCapability("is_tablet"); //returns String, not boolean btw
参考： http ： //wurfl.sourceforge.net/njava_index.php
正如许多其他海报所述，您可能想要解析User-Agent请求标头。 为此，我发现ua-parser-js库非常有用。