2007년 1월 8일 월요일

XSPF Web Music Player (Flash)

요즘 동영상 형태의 UCC(User-Created Content, 사용자가 직접 만든 컨텐츠를 말함)를 공유하는 사이트들이 많은데 여기에 크게 기여하는 것이 Flash로 만들어진 동영상 재생 프로그램이 아닌가 싶습니다. 예전의 Browser plug-in 또는 ActiveX component에 의존하던 방식은 사용자의 OS 환경이나 인터넷 브라우저 종류에 따라서 많은 제약이 있었죠. 그런데, FLV라고 불리는 Flash Movie 형식과 함께 Flash 동영상 재생 프로그램이 나오게 되면서 이러한 문제는 아주 깔끔(?)하게 해결이 되었습니다. Flash 자체가 다양한 OS 환경과 인터넷 브라우저를 이미 지원하고 있었기 때문입니다.

같은 맥락으로, 블로그나 홈페이지에 간단히 MP3 파일을 포함시켜 재생하려고 할 때 주로 Embed 태그를 그냥 사용하실 텐데 이 방법은 페이지를 열람하는 브라우저나 OS 환경에 따라서 재생이 제대로 되지 않는 경우가 발생할 수 있습니다. 이러한 문제를 해결할 수 있는 간단한 Flash MP3 Player가 있어서 소개해드릴까 합니다. - 사실 제가 필요해서 이리 저리 찾던 중 발견하게 된 것이죠. -

XSPF Web Music Player라는 것인데, Source Forge에 등록된 오픈 소스 프로젝트입니다. 공식 홈페이지에서 swf 파일을 받을 수 있고 여기에는 Flash 소스도 함께 포함되어 있습니다.

공식 홈페이지는 다음과 같습니다.

LINK: http://musicplayer.sourceforge.net

이 프로그램은 용도에 따라서 세 가지로 구분이 되는데, 재생 목록과 곡에 대한 정보까지 표시되는 Extended, 간단히 한 줄로 현재 재생되는 곡에 대한 정보만 보여주는 Slim, 오로지 재생 버튼만 표시되는 Button이 그것입니다.

상세한 사용 방법은 공식 홈페이지를 참고하시면 되겠고, 버튼 방식으로 한 곡만 간단히 재생해주는 예제는 다음과 같습니다.
<embed src="http://your.domain/musicplayer.swf?&song_url=http://mp3-song.domain/example.mp3" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" height="18" width="18"></embed>

각각 파란색(MP3 재생 프로그램 swf 파일 URL)과 빨간색(MP3 파일의 URL)으로 된 부분만 적절히 수정해주시면 됩니다.

댓글 2개:

  1. 안녕하세요? 구글블로그에 배경음악을 플래쉬타입으로 넣으려는데 참 힘드네요.
    저는 그냥 '다음'블로그를 웹서버로 이용하려하는데, 아무리 해도 swf 파일과 playlist 파일의 경로가 일치하지 않는군요..

    예제 소스에서 보면, 적어도 playlist url 앞에 swf 파일의 경로가 있는 걸로 봐서요..

    애초 제가 '다음'에 올린게 잘못된 건지 궁금합니다.

    답글삭제
  2. 안녕하세요. 방문해주셔서 감사합니다.

    제가 '다음' 블로그를 써보지 않아서 '다음' 서버에 파일에 어떻게 저장되는지 잘 모르겠습니다. ^^;

    대신, 저는 오피에 가입해서 그 게시판을 자료실 삼아 사용하고 있습니다. 그러니까 오피 게시판에 파일을 올리고 그 파일의 링크를 이곳 블로그에 걸어두는 방식이죠. 오피 게시판에 올린 자료는 고유 다운로드 링크가 제공되기 때문에 외부 어느 곳에서 링크를 걸어도 잘 동작합니다.

    MP3도 그렇게 해서 재생할 수 있도록 한 글이 있습니다.

    Kingdom In The Sky

    이 글에서 제가 XSPF를 사용한 코드입니다.

    <embed src="http://ftp5.ohpy.com/up/elbbs/2007/01/08/16657/1168265978/musicplayer.swf?&song_url=http://ftp5.ohpy.com/up/elbbs/2007/01/08/16657/1168265010/kngdmsky.mp3&" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" height="18" width="18"> </embed>

    swf 파일과 MP3 파일 모두 오피 게시판에 올려져 있는 상태에서 그 고유 링크를 사용한 형태입니다.

    노파심에서 드리는 말씀입니다만, 자신이 직접 만들지 않았거나 저작권이 있는 가요 또는 음악 등의 MP3 파일을 여러 사람이 듣거나 받아갈 수 있는 곳에 올려두는 것은 불법이기 때문에 주의하셔야 합니다. ;)

    답글삭제