我正在使用 Hls.js 将视频管理到我的 HTML 页面中。我需要构建一个音量计来告知用户视频的音频电平。由于我需要保留 video.muted = true
,我想知道 Hls.js 是否有任何方法可以从流中提取音频信息并使用它们构建音量计。目标是在不打开视频音量的情况下向用户提供反馈。
最佳答案
您可以使用 Web Audio API 轻松做到这一点。
具体来说,您需要几个节点:
MediaElementAudioSourceNode
您将使用它将音频从您的媒体元素(即 HLS.js 正在播放的视频元素)路由到音频图。AnalyserNode
此节点分析音频 block ,为您提供频率数据(通过 FFT)和时域数据。时域数据是从主流中简化而来的。您可以对其运行最小值/最大值以获得一个值(通常为 -1.0 到 +1.0)。您可以在可视化中使用该值。
您还需要将 AnalyserNode 连接到 AudioContext 的 destinationNode
以在最后输出音频,因为它将从该视频元素重新路由。
请注意,此解决方案并非特定于 HLS。相同的方法适用于任何音频/视频元素,前提是源数据没有受到跨源限制的污染。考虑到 HLS.js 的工作原理,您不必担心这一点,因为 CORS 问题已经解决,否则它根本无法工作。
关于javascript - 为使用 Hls.js 管理的 HLS 视频构建音量计,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65783595/