移动端H5需用户首次有效交互（如touchstart）解锁音频播放权限，建议用静音audio预播放建立上下文，并每次播放前检查navigator.userActivation.hasBeenActive，微信环境可补充WeixinJSBridgeReady兜底。
移动端 H5 页面无法直接“自动”播放音频，必须依赖用户交互（如点击、触摸）来激活播放权限。检测用户交互状态的核心，不是监听“是否点过”，而是抓住**首次有效交互时机**，用它来解锁后续音频能力——包括立即播放或为定时提醒、背景音乐等场景建立可复用的播放上下文。
监听首次用户手势事件
浏览器只认明确的用户手势（click、touchstart、keydown），且通常只接受**页面可见且聚焦时**的触发。建议优先使用 touchstart（兼容性更好，避免 iOS Safari 对 click 的 300ms 延迟干扰）：
- 在
document或body上绑定一次性的touchstart监听器 - 触发后立即移除监听，避免重复执行
- 此时调用
audio.play()（哪怕静音）即可建立合法播放上下文
用静音预播放解锁音频系统
很多用户第一次点屏幕只是滑动或看内容，并不希望立刻出声。更稳妥的做法是：用一次静音播放“占位”，为后续任意时间的有声播放铺路：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 创建一个不可见的
<audio></audio>元素，设置muted=true和preload="auto" - 在首次
touchstart中调用play()，不等待 Promise resolve 也可移除监听 - 之后所有音频（包括带音量的背景音乐、通知音效）都能正常调用
play()
检查并兜底恢复用户激活状态
用户切换标签页或锁屏一段时间后，浏览器可能降级激活状态，导致之前能播的音效突然失败。不能只靠“一次解锁，永久有效”：
- 每次准备播放前，检查
navigator.userActivation?.hasBeenActive是否为true - 若为
false，说明当前无合法激活上下文，需引导用户再次交互（例如弹出轻量提示：“点一下继续收听”） - 对定时类音效（如倒计时提醒），可在触发前主动监听
visibilitychange，页面重新可见时尝试恢复激活
微信环境的特殊处理
微信内置浏览器部分版本对 WeixinJSBridgeReady 事件响应更可靠，可作为补充兜底：
- 监听
WeixinJSBridgeReady，在回调中执行一次静音播放 - 同时保留
touchstart主流程，避免桥未就绪时白屏等待 - 注意：该事件仅限微信环境，需先判断
typeof WeixinJSBridge !== 'undefined'
