4

If my video has English subtitles, I can force to show them with a code like:

hl=en&cc_lang_pref=en&cc_load_policy=1

So the full code would be:

<iframe 
    width="560" height="315"
    src="https://www.youtube.com/embed/3I3Rjw_4Ucw?hl=en&cc_lang_pref=en&cc_load_policy=1"
    frameborder="0" gesture="media"
    allow="encrypted-media" allowfullscreen>
</iframe>

However, it does not seem to work if the video has not subtitles. I want to force to show the auto-generated subtitles from Youtube in that case. Is it possible?

chelder
  • 3,819
  • 6
  • 56
  • 90
  • possible duplicate of https://stackoverflow.com/questions/14013431/extract-automatic-captions-from-youtube-video – ReyAnthonyRenacia Mar 18 '18 at 08:22
  • @noogui thanks for sharing that url, but it seems a different thing. That post is to extract the subtitles whereas this post is to show the subtitles. – chelder Mar 18 '18 at 18:57
  • I have asked the same question here: https://productforums.google.com/forum/#!topic/youtube/X2oCH4sDngI – chelder Apr 11 '18 at 08:51
  • Same need here, this doesnt work: didnt work, https://www.youtube.com/embed/VIDEOID?cc_load_policy=1&cc_lang_pref=en&autohide=1&controls=1&loop=0&rel=0&fs=1&wmode=opaque&showinfo=1&modestbranding=1&iv_load_policy=1&theme=light&color=red&playsinline=0&enablejsapi=1&origin=http%3A%2F%2F2017.public.onecnc.proj&widgetid=1&yt:cc=on – Daniel Brose Jun 22 '18 at 04:55
  • This is not a duplicate of https://stackoverflow.com/questions/14013431/extract-automatic-captions-from-youtube-video That one is looking to extract the captions from the video, this one is to simply play them. – wolfram42 Jul 13 '18 at 17:08

1 Answers1

6

There is no official or documented way to force auto-generated captions in embedded videos. However there is a solution with the setOption method which works now, but there is no guarantee it will work in the future as this is a non documented call of the method:

<iframe id="existing-iframe"
        width="640" height="360"
        src="https://www.youtube.com/embed/q2C0EO0zzAY?enablejsapi=1&cc_load_policy=1"
        frameborder="0"
        style="border: solid 4px #37474F"
></iframe>

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

  let player

  const onApiChange = _ => {   
    if (typeof player.setOption === 'function') {
      player.setOption('captions', 'track', {languageCode: 'en'}) // undocumented call
    }  
  }

  function onYouTubeIframeAPIReady() {
    player = new YT.Player('existing-iframe', {events: {onApiChange}})
  }
</script>

See this code working in this jsFiddle.

You have to wait for an onApiChange event before using the setOption function. (See: https://developers.google.com/youtube/iframe_api_reference#Events) According to the docs only the 'fontSize' and the 'reload' parameters are supported. However, changing the captions track works too and it turns ON the captions as a side-effect. I tried only the 'en' languageCode, of course this will change to the normal english captions track if there is one available, but will display the auto-generated english captions in the absence of a predefined track.

(You can also query the active captions track with the getOption method, but it will return nothing if the auto-generated captions are used.)

blumi
  • 190
  • 2
  • 6