Javascript
Youtube iframe API 기본 샘플 코드 (일시정지, 화질설정)
- 2022.04.13 11:19:35
Youtube의 iframe API를 통해 동영상을 제어하는 기본 샘플 코드. 문서 상단에 Javascript SDK를 포함 시킨다. <script async src="https://www.youtube.com/iframe_api"></script>
아래와 같이 기본 코드를 작성한다. 아래 예시에서는 onReady, onStateChange 예시 코드를 함께 포함 시켰다. <script>
//동영상 로드 function onYouTubeIframeAPIReady(vid) { var player; player = new YT.Player('muteYouTubeVideoPlayer', { videoId: vid, // YouTube Video ID width: 1100, // Player width (in px) height: 610, // Player height (in px) playerVars: { autoplay: 0, // Auto-play the video on load controls: 0, // Show pause/play buttons in player showinfo: 0, // Hide the video title modestbranding: 0, // Hide the Youtube Logo loop: 1, // Run the video in a loop fs: 0, // Hide the full screen button cc_load_policy: 0, // Hide closed captions iv_load_policy: 3, // Hide the Video Annotations autohide: 0, // Hide video controls when playing rel: 0 }, events: { onReady: function(e) { //e.target.setVolume(5); }, onStateChange : function(e){ if(e.data==0){ console.log('state Change!'); } } } }); } </script> 위와 같이 생성된 player 객체에 다양한 Method를 통해 동영상을 제어할 수 있다. 예시는 아래와 같다. [일시정지]
player.pauseVideo(); [화질설정] player.setPlaybackQuality('highres'); |