플레이어 개발자 기본 사항: 고급 플레이어 코드
이 항목에서는 프로그래밍 방식으로 비디오를 자동 재생하는 방법에 대해 설명합니다.
단계
- 플레이어를 프로그래밍 방식으로 제어하기 위한 표준 모범 사례 코드로 시작합니다.
<video id="myPlayerID"
data-video-id="5785633544001"
data-account="921483702001"
data-player="Uj7Yz80yM"
data-embed="default"
data-application-id=""
controls=""
width="640"
height="360"></video>
<script src="//players.brightcove.net/921483702001/Uj7Yz80yM_default/index.min.js"></script>
<script>
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
});
</script>
videojs.getPlayer()
메서드의 익명 함수에서 변수 할당에 따라 플레이어를 음소거하여 자동 재생할 수 있습니다.
myPlayer.muted(true);
- 플레이어의
on()
메서드를 사용하여 이벤트에 대한 이벤트 핸들러 함수를 추가합니다. loadedmetadata
myPlayer.on('loadedmetadata', function(){
});
- 이벤트 핸들러에서 비디오를 재생합니다.
myPlayer.play()
코드 완성
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>
<body>
<video id="myPlayerID"
data-video-id="5785633544001"
data-account="921483702001"
data-player="Uj7Yz80yM"
data-embed="default"
data-application-id=""
controls=""
width="640"
height="360"></video>
<script src="//players.brightcove.net/921483702001/Uj7Yz80yM_default/index.min.js"></script>
<script>
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
// Play here? Two tasks to do
myPlayer.muted(true);
myPlayer.on('loadedmetadata', function(){
myPlayer.play();
});
});
</script>
</body>
</html>