使用“桌面模式”浏览器仅检测移动用户
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用“桌面模式”浏览器仅检测移动用户相关的知识,希望对你有一定的参考价值。
我知道有很多方法可以检测移动用户(主要通过检查用户代理)。
但是许多移动浏览器都有所谓的“桌面模式”,它为网站提供了更多功能的环境。
有没有办法只为这些移动用户提供特定功能(例如jQuery滑块),在这种模式下浏览?我遇到的真正问题是,基本上,他们的用户代理在两种模式下都是相同的(例如“Opera Mini 9.0.1”),所以从网站管理员的角度来看 - 我怎么知道他们在移动设备上但是在桌面模式下浏览网站?
在android Chrome上,“桌面模式”会从用户代理中删除“Android”字符串。如果您可以使用javascript,则以下主要检测Android Chrome桌面模式:
var webkitVer = parseInt(/WebKit/([0-9]+)|$/.exec(navigator.appVersion)[1], 10); // also matches AppleWebKit
var isGoogle = webkitVer && navigator.vendor.indexOf('Google') === 0; // Also true for Opera Mobile and maybe others
var isAndroid = isGoogle && userAgent.indexOf('Android') > 0; // Careful - Firefox and Windows Mobile also have Android in user agent
var androidDesktopMode = !isAndroid && isGoogle && (navigator.platform.indexOf('Linux a') === 0) && 'ontouchstart' in document.documentElement;
它假设使用ARM处理器的Chrome是Android。对于在ARM上运行Linux的用户,在i686或MIPS等上的Android失败(我无法测试ChromeOS),这个假设肯定是失败的。
对于Windows Mobile,您可以通过检查字符串“WPDesktop;”来检测桌面模式。在用户代理中。
编辑:用于使用window.chrome
和window.chrome.webstore
的代码这是一个可靠的测试,但在Chrome 65周围你不能再使用这些属性来检测桌面模式。感谢@faks的信息。
编辑2:我现在强烈建议不要将“桌面模式”视为“移动模式”,但这里是我更新的观点:
- 请注意,检测桌面模式的代码非常脆弱,而较新的浏览器版本会经常破坏嗅探代码技术
- 除非你有严重的错误或关键的可用性问题,否则完全不值得嗅探
- 如果您没有积极维护代码并针对测试版的浏览器进行测试,请不要嗤之以鼻
- 我在ios上使用以下内容:
navigator.vendor.indexOf('Apple') === 0 && 'ontouchstart' in document.body
。我们需要这个为iPadOS 13正确设置令人惊讶的糟糕的iOS inputMode(旧的navigator.platform技术现在在iOS 13 Beta中被破坏),并避免其他输入类型的其他iOS可用性错误。我想你可以检查window.screen.width == 768
来嗅iPad(即使方向改变也保持不变)。如果Macbook出现在触控版中,那么嗅觉就会破裂。 - 我现在使用以下内容来检测Android桌面模式:
'ontouchstart' in document.body && navigator.platform.indexOf('Linux a') === 0 && (window.chrome || (window.Intl && Intl.v8BreakIterator))
。可怕的不可靠的嗅觉,但我们真的需要它,因为Android视频和缩放缩放(不是页面缩放)在我们的SPA上真的被破坏了(屏幕尺寸不够,因为桌面触摸用户可以使用小窗口)。
这是iOS Safari用户的相关代码。实际上,用户代理在桌面模式下丢失了对iPhone / iPod / iPad的引用,但该信息仍存在于navigator.platform中:
var iOSAgent = window.navigator.userAgent.match(/iPhone|iPod|iPad/);
var iOSPlatform = window.navigator.platform && window.navigator.platform.match(/iPhone|iPod|iPad/);
var iOSRequestDesktop = (!iOSAgent && iOSPlatform);
以上是关于使用“桌面模式”浏览器仅检测移动用户的主要内容,如果未能解决你的问题,请参考以下文章