Firefox等不支持Client Hints的浏览器如何检测Windows 11

首先说结论：不存在100%零误判的纯前端检测方案，原因是主流浏览器从Win11发布开始，就把普通User-Agent里的Windows版本号统一冻结成了Windows NT 10.0，能直接区分Win10/Win11的系统版本信息，全部被浏览器收进了高熵值UA Client Hints的权限范围内，没有其他公开API可以直接读取准确版本。

不过有两个可以覆盖95%以上普通用户场景的折中方案，完全不需要调用你提到的接口，同步执行、HTTP环境可用，兼容性覆盖所有主流浏览器：

方案1：Win11专属默认字体检测（优先使用，准确率最高） #

Win11系统默认预装了Segoe UI Variable这款专属系统字体，Win10及更早版本的Windows默认不会带这个字体，只要检测到系统里存在这个字体，基本就可以判定是Win11。
直接用下面的同步代码即可，不需要异步逻辑：

function checkIsWin11() {
  // 先排除非Windows系统
  if (!navigator.userAgent.includes('Windows NT 10.0')) return false;
  // 创建隐藏测试元素
  const testNode = document.createElement('span');
  testNode.style.cssText = 'position:absolute;visibility:hidden;font-size:72px;left:-9999px;';
  testNode.textContent = 'mmmmmmmmmmlli';
  document.body.appendChild(testNode);
  // 先测量通用无衬线字体的渲染宽度作为基准
  testNode.style.fontFamily = 'sans-serif';
  const defaultWidth = testNode.offsetWidth;
  // 测量目标字体存在时的渲染宽度
  testNode.style.fontFamily = '"Segoe UI Variable", sans-serif';
  const matchWidth = testNode.offsetWidth;
  document.body.removeChild(testNode);
  // 宽度存在差异说明目标字体生效，即系统预装了该字体
  return defaultWidth !== matchWidth;
}

这个方案唯一的误判场景是Win10用户手动安装了Segoe UI Variable字体，这类用户占比极低，几乎可以忽略。

方案2：屏幕参数特征校验（作为兜底逻辑使用） #

Win11的默认UI配置和Win10有固定差异，可以搭配上面的字体检测做二次校验，不建议单独使用：

• 100%系统缩放下，Win11默认任务栏高度为48px，Win10默认任务栏高度为40px，对应screen.availHeight和screen.height的差值会有固定区别
• 1080P及以上分辨率的消费级笔记本，Win11默认系统缩放为125%，Win10同配置默认缩放为100%
  这个方案的缺陷是用户可以手动修改任务栏高度、自定义缩放比例，单独使用误判率较高。

如果业务对检测准确率要求极高，建议在HTTPS环境下优先用getHighEntropyValues做判断，上述两个方案作为HTTP环境、低版本浏览器场景下的降级逻辑即可。

内容的提问来源于stack exchange，提问作者Daniel Marín