javascript - How to detect "request desktop site" mode of iOS Mobile Safari and Chrome? - Stack Overflow

admin管理员组

文章数量:1225102

I'd like to send iPad version of my web site when users use "request desktop site" of iOS mobile safari or "request desktop version" of iOS Chrome. It seems that only user-agent is different in that mode, and it seems impossible to detect. Any ideas?

My site has three versions : desktop / tablet / smartphone. The tablet version is a static version of desktop version which is very dynamic and uses JavaScript heavily (parallax effects.)

I'd like to send iPad version of my web site when users use "request desktop site" of iOS mobile safari or "request desktop version" of iOS Chrome. It seems that only user-agent is different in that mode, and it seems impossible to detect. Any ideas?

My site has three versions : desktop / tablet / smartphone. The tablet version is a static version of desktop version which is very dynamic and uses JavaScript heavily (parallax effects.)

• javascript
• ios
• google-chrome
• mobile

Share Improve this question Follow asked May 15, 2015 at 4:41 apptaroapptaro 28911 gold badge22 silver badges99 bronze badges

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 4

Please see the answer to this question: https://stackoverflow.com/a/58064481/1237536

it works flawlessly (for now, anyway)..

Basically, when iPads are in 'Desktop mode', they advertise themselves as MacIntel, but no Mac currently has a touchscreen, so you look for a MacIntel with touch enabled:

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

but you should definitely look at the original answer -- i'm not trying to take credit: https://stackoverflow.com/a/58064481/1237536

I've seen a few people using cookies/sessionStorage to detect the changing user agent, such as http://leavesofcode.net/2013/07/08/responsive-design-with-switch-to-desktop-site-option/ and https://gist.github.com/dtipson/7401026

However, I found you can skip all that, by cross-referencing navigator.platform against navigator.userAgent. This is for iOS specifically, as I hear Chrome's "request desktop site" also updates the viewport automatically so this check may not be required on it.

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

Another dirty hack is to use platform.maxTouchPoints on iOS 13+. This field is still present even after requesting the desktop version, but on real desktop Safari this field is absent.

本文标签： javascriptHow to detect quotrequest desktop sitequot mode of iOS Mobile Safari and ChromeStack Overflow