此页面由 Cloud Translation API 翻译。

Chrome 100 的新变化

Pete LePage

以下是您有必要知道的信息：

Chrome 100 有一个三位数的版本号
漫步记忆，庆祝自 Chrome 首次发布以来的 #100CoolWebMoments。
我们对用户代理字符串做了一些重要更改。
借助 Multi-Screen Window Placement API，您可以枚举连接到用户计算机的屏幕，并将窗口放置在特定屏幕上。
还有许多更多内容。

我是 Pete LePage。我们一起来深入了解 Chrome 100 为开发者带来了哪些新功能

Chrome 100

当浏览器首次达到版本 10 时，由于主要版本号从 1 位数变为 2，出现了一些问题。希望我们学到了一些能够简化从两位数转换到三位数的知识。

Chrome 100 现已推出，Firefox 100 很快就会推出。对于依靠以某种方式标识浏览器版本的网站而言，这三位数的版本号可能会导致此类问题。在过去的几个月中，Firefox 团队和 Chrome 团队进行了实验，实验中浏览器报告了版本号 100，尽管实际并非如此。

我们因此发现了几个问题，其中很多问题都已得到修复。但是，我们仍然需要您的帮助。

如果您是网站维护人员，请使用 Chrome 和 Firefox 100 测试您的网站。
如果您要开发 User-Agent 解析库，请添加测试以解析大于或等于 100 的版本。

如需了解详情，请访问 web.dev，查看 Chrome 和 Firefox 即将达到主要版本 100。

100 个精彩的网络时刻

“100 个精彩网络时刻”宣传图片

我们很高兴看到网络的发展，以及您在最近 100 个 Chrome 版本中构建的所有精彩资料。我们觉得，漫步记忆，庆祝过去 14 年里发生的 #100CoolWebMoments 会很有趣。

告诉我们你最喜欢哪些时刻。如有任何遗漏之处（我们确信已掌握），请在 Twitter 上向 @Chromiumdev 发送 #100CoolWebMoments 消息。祝你观看愉快！

经过缩减的用户代理字符串

说到用户代理，Chrome 100 将是最后一个支持未简化的用户代理字符串的版本。这是将 User-Agent 字符串替换为新的 User-Agent Client Hints API 策略的一部分。

从 Chrome 101 开始，用户代理将逐渐减少。

请参阅 [Chromium 博客][crblog]上的用户代理减少源试用和日期，详细了解哪些内容会被移除以及何时移除。

跨屏窗口放置 API

对于某些应用，打开新窗口并将其放在特定位置或特定显示屏是一项重要功能。例如，使用 Google 幻灯片进行演示时，我希望幻灯片在主显示屏上全屏显示，而我的演讲者备注显示在另一个显示屏上。

借助 Multi-Screen Window Placement API，可以枚举连接到用户计算机的屏幕，并将窗口放置在特定屏幕上。

您可以使用 window.screen.isExtended 快速检查是否有多个屏幕与设备连接。

const isExtended = window.screen.isExtended;
// returns true/false

不过，关键功能是在 window.getScreenDetails() 中，它提供了有关已连接显示屏的详细信息。

const x = await window.getScreenDetails();
// returns
// {
//    currentScreen: {...}
//    oncurrentscreenchange: null
//    onscreenschange: null
//    screens: [{...}, {...}]
// }

例如，您可以确定主屏幕，然后使用 requestFullscreen() 使元素在该显示屏上全屏显示。

try {
  const screens = await window.getScreenDetails();
  const primary = screens
         .filter((screen) => screen.primary)[0]
  await elem.requestFullscreen({ screen: primary });
} catch (err) {
  console.error(err);
}

它还提供了一种监听变化的方法，例如，是否插入或移除了新显示屏、分辨率是否发生变化等。

const screens = await window.getScreenDetails();
let numScreens = screens.screens.length;
screens.addEventListener('screenschange', (event) => {
  if (screens.screens.length !== numScreens) {
    console.log('Screen count changed');
    numScreens = screens.screens.length;
  }
});

如需更深入地了解相关信息，请参阅 Tom 在 web.dev 上更新后的文章：利用 Multi-Screen Window Placement API 管理多种显示屏。

还有更多其他奖励！

当然还有很多。

针对 HID 设备新增了 forget() 方法，可让您撤消用户授予的 HID 设备权限。

// Request an HID device.
const [device] = await navigator.hid.requestDevice(opts);


// Then later, revoke permission to the device.
await device.forget();

对于 WebNFC，您可以使用 makeReadOnly() 方法将 NFC 标签设为永久只读。

const ndef = new NDEFReader();
await ndef.makeReadOnly();

深入阅读

这仅涵盖了部分重要的亮点。请访问以下链接，了解 Chrome 100 中的其他变化。

如需随时了解最新动态，请订阅 Chrome Developers YouTube 频道，每当我们发布新视频时，您都会收到电子邮件通知。

我是 Pete LePage