用于桌面或移动设备检测的 JavaScript

Question

我收到了一些代码，用于检测用户使用的是移动设备还是桌面设备。

var user_agent = navigator.userAgent;
var mobile = /Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/i;
if (!mobile.test(user_agent)) {
    $(".master-content").css({"width":"1280px","margin":"0 auto","overflow-y":"visible"});
    $(".off-canvas-wrap").css({"overflow":"visible"});
}

谁能告诉我一种更可靠的方法来做到这一点，或者至少为什么这是进行设备检测的不好方法？

谢谢

Answer 1

您提供的代码没有任何问题。它可能看起来真的很难看，但本质上，您所做的就是将用户的用户代理与所有移动设备用户代理的正则表达式进行比较，并查看它是否匹配。

这种方法唯一可预见的问题是，随着新的移动设备进入市场，您将必须不断更新唯一标识符列表。话虽这么说，您当前的列表似乎涵盖了当今 95% 以上的移动设备，所以您应该没问题。

正如其他人所说，还有其他方法来检测移动设备，例如屏幕尺寸、功能检测等。但是，我像您一样使用用户代理取得了最大的成功。如果您想覆盖更多移动设备，我建议使用我一直贡献的这个开源移动检测库:https://github.com/serbanghita/Mobile-Detect