javascript - 如何在没有 navigator.platform 的情况下确定浏览器平台
问题描述
虽然之前我们能够使用navigator.platform
它来检查浏览器在哪个操作系统中运行(这对于诸如键事件翻译之类的事情仍然是必要的,例如Home
vs. metaKey+ArrowLeft
,或者以遵循操作系统约定的方式放置虚拟模式“关闭”图标)该选项不再存在。(也就是说,现在它在技术上仍然有效,但它不再是在您部署代码时保证可以工作的解决方案)。
如果需要操作系统知识,我似乎找不到任何关于替换应该是什么的官方文档:确定网页运行在哪个操作系统/平台上的新改进方法是什么?
(目前最流行的 SO 问题,“使用 JavaScript 或 jQuery 检测 Mac OS X 或 Windows 计算机的最佳方法”,自决定弃用以来没有任何已编辑的答案navigator.platform
,因此很遗憾在此时此刻)
解决方案
一种选择是navigator.userAgentData
与该.getHighEntropyValues()
方法一起使用。然后我们可以利用User-Agent Client Hints APIuserAgentData
并通过请求一些提示来获取高熵值。navigator.platform
不再提供从用户代理信息中检测操作系统的方法。
或者只是访问navigator.userAgent
具有完全支持并为可以从中提取操作系统的当前浏览器提供用户代理字符串。
function checkOS(n) {
if (n.userAgentData) {
const hints = ["architecture", "model", "platform", "platformVersion", "uaFullVersion"];
n.userAgentData.getHighEntropyValues(hints)
.then(ua => {
console.log(ua);
});
} else {
console.log(n.userAgent);
return "navigator.userAgentData is not supported!";
}
}
checkOS(navigator);
这是我在 DevTools“问题”选项卡中找到的唯一文档,除了关于 user agent string reduction 的更新信息。
navigator.userAgent
页面或脚本正在访问、navigator.appVersion
和中的至少一个navigator.platform
。在 Chrome 的未来版本中,用户代理字符串中可用的信息量将减少。- 要解决此问题,请将 、 和 的使用替换为navigator.userAgent
特征navigator.appVersion
检测navigator.platform
、渐进增强或迁移到navigator.userAgentData
.
我尝试使用 Chrome 登录navigator.userAgentData
到 Windows 和 macOS 机器上的控制台,以查看它包含哪些类型的数据,并且该对象确实具有一些有用的信息getHighEntropyValues()
,尤其是方法。
// NavigatorUAData {brands: Array(3), mobile: true}
{
"brands": [
{
"brand": "Chromium",
"version": "92"
},
{
"brand": " Not A;Brand",
"version": "99"
},
{
"brand": "Google Chrome",
"version": "92"
}
],
"mobile": false,
"getHighEntropyValues": function getHighEntropyValues() { [native code] }
}
对浏览器的支持不是navigator.userAgentData
很好(仅在 Chrome、Edge、Opera 中支持),但这可能是朝着检测操作系统的正确方向迈出的一步,userAgentData
因为navigator.platform
不再是。CodePen 演示
推荐阅读
- c# - C# 时区逻辑
- typescript - TypeORM 多对多连接表额外列
- docker - 无法运行对等体,因为从目录 /etc/hyperledger/fabric/msp 设置类型为 bccsp 的 MSP 时出错
- javascript - 使用 concat 函数连接问题
- python - 将列表加载到 python tkinter 中,并为每一行创建一个按钮
- kotlin - 如何在 kotlin 中组成超过 8 个反应器 Mono
- reactjs - React Hook useEffect 缺少依赖项:“hideLoader”和“showLoader”。包括它们或删除依赖数组
- django - forms.CharField(initial = "")
- sql - 使用选择从具有相似列的 2 个表中查找信息
- r - RStudio 服务器上的通知声音