检测 <iframe> 是否正在播放音频

Question

题

我想知道<iframe>我的网站中嵌入的是否正在播放音频。

理想情况下，<iframe>播放音频的“声音”有多大，但这是可选的。

请注意，<iframe>不在同一来源，因此检查<iframe>不是一个选项。

我的具体用例

我是https://www.timer-tab.com/的开发者，时间一到，YouTube 视频就会开始播放。YouTube 视频正在以<iframe>. 我想知道 YouTube<iframe>是否发出任何声音。如果它不发出任何声音，则使用 Web Audio API 播放后备声音。（YouTube<iframe>有时不发出声音。例如，当用户将其 YouTube 音量设置设置为静音时。不幸的是，无法通过postMessageing YouTube获取该信息<iframe>。）

相关问题

检测音频是否在浏览器 Javascript 中播放。

这不是重复的；我的问题专门针对<iframe>音频检测，而相关问题则针对所有音频检测。

Answer 1

这可能无法通过标题回答您的问题（我认为这甚至不可能），但它可能会解决您的根本问题。您可以使用YouTube 的 JavaScript API来检测音频是否静音，或者根据需要取消静音：

var tag = document.createElement('script');

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

var player;

function onYouTubeIframeAPIReady() {
  player = new YT.Player('ytplayer', {
    events: {
      'onReady': onPlayerReady,
      'onStateChange': onPlayerStateChange
    }
  });
}

function onPlayerReady(event) {
  event.target.playVideo();
}

function onPlayerStateChange(event) {
  if (event.data == YT.PlayerState.PLAYING) {
    console.log("isMuted = " + event.target.isMuted());
    event.target.unMute();
    event.target.setVolume(100);
  }
}

<iframe id="ytplayer" type="text/html" src="https://www.youtube.com/embed/dQw4w9WgXcQ?controls=0&showinfo=0&rel=0&enablejsapi=1" frameborder="0"></iframe>

请注意，此代码片段无法在 StackOverflow 上正常运行，因为它不允许使用iframe元素。我在本地测试了一下，还是有效的。

您可以在文档（iframe 嵌入的 YouTube 播放器 API 参考）中找到更多信息，例如配置属性和所有可用功能。