JWPlayer 강좌 (2) - Supports & JW Player 설치하기

1.3. Device Support

 

 * HTML5과 와 Flash 에 모두 대응.
 * 대부분의 데스크탑 브라우저와 모바일 디바이스에서 동작.
 

Desktop	Mobile	Download Fallback
* Chrome, Firefox, IE, Safari, Opera 에서 모두 HTML5와 Flash 재생 지원.  * 브라우저의 특수한 경우를 제외하고.. (Firefox 에서의 MP4)  * IE8 조차 모두 지원!!	* HTML5 기반인 경우 iOS(iPhone & iPad), Android(스마트폰 & 태블릿)을 완벽히 지원.  * 터치 스크린에 최적화  * 스마트폰에서는 Full-Screen Mode, 태블릿에서는 Window Mode & Full-Screen Mode 선택 지원.	* HTML5와 Flash 모두 지원하지 않는 경우 대체 다운로드 기능 지원 (e.g. BlackBerry Phone)  * 이미지와 재생 버튼을 포함한 링크 생성 및 디바이스 자체 플레이어로 재생될 수 있도록 지원.  * 거의 모든 시나리오에 대응하며 Fallback 기능 및 On/Off 기능도 지원.

 

 

1.4. Browser & Media Support

 

 * 대부분의 데스크탑 웹브라우저 및 모바일 디바이스 플랫폼에서 다음과 같은 미디어 포맷을 지원.

 * HTML5<video> 와 Adobe Flash를 동시 지원.
   (대부분의 브라우저, 디바이스 및 오디오/비디오 포맷의 넓은 범위 지원)

Browser	Video	Audio	YouTube	Streaming
Chrome	MP4, FLV, WebM	AAC, MP3, Vorbis	Yes	HLS, RTMP ①
Internet Explorer	MP4, FLV	AAC, MP3	Yes	HLS, RTMP ①
Firefox	MP4, FLV, WebM	AAC, MP3, Vorbis	Yes	HLS, RTMP ①
Safari	MP4, FLV	AAC, MP3	Yes	HLS, RTMP ①
iOS	MP4	AAC, MP3	Yes②	HLS
Android	MP4, WebM	AAC, MP3, Vorbis	Yes②	- ③

 

① JW Player Premium 이상에서만 데스크탑에서의 HLS 를 지원
② 제한된 지원 (Official Chromeless Player API, 컨트롤 스킨)
③ 안드로이드에서는 공식적으로 지원하지 않음.

 

* JW Player는 사이트에 접속한 사용자의 브라우저 또는 디바이스와 재생되는 미디어 포맷 정보를 기반으로 자동으로 HTML5 또는 Flash 를 선택.
 

WebM : Google이 발표한 웹 전용 오픈소스(Royalty Free)의 비디오 파일 포맷으로 VP8비디오 코덱으로 압축된 비디오 스트림과 Vorbis 오디오 코덱으로 압축된 오디오 스트림으로 구성. Apple의 H.264에 대항해 만들어진 오픈소스 비디오 포맷으로 크롬 및 유튜브에서도 지원. (http://ko.wikipedia.org/wiki/WebM)
Vorbis : Xiph.org에서 개발한 손실 압축 오디오 코덱으로 오픈 소스로 제공. 확장자는 보통 .ogg이며, oga를 사용하기도 함. (http://ko.wikipedia.org/wiki/Vorbis)

 

 

1.5. Javascript Support

 

 * JW Player 의 생성(Setup)부터 사용까지 모두 Javascript 형태의 API를 사용하여 구현.

 * Flash와 HTML5에 대한 상세 구현은 모두 추상화되어 있어 동일한 Javascript 의 단일 코드 작업으로 두 환경에 모두 대응 가능.

 * JW Player 에서 제공하는 모든 API는 플레이어의 인스턴스(Instance)를 리턴.

 * jQuery를 통해 API 를 연속적으로 호출하고, 다양한 작업 수행이 가능.
 

 > Javascript Support Link : http://www.jwplayer.com/javascript/

 

 

1.6. JW Player 설치하기

 

 * JW Player는 다음의 2가지 타입의 형태로 서비스를 지원.

 

 1) JW Player Cloud Service (For Cloud-Hosted)
   -> No Setup!
   -> 사용자 계정의 토큰을 포함한 js URL Link 스크립트만 추가! (아래 Cloud-Hosted Player Code 이미지 참조)

 

  2) JW Player Download (For Self-Hosted)
-> https://account.jwplayer.com/static/download/jwplayer-6.11.zip 
-> jwplayer-6.12.zip 파일 받기 jwplayer-6.12.zip

(6.12 이후의 버전을 다운 받으시려면  jwplayer 사이트를 방문하시기 바랍니다.^^ 2015년 4월 12일 기준 최신 버전은 6.12 입니다.)

 

 

 

-> 프로젝트의 적절한 경로에 저장 (e.g. project/js/…)

 

 

 

 

 

 ※ 하나 더 배우기! - JW Player Publish Wizard

   * JW 웹사이트를 통해서도 쉽게 JW Player 스킨을 입힌, 영상 Embed Code를 생성.

   * Publish Wizard Link : https://account.jwplayer.com/#/home

 

 1) Select Video File
   * Media File : 인터넷을 통해 접근 가능한 비디오, 오디오, RTMP 또는 HLS URL을 입력.
   * Poster Image : 포스터 이미지
   * Media Title : 미디어 제목

 

 

2) Configure Your Player
 * Preview / 반응형 또는 고정형 설정 / 화면 비율 설정 / 컨트롤러 Skin 설정
 * 기타 재생에 필요한 옵션 설정 (HTML5 or Flash / Autostart / Repeat 등)

 

 

3) Get Embed Code
 * 필요한 javascript link와 jwplayer embed code 를 제공함.