HTML5 - 检查是否允许自动播放

HTML5 - Check if autoplay is allowed

我的网站自动播放背景音乐。我让它使用我的自定义控件来播放和暂停。现在,我想根据正在发生的事情设置初始状态。如果音乐即将真正播放,则应显示暂停图标,否则(例如在移动设备上)播放图标。

我会使用 audio.paused 布尔值,但在加载音频之前它始终为 false。

我会使用 audio.autoplay 值,但这对我来说总是正确的,即使在不支持它的设备上也是如此。

有什么干净的方法可以知道音频是否会播放?我想让它与 autoplay 属性保持同步,所以如果我决定删除它,状态应该总是在开始时显示播放图标。

只是播放甚至缓冲歌曲都不是特别公平,因为人们有丝毫机会出于其他原因访问网站,例如检查更新、分享 link。人们可以使用移动网络访问页面,带宽有限,并且这些大小的下载永远不应该在他们背后偷偷摸摸地开始。

编辑:一些额外的参考资料

这里是对 the reasons not to have music on autoplay

的概述

相反,我个人非常喜欢的网站 great use of background music on autoplay

但是,如果您已经在构建自己的播放器并希望将其作为页面的一项功能,那么将播放器设置为自动播放不仅会贬低您自己的作品,而且会完全破坏您的设计。相反,您可以相信想听音乐的人会识别并使用您的音频播放器。

要完全实现您的自定义播放器 GUI,您可能需要监听播放器元素上的所有音频事件并相应地更新您的视图。您要查找的事件是 "canplaythrough",但您可能也想至少对大多数其他事件做出反应。这些事件是:

您目前可以按照

的方式做一些事情
view.showPlayButton();
player.play();

但是一旦你在某个时候想以其他方式切换你的播放器或者发生其他事情,就像它停滞一样,它就会中断,所以最好听一下事件并在一个地方更新你的 GUI,并控制另一个播放器(如启动/停止播放器)。