移动体验 / 方法解读

移动端获取设备型号为何需要调用 getHighEntropyValues 方法

浏览器通过 User-Agent reduction 策略移除了设备型号等隐私敏感信息,开发者若需获取这些高熵值,必须通过 JavaScript 调用 NavigatorUAData.getHighEntropyValues 方法。

手机天线与主板结构解析
主题资料配图,非新闻现场照片 · 配图:📱手机天线与主板结构解析

了解 User-Agent reduction 对 UA 字符串的影响

User-Agent reduction 是浏览器广泛接受的隐私保护策略,旨在减少用户代理字符串中包含的隐私敏感信息。在支持该策略的浏览器中,原本完整的 UA 字符串会被精简,移除了具体的平台/操作系统版本、设备型号以及浏览器的小版本号。例如,Chrome 在 Android 上的旧版 UA 字符串可能包含具体的 Android 版本和 Pixel 9 型号,而在启用 reduction 后,这些信息会被替换为固定的通用值,如 Android 10 和 K。这意味着直接通过 Navigator.userAgent 或 Navigator.platform 等传统属性获取的信息已不再包含详细的设备型号。

这种变化导致直接读取 UA 字符串无法满足需要精确设备信息的业务需求。虽然浏览器保留了基本的平台信息,如 Linux 或 Windows NT 10.0,但具体的设备型号和操作系统的小版本号已被移除。因此,开发者若仍需获取这些被移除的详细信息,必须寻找替代方案,而不能依赖传统的 UA 字符串解析。

使用 User-Agent Client Hints API 获取高熵值

为了在保护隐私的前提下提供更详细的设备信息,浏览器引入了 User-Agent Client Hints 机制。这允许服务器和前端代码通过特定的 HTTP 头部(如 Sec-CH-UA-*)来请求特定信息,而不是在每次请求中都发送完整的 UA 字符串。在 JavaScript 环境中,可以通过 Navigator.userAgentData 属性访问 NavigatorUAData 对象,该对象包含了低熵值的客户端提示信息。

NavigatorUAData 对象中的属性仅代表低熵值的提示,例如基本的浏览器品牌和版本。若要获取高熵值,如具体的设备型号(Sec-CH-UA-Model)或设备形态因子(Sec-CH-UA-Form-Factors),则必须调用 NavigatorUAData.getHighEntropyValues() 方法。该方法会返回一个 Promise,解析后包含请求的高熵值数据。这是获取被 User-Agent reduction 移除的详细信息的标准方式。

复现检查步骤与结果判断方法

在移动端网页中,可以通过以下步骤复现并验证获取设备型号的过程。首先,在代码中获取 NavigatorUAData 对象,然后调用 getHighEntropyValues 方法,并在回调函数中检查返回的数据。例如,使用 navigator.userAgentData.getHighEntropyValues(['model', 'formFactor'])。如果浏览器支持 User-Agent reduction 且启用了 Client Hints,该方法将返回包含 model 和 formFactor 的对象。

判断结果的方法是检查返回对象中是否存在 model 字段。如果存在且值为非空字符串,则说明成功获取到了设备型号。如果返回的对象中没有 model 字段或值为空,可能是因为浏览器不支持该 API、未启用 Client Hints,或者该设备信息未被包含在请求的高熵值列表中。

注意事项与局限性

使用 getHighEntropyValues 方法获取高熵值时,必须确保浏览器支持 User-Agent Client Hints API。此外,服务器端也需要正确配置相应的 HTTP 头部,以允许客户端请求这些信息。需要注意的是,并非所有浏览器或所有设备都会返回完整的高熵值,某些信息可能因隐私策略或设备限制而不可用。因此,在依赖这些数据进行业务逻辑判断时,应做好容错处理。

开发者应优先考虑使用特性检测和渐进增强策略,而不是过度依赖设备型号等具体信息。虽然 Client Hints 提供了更精确的数据,但过度依赖特定设备信息可能导致网站在浏览器更新或隐私策略变化时出现兼容性问题。

资料与延伸阅读

你可以通过以下原始资料核对文中概念,并继续深入阅读。

  1. User-Agent reduction - HTTP | MDN ↗
  2. 配图:📱手机天线与主板结构解析 ↗
← 更多移动体验文章返回顶部 ↑