유투브 api이용한 시청 완료 처리
유투브 동영상을 플레이 하고 나서 특정한 작업을 하게 해야 하는 경우
아래와 같이 player_api를 통해서 스크립트로 제어가 가능 합니다.
<script src="http://www.youtube.com/player_api"></script>
<script type="text/javascript">
var player;
function onYouTubePlayerAPIReady() {
try {
player = new YT.Player('movieViewDiv', {
height: '500',
width: '750',
videoId: 'movieUrl',
playerVars: {
'autoplay': 0,
'controls': 0,
'autohide': 0,
'rel': 0,
'wmode': 'transparent'
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
} catch (e) {
}
}
function onPlayerReady(event) {
//유튜브 플레이어가 다 만들어지면 호출됨
}
function onPlayerStateChange(event) {
if (event.data === 0) {
if(confirm("시청이 완료되었습니다.\n화면아래 다음 버튼을 클릭하시면 이동하시겠습니까?")==true){
location.href="";
}else{
$("#nexBtnDiv").show();
}
}
}
</script>
해당 스크립트는 동영상이 모두 플레이 되고 나서 다음 버튼이 출력 되고 해당 버튼이 선택 되면 페이지 이동을 하는 소스로 이외에도 events를 통해서 플레이어의 동작 상태에 대한 제어가 가능 하게 되어 있습니다.