检测嵌入的 Youtube 播放器字幕答案

【问题标题】：Detect embedded Youtube player captions检测嵌入的 Youtube 播放器字幕
【发布时间】：2023-03-30 12:43:02
【问题描述】：

是否可以检测嵌入式播放器中的 youtube 字幕是打开还是关闭？

如果用户选择显示字幕，目前无法抑制字幕。如果字幕打开，我想显示一条自定义消息。

据我所知，在documentation 中没有提到这一点。

【问题讨论】：

检查这个页面也许对developers.google.com/youtube/2.0/…有帮助
@UnLoCo 与视频本身有关，我所寻求的绝不依赖于视频，而是依赖于嵌入式播放器。
似乎用传统方法是不可能的。可以通过检查html5播放器的dom来完成吗？字幕应该在那里，对吧？
@MikulasDite HTML5 播放器将嵌入到 iframe 中，因此您将无法访问其内容[同源策略]
@MikulasDite：您必须使用postMessage 与 HTML5 播放器的 iframe 进行通信（由于同源策略，无法直接访问），在那里公开的 API 是与 Flash 播放器相同。

标签： javascript youtube youtube-api

【解决方案1】：

我在他们的 api 文档中没有找到这个，但是使用你的 youtube 播放器对象你应该能够做到：

player.getOptions("captions") || player.getOptions("cc")  //detects if captions were ever loaded at one point.

也可以通过js开启：

player.loadModule("captions");  //Works for html5 ignored by AS3
player.loadModule("cc");  //Works for AS3 ignored by html5

关闭它：

player.unloadModule("captions");  //Works for html5 ignored by AS3
player.unloadModule("cc");  //Works for AS3 ignored by html5

在加载模块时更改哪种语言：

player.setOption("captions", "track", {"languageCode": "es"});  //Works for html5 ignored by AS3
player.setOption("cc", "track", {"languageCode": "es"});  //Works for AS3 ignored by html5

【讨论】：

很好的发现，谢谢！在本地化网站时更改 cc 语言特别有用。
小心，不是python，[]是真的。第一个例子不太对。
当我在控制台中尝试时：document.getElementsByTagName('video')[0].getOptions() 不是一个函数。嗯
@cybercoder, document.getElementsByTagName('video')[0]1 将返回 HTML5 视频元素，而不是 YouTube Iframe API。为了与 YT 播放器进行交互，您需要从 iframe 中获取 ID 并将其交给 YT.get() 例如，YT.get(document.querySelectorAll('iframe[title="YouTube video player"]')[0].id).getOptions() 有关 YouTube Iframe API 的更多信息，请访问：developers.google.com/youtube/iframe_api_reference

【解决方案2】：

很简单，你可以;)

<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<script src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
  <div id="ytapiplayer">
    You need Flash player 8+ and JavaScript enabled to view this video.
  </div>

  <script type="text/javascript">

    var params = { allowScriptAccess: "always" };
    var atts = { id: "myytplayer" };
    swfobject.embedSWF("http://www.youtube.com/v/QRS8MkLhQmM?enablejsapi=1&playerapiid=ytplayer&version=3",
                       "ytapiplayer", "640", "480", "8", null, null, params, atts);

    var stateChange = function(a) {
            if (ytplayer.getOptions().indexOf("cc") !== -1) {
        alert("closed captions are on");
      } else {
        alert("closed captions are off");
      }
    }
   function onYouTubePlayerReady(playerId) {
      ytplayer = document.getElementById("myytplayer");
      ytplayer.addEventListener("onStateChange","stateChange");
    }
  </script></body>
</html>

顺便说一句：谷歌摇滚 ;)

这应该可以解决问题 - 请不要在生产模式下使用它 - 这只是一个快速总结。你需要倾听你想要的状态，我只是在任何事件中提醒;）

【讨论】：

你确定这会检测到 CC 何时开启，而不是可用？
@Walialu 谢谢，虽然我担心闪存对我的使用来说是禁区。我需要 iOS 和通用字幕支持。同样作为@Sergiu mensions，从API 参考来看，getOptions 返回 CC 的客户端可见性还很不清楚：developers.google.com/youtube/flash_api_reference
幸运的是，该 API 也适用于 HTML5 API，但存在同样的问题：它在 CC 可用时返回一个非空数组，而不是在它们实际显示时。
在我的示例中，如果打开则返回 cc，如果可用则返回 cc ;-)
@Walialu 在这种情况下真是太棒了。我马上去试试。