音频元素播放承诺拒绝,即使音频上下文处于 运行 状态

Audio element play promise rejection even while audio context is in running state

我附上了一张截图以供参考,以便更详细地了解我所面临的问题。真见鬼。

我非常了解自动播放政策,并且已经了解了涉及用户交互的可能方法。另外,我不喜欢向用户显示任何屏幕或按钮让他点击,从来没有,我不想那样。

我正在开发一个 wordpress 插件并具有麦克风功能,可以附加到任何 wordpress 网站上的 textbpx,用户点击它(用户交互)。

我还读到我需要恢复挂起的音频上下文,正如您在屏幕截图中看到的那样,音频元素播放方法前后的音频上下文状态 "running"。

我正在使用通过 Audio() 构造函数创建的音频元素。

Note: screenshot is a photo of mac system, I am debugging iphone xr using usb cable.

有人可以帮助我或启发我做错了什么或有任何技术限制。

唉!经过一个星期的地狱般的折磨,我终于成功了。

为了概述解决方案,让我首先描述在 iOS Sfari 上存在问题的工作流程的高级粗略概念。

有问题的工作流程

clickHandler --> AudioContext creation --> Playing audio using audio element.

此工作流程之后的所有音频都在 'play' 承诺中惨败。

对我有用的解决方案

clickHandler --> Play audio using audio element -> AudioContext creation --> Playing audio using audio element.

对我有用的解决方案的兴趣点是您必须使用音频元素作为 'clickHandler' 中第一行代码来播放音频。毫无疑问,承诺仍然失败,但随后的音频确实播放了。

此外,我正在为每个要播放的新音频源创建新的音频元素,这是错误的,因为在 'per-element' 的基础上强加了自动播放策略。因此,我没有为每个源创建新的音频元素,而是在页面加载时创建一次(或者任何适合你的一次性创建),每当我想播放不同的音频文件时,我只是更改'.src'property/attribute.

这就是它对我有用的方式。我必须提一下整个星期持续的地狱,以前在这里回答过问题,他们针对特定问题的解决方案一直是指路明灯,这让我在寻找解决方案时有了新的视角。互联网上的文章、webkit、chrome、苹果关于自动播放政策的文档也很有帮助。