屏幕唤醒锁 API 现在已在所有浏览器中受支持

Thomas Steiner

发布时间：2024 年 5 月 14 日

屏幕唤醒锁 API 已正式在所有主流浏览器（Chrome、Safari 和 Firefox）中推出。此 API 可让您控制设备的屏幕唤醒行为，确保与 Web 应用程序的不间断交互。

现在可以使用以下两个用例。

  • 无缝演示：该 API 可防止基于 Web 的演示文稿或幻灯片应用中的屏幕变暗，因此演示者现在可以提供精致而专业的体验。
  • 食谱网站：该 API 可以保持屏幕常亮，因此用户在按照烘焙食谱操作且双手沾满面团时，无需担心屏幕关闭。

有关使用该 API 的完整详细信息，请查看使用屏幕唤醒锁 API 保持唤醒状态。以下代码段显示了最常见的交互。

// The wake lock sentinel.
let wakeLock = null;

// Function that attempts to request a screen wake lock.
const requestWakeLock = async () => {
  try {
    wakeLock = await navigator.wakeLock.request();
    wakeLock.addEventListener('release', () => {
      console.log('Screen Wake Lock released:', wakeLock.released);
    });
    console.log('Screen Wake Lock released:', wakeLock.released);
  } catch (err) {
    console.error(`${err.name}, ${err.message}`);
  }
};

// Request a screen wake lock…
await requestWakeLock();
// …and release it again after 5s.
window.setTimeout(() => {
  wakeLock.release();
  wakeLock = null;
}, 5000);

屏幕唤醒锁 API 的普遍采用是 Web 开发社区向前迈出的积极一步。凭借其多样化的应用和广泛的支持，您可以创建更可靠、更完善的 Web 体验，最终使不同浏览器的用户受益。为更流畅、无干扰的 Web 体验干杯！