Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there any way to set referer to youtube-iframe-api?

I am developing a Chrome extension and I am using youtube-iframe-api.

The player that is made by below codes can play any videos except some limited(?) videos such as vevo.

function onYouTubeIframeAPIReady() { 
  player = new YT.Player('player', {
  height: '300px',
  width: '800px',
  videoId: 'RhU9MZ98jxo', 
  playerVars: {
    'origin': 'https://www.youtube.com',
    'wmode': 'opaque'
  },
  events: {
    'onReady': onPlayerReady,
    'onStateChange': onPlayerStateChange
  }
});
};

I added origin and wmode in playerVars because I had found some answers that they can solve the problem. But they did not work.

I am wondering that it is possible to play vevo videos with embed youtube player (iframe)

like image 326
h4l-yup Avatar asked Dec 25 '17 12:12

h4l-yup


People also ask

Can you play videos with YouTube API?

The IFrame player API lets you embed a YouTube video player on your website and control the player using JavaScript. Using the API's JavaScript functions, you can queue videos for playback; play, pause, or stop those videos; adjust the player volume; or retrieve information about the video being played.

Is iframe an API?

Developers can use the iFrame API to programmatically create and interact with an Embed or with multiple Embeds in the same web app. The iFrame API includes methods that you can use to start playback, change the content rendering in an Embed, or stop playback.


1 Answers

I managed to play a vevo video in w3schools' "Try it yourself" by using the example provided in the youtube API documentation:

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

<script>
      // 2. This code loads the IFrame Player API code asynchronously.
      var tag = document.createElement('script');

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

      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '390',
          width: '640',
          videoId: 'tWQPbHXyoFQ',
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }

      // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
        event.target.playVideo();
      }

      // 5. The API calls this function when the player's state changes.
      //    The function indicates that when playing a video (state=1),
      //    the player should play for six seconds and then stop.
      var done = false;
      function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.PLAYING && !done) {
          setTimeout(stopVideo, 6000);
          done = true;
        }
      }
      function stopVideo() {
        player.stopVideo();
      }
    </script>

What happens when you try to play vevo videos? what errors or messages do you get?

As a youtube uploader, you have the option to deny a video from being embedded in other websites besides youtube, in these cases you can't really do anything about it.

like image 132
bingeScripter Avatar answered Oct 21 '22 23:10

bingeScripter