BC () 및 getPlayer () 메소드를 사용하여
bc()
과getPlayer()
각각의 기능과 사용 모범 사례를 포함한 방법. 또한이 문서에는getPlayer()
과videojs()
Brightcove Player에 대한 참조를 얻는 방법.서문
Brightcove Player로 개발할 때 기본 요구 사항은 플레이어에 대한 참조를 얻는 것입니다. 이를 수행하는 모범 사례는 Brightcove Player 6.x의 수명 동안 변경되었습니다. 따라야 할 모범 사례는 다음과 같습니다 (각 글 머리 기호에 대한 세부 정보는이 문서의 뒷부분에 있음).
- 버전을 사용할 때 플레이어에 대한 참조를 얻으려면
<video>
태그에서 다음 중 하나를 수행하십시오.- v6.16.0 이상사용
videojs.getPlayer()
방법. - v6.16.0 이전사용
videojs()
방법.
- v6.16.0 이상사용
- 사용할 때고급 (인 페이지 삽입)플레이어 구현의 모범 사례는 다음과 같습니다.
- v6.11.0 이상사용
<video-js>
꼬리표. - v6.11.0 이전사용
<video>
꼬리표.
- v6.11.0 이상사용
- 페이지에서 플레이어를 수동으로 인스턴스화하는 경우
bc()
플레이어에 대한 참조를 생성합니다.
getPlayer()
대videojs()
Brightcove Player로 일정 기간 동안 개발을 해왔다면 플레이어에 대한 참조를 가져 와서 저장하는 데 사용되는 다음과 유사한 코드를 거의 확실하게 보셨을 것입니다. myPlayer
변하기 쉬운:
videojs('myPlayerID').ready(function(){
var myPlayer = this;
});
사용하는 경우 v6.16.0 이상 API를 더 깔끔하게 사용하고 권장하는 모범 사례로player.getPlayer()
대신 , 여기에 표시된대로 :
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
});
video-js
태그 대video
꼬리표
Brightcove Player 용 v6.11.0 이상사용하는 것이 가장 좋습니다. <video-js>
위에<video>
. 그 이유는 다음과 같습니다.
- 사용
<video-js>
당신이 얻을 수있는 네이티브 컨트롤 문제의 플래시를 방지합니다<video>
요소. 이에 대한 예는 Chrome 버전 67 이상입니다. Chrome은 잠시 동안 깨진 비디오 아이콘을 표시합니다.<video>
태그가 Brightcove Player로 변환됩니다. 아이콘은 다음과 같이 나타납니다. - 비 비디오 클라우드 미디어를 사용할 때와 같은 일부 경우
<video-js>
플레이어가 초기화 프로세스를 더 많이 제어 할 수 있습니다. 이렇게하면 브라우저와 관련된 자동 브라우저 동작을 방지 할 수 있습니다.<video>
요소.
bc()
방법 세부 정보
그만큼bc()
메서드는 선택한 시간에 플레이어를 인스턴스화하는 데 사용됩니다. 그만큼플레이어 인스턴스화 지연문서는 사용 사례 및 구현에 대해 설명합니다. 그만큼 Brightcove 플레이어 샘플 : 수직 볼륨 제어의 또 다른 사용을 보여줍니다bc()
플레이어가 인스턴스화되기 전에 발생해야하는 볼륨 컨트롤의 방향을 수직으로 변경하려는 메서드입니다.
메서드의 구문은 다음과 같습니다.
bc(id,options)
여기서:
id
:- 설명: 동영상 요소 또는 동영상 요소 ID
- 데이터 유형 : 문자열 | 요소
- 필수 : true
options
:- 설명: 설정 제공을위한 옵션 개체
- 데이터 형식: 객체
- 필수 : 거짓
- 이 메서드는 Brightcove Player 인스턴스를 반환합니다.
예를 들어, 다음을 가질 수 있습니다. video-js
태그와 JavaScript를 차례로 클릭하여 플레이어를 구성합니다.
<video-js id="myPlayerID"
data-embed="default"
data-application-id=""
controls=""
width="640" height="360"></video-js>
<script src="https://players.brightcove.net/1752604059001/default_default/index.min.js"></script>
<script type="text/javascript">
// +++ Define the player options +++
var options = {
controlBar: {
volumePanel: {
inline: false,
vertical: true
}
}
};
// +++ Add the player attributes +++
var myPlayerEl = document.getElementById("myPlayerID");
myPlayerEl.setAttribute('data-account', 1752604059001);
myPlayerEl.setAttribute('data-player', 'default');
myPlayerEl.setAttribute('data-video-id', 5557662144001);
// +++ Create the player +++
bc(myPlayerEl, options);
</script>
일반 플레이어 구성 옵션 (자세한 내용은플레이어 구성 가이드 ), 다음과 함께 사용할 수 있습니다. bc()
방법:
유효한 구성 옵션 |
---|
autoplay |
language |
languages |
loop |
muted |
playsinline |
preload |
techOrder |