컨텐츠 캐시

한정훈 에반젤리스트

컨텐츠 캐시 동영상 서비스 JWPlayer 이용 메뉴얼

JWplayer 8.0 기준으로 작성되었습니다.

현재 JWplayer 8.x 는 Developer 테스트 버젼으로 Self-hosted 버전이 제공되지 않으며
cdn.jwplayer.com 를 통한 클라우드 호스트 버젼만 제공되고 있습니다.
jwplayer : https://www.jwplayer.com/


 

 

 

JWPlayer 스크립트 첨부 

<script src="/players/jwplayer/jwplayer.js"></script>

Self-hosted 가 가능한 Enterprise 라이센스로 사용할 경우 서버에 올린 jwplayer의 위치를 확인하여 불러옵니다. 

 

 

 

<script src="https://cdn.jwplayer.com/libraries/플레이어URL.js"></script>

 클라우드 호스트 버젼 ( Starter 라이센스, Developer 테스트 라이센스 )은
jwplayer 홈페이지 대쉬보드에서 확인 가능한 플레이어 라이브러리 주소를 입력합니다.

 

 

jwplayer 라이센스키를 추가합니다.  

<script>jwplayer.key='라이센스키';</script>

 

 

플레이어 추가 및 영상 소스 첨부 

 <div id="player">Loading player ...</div>
<script> const player = jwplayer('player').setup({
file: 'http://계정명.cache.iwinv.net/Sample.mp4'
});
</script>

 JWplayer 를 추가하고 영상소스 url을 입력합니다. 

 

영상이 정상적으로 불러와지는지 확인합니다.  

 

 

동영상 썸네일 이미지 추가하기

영상 업로드시 생성되는 썸네일이미지나 직접 만든 이미지를 썸네일로 사용할 수 있습니다.

   <div class="player">Loading player ...</div>
      <script>
         const player =jwplayer('player').setup({
image: 'http://계정명.cache.iwinv.net/Thumbnail/Sample.jpg',
file: 'http://계정명.cache.iwinv.net/Sample.mp4',
});
</script>

 

image: 이미지 경로 로 썸네일 이미지를 불러올 수 있습니다. 

 

 

 

 

썸네일이 정상적으로 추가 되었는지 확인합니다.

 

동영상 추가 설정 

height, width, title, autostart 같은 크기지정, 제목 설정, 자동재생 설정 등의 설정이 가능합니다. 

 

   <div class="player">Loading player ...</div>
      <script>
         const player =jwplayer('player').setup({
image: 'http://계정명.cache.iwinv.net/Thumbnail/Sample.jpg',
file: 'http://계정명.cache.iwinv.net/Sample.mp4',
title: '영상제목',
height: "720",
width: "1024",
autostart: true,
});
</script>

 

height = 영상 높이   

width = 영상 넓이 

title = 영상 제목 

autostart = 자동재생 설정 

 

 

jwplayer 의 자세한 설명은  https://developer.jwplayer.com/jwplayer/docs 에서 확인 가능합니다.