

如何保持屏幕常亮_Js实现设备保持唤醒状态
source link: https://www.fly63.com/article/detial/12680
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

扫一扫分享
JavaScript 中的一些新功能非常值得期待,唤醒锁定 api 就是其中之一。它允许我们与主机系统进行交互,可以帮助开发人员使用 JavaScript 指示操作系统保持屏幕唤醒状态!
这对于希望用户的设备不会因非活动超时而被锁定的情况尤其有用。浏览器可以指示操作系统用户正在进行某项活动,例如录制或观看视频。
防止屏幕休眠或变暗
然后就可以使用唤醒锁定 API 来防止屏幕休眠或变暗。用于请求权限:
let screenLock;
try {
screenLock = await navigator.wakeLock.request('screen');
} catch (err) {
console.log('Error with wake lock: ', err);
}
如果请求成功,主机将不会休眠,直到唤醒锁以编程方式被释放。这就是使用 JavaScript 保持屏幕唤醒所需的全部功能。
我们将代码封装在 try-catch 中,因为如果主机设备处于省电模式、电池电量不足或当前标签不可见,屏幕唤醒锁请求可能会被拒绝。
释放唤醒锁
await screenLock.release()
值得注意的是,如果文档处于非活动状态(用户更换标签页/窗口等),锁定会自动解除。为了处理这个问题,我们可以添加一个可见性变化事件:
document.addEventListener('visibilitychange', async () => {
try {
screenLock = await navigator.wakeLock.request('screen');
} catch (err) {
console.log('Error with wake lock: ', err);
}
});
该 API 仅在应用程序通过 HTTPS 提供时可用。
虽然该 API 已经存在了一段时间,但并非所有浏览器都支持它。您可以查看 MDN 兼容性,了解哪些浏览器支持。在撰写本文时,iOS 上的 firefox 和 Safari 尚不支持。
在设备上使用此功能可确保设备不会进入休眠状态。
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK