本頁面由 Cloud Translation API 翻譯而成。

Chrome 100 新功能

Pete LePage

以下是一些注意事項：

Chrome 100 有三位數版本號碼
自從 Chrome 第一版開始，到現在徹底走過去，一起慶祝 #100CoolWebMoments。
使用者代理程式字串有幾項重要變更。
Multi-Screen Window 您可以將 API 列舉連結至使用者電腦的螢幕，並在特定畫面上放置視窗。
除此之外，還有更多功能。

我是 Pete LePage，讓我們深入瞭解 Chrome 100 為開發人員帶來哪些新功能。

Chrome 100

當瀏覽器首次達到 10 版時，由於主要版本號碼從一個數字變成兩個數字，因此出現了一些問題。希望您已學到一些能讓您更輕鬆地從兩位數轉換為三位數的訣竅。

Chrome 100 現已推出，Firefox 100 也即將推出。這些三位數版本號碼可能會在某些依賴瀏覽器版本識別功能的網站上造成問題。過去幾個月來，Firefox 團隊和 Chrome 團隊進行了實驗，在實驗中瀏覽器會回報版本號碼 100，但實際上並非如此。

這導致系統回報了一些問題，其中多數問題已經解決。不過，我們需要您的協助。

如果您是網站維護人員，請使用 Chrome 和 Firefox 100 測試網站。
如果您開發 User-Agent 剖析程式庫，請新增測試，剖析大於或等於 100 的版本。

詳情請參閱 Chrome 和 Firefox 即將推出主要版本 100 的 web.dev 說明。

100 個精彩的網頁設計時刻

100 個 Cool Web 時刻宣傳圖片

我們很高興看到網際網路的成長，以及過去 100 個 Chrome 版本中，你所建構的所有精彩內容。我們想回顧過去 14 年來的 #100CoolWebMoments，與大家一同慶祝這段時光。

告訴我們你最喜歡哪些時刻。如果我們遺漏了任何內容 (我們肯定有遺漏)，請在推文中標註 @Chromiumdev，並加上 #100CoolWebMoments。歡迎多加利用！

縮減的使用者代理程式字串

談到使用者代理程式，Chrome 100 將是預設支援未縮減的 User-Agent 字串的最後一個版本。這是一種策略，可用新的 User-Agent Client Hints API 取代使用 User-Agent 字串。

從 Chrome 101 開始，我們會逐步減少使用者代理程式。

請參閱 [Chromium 網誌][crblog] 上的「使用者代理程式縮減功能的來源試驗和日期」，進一步瞭解會移除哪些內容，以及移除的時間。

多螢幕視窗放置 API

對於某些應用程式來說，開啟新視窗並將其放在特定位置或特定顯示畫面，是一項重要的功能。舉例來說，使用 Google 簡報進行簡報時，我希望簡報內容會在全螢幕模式下顯示在主要螢幕上，而講者筆記則會顯示在另一個螢幕上。

多螢幕視窗放置 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 上更新的文章「使用多螢幕 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，Chrome 101 一推出，我就會在這裡告訴你 Chrome 的新功能！