Screen Wake Lock 的 request 方法必须在用户手势触发的上下文中调用，否则抛出 NotAllowedError；仅支持 'screen' 类型，需 await 处理 Promise，且必须显式 release 并监听 visibilitychange 事件清理。
Screen Wake Lock 的 request 方法必须在用户手势触发的上下文中调用
直接在页面加载时或定时器里调用 navigator.wakeLock.request() 会失败，抛出 NotAllowedError。浏览器强制要求该操作由明确的用户交互（如点击、触摸、空格键）发起，这是硬性安全策略，无法绕过。
常见错误现象：Uncaught DOMException: Wake lock was not allowed to be requested 或返回 rejected Promise。
- ✅ 正确做法：绑定到按钮点击事件中，例如
document.getElementById('keepAwakeBtn').addEventListener('click', async () => { ... }) - ⚠️ 注意：
keydown仅对可聚焦元素（如input、button）有效；keypress已废弃，不要用 - ❌ 不要尝试用
setTimeout延迟调用——只要脱离了原始事件处理函数的执行栈，就视为“非用户手势上下文”
request 方法只接受 'screen' 类型，且需显式 await 并处理拒绝
navigator.wakeLock.request() 当前只支持 'screen' 字符串参数（规范中保留了 future types，但尚未实现）。它返回一个 Promise，必须 await，且不能忽略 rejection —— 否则可能静默失败，后续调用 wakeLock.release() 会报错。
典型使用场景：视频播放页、表单填写中途防锁屏、现场扫码页等需要持续可见的流程。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
立即学习“前端免费学习笔记（深入）”；
- ✅ 推荐写法：
let wakeLock = null;<br>async function requestWakeLock() {<br> try {<br> wakeLock = await navigator.wakeLock.request('screen');<br> console.log('Wake Lock acquired');<br> } catch (err) {<br> console.error('Failed to acquire wake lock:', err.name);<br> }<br>} - ⚠️ 兼容性注意：Safari 尚未支持（截至 Safari 17.5），Chrome/Edge/Firefox（v84+）已稳定支持；需用
'wakeLock' in navigator检测 - ⚠️ 性能影响：持续保持屏幕常亮会显著增加耗电，务必在不需要时及时释放（如页面隐藏、视频暂停、用户主动退出）
释放锁必须显式调用 release，并监听 visibilitychange 防止内存泄漏
即使页面关闭或标签页切换，wakeLock 实例也不会自动释放。若忘记调用 wakeLock.release()，锁会一直持有直到页面卸载，可能导致后台标签页异常耗电。
- ✅ 必须配对释放：在
visibilitychange事件中检查document.hidden，并释放锁；同时在组件卸载或功能退出时主动释放 - ✅ 安全写法：
document.addEventListener('visibilitychange', () => {<br> if (document.hidden && wakeLock !== null) {<br> wakeLock.release().then(() => { wakeLock = null; });<br> }<br>}); - ⚠️ 常见坑：多次调用
request()而未先release()，会导致新 Promise pending，旧锁仍存在；应始终确保wakeLock是单例引用
调试时注意 Chrome DevTools 的 Wake Lock 面板和权限提示
Chrome（v94+）DevTools 的 Application → Clear storage 页面底部有 “Wake Locks” 显示当前持有的锁，方便验证是否成功获取或残留。首次请求时地址栏会出现 ? 图标，点击可查看和手动释放。
- ✅ 开发阶段建议打开此面板，确认锁状态与预期一致
- ⚠️ 移动端真机调试时，部分 Android 厂商系统（如小米、华为）会额外拦截 Wake Lock 请求，需在系统设置中开启“允许后台运行”或“无限制电池优化”——这不是代码问题，而是系统级限制
- ⚠️ 错误信息
SecurityError: The requesting site is not secure表示页面未通过 HTTPS（localhost 除外），必须部署在 HTTPS 环境下才能启用
