Question

当用户使用iOS移动版Safari的“请求桌面版网站”或iOS Chrome的“请求桌面版”时，我想发送我的网站的iPad版本。似乎只有用户代理在该模式下是不同的，并且似乎无法检测到。有什么想法吗？

我的网站有三个版本：桌面/平板电脑/智能手机。平板电脑版本是桌面版的静态版本，非常动态，并且使用JavaScript（视差效果）。

Answer 1

我已经看到一些人使用cookie / sessionStorage来检测不断变化的用户代理，例如http://leavesofcode.net/2013/07/08/responsive-design-with-switch-to-desktop-site-option/和https://gist.github.com/dtipson/7401026

但是，我发现通过将navigator.platform与navigator.userAgent进行交叉引用，可以跳过所有操作。这是专门针对iOS的，因为我听说Chrome的“请求桌面网站”也会自动更新视口，因此可能不需要对此进行检查。

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);

Answer 2

另一个肮脏的技巧是在iOS 13+上使用platform.maxTouchPoints。即使在请求桌面版本后，该字段仍然存在，但是在实际的桌面Safari中，此字段不存在。

Answer 3

请查看此问题的答案： https://stackoverflow.com/a/58064481/1237536

它工作正常（无论如何，目前如此）。

基本上，当iPad处于“桌面模式”时，它们会自称为MacIntel，但Mac目前没有触摸屏，因此您要寻找启用了触摸的MacIntel：

let isIOS = /iPad|iPhone|iPod/.test(navigator.platform) ||
(navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1)

但是您绝对应该看一下原始答案-我并不是想获得荣誉： https://stackoverflow.com/a/58064481/1237536

如何检测iOS Mobile Safari和Chrome的“请求桌面版网站”模式？

3 个答案: