유튜브 무한재생 만들기

• 아래 코드에서 videoId 값만 바꿔 주면 된다.
• 영상의 재생이 끝나면 onPlayerStateChange 가 호출 되는데 이때 다시 playVideo() 함수 호출해서 다시 재생해 주는 방식이다.
• onPlayerReady 이벤트를 이용해서 플레이어가 준비 되면 자동 재생 되도록 해 두면 페이지가 열리면서 무한재생을 시작하게 만들 수 있다.

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

var player;
function onYouTubePlayerAPIReady() {
  player = new YT.Player('player', {
    height: '360',
    width: '640',
    videoId: 'aPiQKENFWss',
    events: {
      'onReady': onPlayerReady,
      'onStateChange': onPlayerStateChange,
      'onError': onPlayerError
    }
  });
}

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

function onPlayerStateChange(event) {
  if (event.data == YT.PlayerState.ENDED) {
    event.target.playVideo();
  }
}

function onPlayerError(event) {
}
</script>

References

• https://developers.google.com/youtube/iframe_api_reference