Home > Article > Web Front-end > Detecting visionOS by JavaScript
As of July 2024, you can use the following code to determine if a browser is on visionOS or not. (This does not identify browser brands; I only checked major browsers.)
function isVisionOS () { return navigator.userAgent.includes("(Macintosh;") && !!navigator.xr && document.ontouchstart !== undefined; }
The function is using 3 criteria.
Safari on macOS, iPadOS, visionOS has user agents like following.
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0 Safari/605.1.15
By using the following code, we can determine if the browser is on macOS, iPadOS, or visionOS.
navigator.userAgent.includes("(Macintosh;")
According to the MDN page, Safari for macOS, iPadOS does not support XR. However, Safari on visionOS supports.
You can check if XR is supported with the following code:
!!navigator.xr
So far, it seems like criteria No.1 and No.2 are enough to identify visionOS. However, Chrome on macOS supports XR. So we need No.3.
Finally, we can exclude macOS by using the following code.
document.ontouchstart !== undefined
OS | Browser | UserAgent | navigator.xr | Touch enabled |
---|---|---|---|---|
visionOS (2.0) | Safari | ✅ | ✅ | ✅ |
visionOS (2.0) | Firefox (128.3) | ✅ | ✅ | ✅ |
Windows 11 | Chrome (127.0.6533.72) | ❌ | ✅ | ❌ |
Windows 11 | Edge (127.0.2651.74) | ❌ | ✅ | ❌ |
Android 12 (Pixel 6) | Chrome (126.0.6478.188) | ❌ | ✅ | ✅ |
iOS (18.0) | Chrome (127.0.6533.77) | ❌ | ❌ | ✅ |
iOS (18.0) | Safari | ❌ | ❌ | ✅ |
iPadOS (17.5.1) | Chrome (127.0.6533.77) | ✅ | ❌ | ✅ |
iPadOS (17.5.1) | Safari | ✅ | ❌ | ✅ |
macOS (Sonoma 14.5) | Chrome (126.0.6478.114) | ✅ | ✅ | ❌ |
macOS (Sonoma 14.5) | Safari | ✅ | ❌ | ❌ |
The above is the detailed content of Detecting visionOS by JavaScript. For more information, please follow other related articles on the PHP Chinese website!