I'm having trouble with the YouTube Player API Reference for iframe Embeds...

Specifically with using
(necessary for iOS to allow embeds to play in Safari)

the onPlayerReady function in the demo is not called for for (works fine for )

See steps to reproduce below

Step 1: Use the standard api demo: (copy the code found at the link below)

---> works fine

- Step 2: as instructed in

change

<div id="player"></div>

to (in the demo from Step 1)

<iframe id="player" type="text/html" width="640" height="390" src=";origin=" frameborder="0"></iframe>

(make sure to change origin= to your domain)

---> works fine

- Step 3: in the iframe tag added in the last step, change

src="/...

to

src="/...

---> now the onPlayerReady function is never called

Note: as far as I can tell, this used to work until a few weeks ago...

I'm having trouble with the YouTube Player API Reference for iframe Embeds...

Specifically with using http://www.youtube-nocookie.
(necessary for iOS to allow embeds to play in Safari)

the onPlayerReady function in the demo is not called for for http://www.youtube-nocookie. (works fine for http://www.youtube.)

See steps to reproduce below

Step 1: Use the standard api demo: (copy the code found at the link below) https://developers.google./youtube/iframe_api_reference#Getting_Started

---> works fine

- Step 2: as instructed in https://developers.google./youtube/iframe_api_reference#Loading_a_Video_Player

change

<div id="player"></div>

to (in the demo from Step 1)

<iframe id="player" type="text/html" width="640" height="390" src="http://www.youtube./embed/M7lc1UVf-VE?enablejsapi=1&origin=http://example." frameborder="0"></iframe>

(make sure to change origin=http://example. to your domain)

---> works fine

- Step 3: in the iframe tag added in the last step, change

src="http://www.youtube./embed/...

to

src="http://www.youtube-nocookie./embed/...

---> now the onPlayerReady function is never called

Note: as far as I can tell, this used to work until a few weeks ago...

• javascript
• iframe
• youtube

• Where are you seeing the piece in the documentation provided for the 'nocookie' url? AFAIK there's no restriction on youtube embeds in safari or chrome for ios. Can you provide the specific iframe embed you are using? My first thought is it might be a protocol mismatch. – twill Commented Apr 7, 2016 at 15:17
• No restriction in iOS, but without youtube-nocookie in the url, the video currently won't play in the browser, but instead opens the youtube app and plays there instead. Search for "nocookie" in the following pages: stackoverflow./questions/29794859/… stackoverflow./questions/30263003/… stackoverflow./questions/25972600/… – vitabot1 Commented Apr 7, 2016 at 16:44
• The embed is exactly as described in steps 1&2 – vitabot1 Commented Apr 7, 2016 at 16:53
• What happens if you replace your iframe code with the following: <iframe width="700" height="394" src="//www.youtube-nocookie./embed/xspoREpBOhY?rel=0" frameborder="0" allowfullscreen></iframe> – twill Commented Apr 7, 2016 at 17:29
• No change... The video is displayed, and if you click play, it plays. The problem is that the api is not activating. (the onPlayerReady function is never called) – vitabot1 Commented Apr 7, 2016 at 19:12

3 Answers 3

window.onYouTubeIframeAPIReady = function() {
  player = new YT.Player(document.getElementById('player'), {
    height: '390',
    width: '640',
    videoId: 'M7lc1UVf-VE',
    host: 'https://www.youtube-nocookie.',
    events: {
      'onReady': function() {
        console.log('ready');
      },
      'onStateChange': function() {
        console.log('state change', arguments)
      }
    }
  });
}

$.getScript("https://www.youtube./iframe_api");

I can fully confirm this issue. I've been using youtube-nocookie. for more than a year and suddenly few weeks ago it stopped working. Normal youtube. embeds work just fine.

It seems that this isn't just your problem, I guess it's problem on Google's side.

It seems like that the API works fine with youtube-noocookie.. The following code works in JsFiddle, but does not work in StackOverflow editor.

window.onYouTubeIframeAPIReady = function() {
  player = new YT.Player(document.getElementById('player'), {
    height: '390',
    width: '640',
    videoId: 'M7lc1UVf-VE',
    host: 'https://www.youtube-nocookie.',
    events: {
      'onReady': function() {
        console.log('ready');
      },
      'onStateChange': function() {
        console.log('state change', arguments)
      }
    }
  });
}

$.getScript("https://www.youtube./iframe_api");

<script src="https://ajax.googleapis./ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="player">

</div>