스마일 서브JWPlayer는 세계에서 가장 많이 쓰는 Html5/flash 비디오 플레어라고 합니다. 그외 또 여러가지 비디오 플레어가 있는데 Video for Everybody, VideoJS, MediaElement, SublimeVideo가 JWPlayer를 제외하고 가장 훌륭한 크로스 플랫폼 비디오 플레이어 라고 합니다.
다음 그림은 모든 Html5 비디오 플레이어의 비교입니다.
JWPlayer는 가장 오래된 비디오 플레이어로서 2005년에 플래시 비디오 혁명을 이끌었다고 합니다. 그러면 JWPlayer를 어떻게 빌드 하는지 알아보겠습니다.
먼저 https://github.com/jwplayer/jwplayer에서 소스를 다운받습니다.
다음 Flex SDK 무료입니다. Flex SDK 4.1: http://sourceforge.net/adobe/flexsdk/wiki/Downloads/ 를 다운받아 설치하고, Ant 1.7.0: http://ant.apache.org/bindownload.cgi 를 다운받아 설치합니다. 다음 python2.7.8: https://www.python.org/ 도 설치합니다. 그러면 이제 준비단계가 완료 되였습니다. Ant는 make와 비슷한 Java컴파일러 입니다.
다운로드 받은 소스의 압축을 풀면 build폴더가 있습니다. 폴더내의 build.properties파일을 열고, 참고로 저는 notpad++에서 편집하였습니다. flexsdk = C:\Program Files (x86)\Adobe\Flex Builder 버전\sdks\4.6.0 경로를 설정해주고, 윈도우일경우 execextension을 .exe로 설정해 줍니다. src/flash/com/longtailvideo/jwplayer/player내의 PlayerVersion.as파일에 보면 protected static var _version:String = JWPLAYER::version;으로 되여있습니다. 이부분을 수동으로 protected static var _version:String = “6.11.0”;라고 설정해 주어야 합니다. 다음 명령항에 ant -buildfile build\build.xml를 치면 컴파일 완료 할수 있습니다. 소스코드를 보면 JWPlayer전체설정을 하는 .js부분과 flash 비디오 플레이어 .as부분 Html5 비디오 플레이어 부분 .js로 되여있습니다. Html5 .js부분은 JWPlayer .js부분에 내포 되여있습니다. 컴파일한 파일은 bin-release에 jwplayer.flash.swf, jwplayer.html5.js, jwplayer.js 세개 파일이 생성됩니다. 참고로 JWPlayer 비디오 플레이어.as 와 JWPlayer Html5 비디오 플레이어 부분은 MVC패턴으로 구성되였습니다.
실행하려면 Html파일에
<html>
<head>
<script type=”text/javascript” src=”/jwplayer/jwplayer.js”></script>
<script type=”text/javascript”>jwplayer.key=”zQ9aGF3bubE5WehtXCU7ZLkVKJlb6CyXlBrtHA==”;</script>
</head>
<body>
JW player!
<div id=”myElement”>Loading the player…</div>
<script type=”text/javascript”>
jwplayer(“myElement”).setup({
file: “rtmp://localhost/yourdirectory/yourfile.flv”,
image: “./uploads/yourfile.jpg”,
});
</script>
</body>
</html>
라고 입력하고 실행시켜 보면 동영상이 재생되는것을 확인할수 있습니다.
(PS: ant 가 jdk 32bit 버전밖에 지원하지 않아 jdk 32bit버전이 설치되였는지 확인해야 합니다. JAVA_HOME, path를 다 이것으로 설정하여야 합니다.)
[polldaddy rating=”7739789″]