使用音频元素做出反应并确保显示持续时间

Question

这个音频标签的定义如下：

<audio controls={true} src={src} preload='metadata' />

其中 src 是音频链接的某个 url。

在播放音频之前，播放器是这样的：

不显示持续时间。 播放完后才会显示时长，如下所示：

有没有办法在播放前显示开始时的持续时间？还是我用错了？

这是一个例子：

<audio src='https://filebin.net/266mdduooymtmdhz/M2789gDcadGu6vLYVdZa.webm' controls preload='metadata' />

Answer 1

来自音频

preload

属性的 MDN 文档：

每个浏览器的默认值都不同。规范建议将其设置为

metadata

。

注：

autoplay

属性优先于

preload

。如果指定了

autoplay

，浏览器显然需要开始下载音频进行播放。

浏览器并没有被规范强制遵循该属性的值；这只是一个提示。

您不能依赖浏览器尊重此属性。对我来说，FF 119 无需按播放即可显示预加载时间，但在 Chromium 119 上则不会。