* 벅스뮤직 주소가 바뀐 관계로 아래에서 bugsmusic.co.kr은 모두 bugs.co.kr으로 바꿔야 함을 알립니다. (다시 강좌 만들기 귀찮아서...;;)

안녕하세요. 토끼군입니다. 오늘의 강좌(뭐냐!)는 벅스뮤직 음악을 페이지의 배경 음악으로 까는 방법입니다. 몇 개의 부분으로 나뉘어 있으며 관심 없는 사람-_-은 몇 개는 건너 띄어서 읽어도 됩니다. 음... 아무튼 대략 난감합니다. (쿨럭)


1. 서론

많은 사람들이 자기 홈페이지나 카페에 배경 음악을 넣습니다. 배경 음악을 넣기 위해서는 필연적으로 배경 음악이 들어 있는 음악 파일이 있어야 하는데, 자기 계정이 있는 사람이라면 모를까 그렇지 않다면 상당히 골치 아픈 것이 사실입니다. 게다가 자기 계정이 있다 하여도, 음악 파일의 특성상 트래픽을 유발하기 쉽기 때문에, 신나게 음악을 페이지에 넣는 것은 좀 무리가 있다 하겠습니다.

그래서 사람들은 꾀-_-를 부렸습니다. 벅스뮤직과 같은 스트리밍 음악 사이트에서 주소를 빼 와서 그 주소를 가지고 음악을 재생한다! 이 의외로 멋진-_-;; 아이디어는 이윽고 널리 퍼져서 많이 사용되게 되었습니다. 하지만 벅스뮤직 측에서 이 아이디어를 좋아할 리는 없겠지요. 덕분에 몇 차례의 플레이어 교체-_-를 통해서 지난 소스가 무력화되고, 또 발견한 후 무력화되고... 하는 것을 반복하고 있습니다.

제가 설명할 방법은 현재 사용하는 벅스 플레이어 4.1에서 적용되는 방법입니다. 하지만 벅스뮤직이 언제 이 플레이어를 교체할 지 알 수 없기 때문에, 저는 결론과 함께 이 결론-_-을 이끌어 낸 방법을 함께 설명하려 합니다. 이렇게 한다면 플레이어가 교체되어도 알아서 방법을 찾아 낼 수 있다고 생각하기 때문입니다.

* 주의: 결론만 필요하시다면 2장은 읽지 않으셔도 상관 없습니다. 하지만 가급적이면 읽고 넘어 가시길 바랍니다.


2. 과정

몇 가지 과정으로 쪼개서 살펴 보겠습니다. :-)


(1) 일단 플레이어의 주소를 알아 낸다!

제가 알아 내고자 하는 노래는 .hack//SIGN의 오프닝 곡인 "Obsession"이란 노랩니다. See-saw가 불렀지요. 뭐 무슨 노래인 진 상관이 없으리라 생각됩니다만. :-) 아무튼 아무 노래나 잡다 보니 이 노래가 잡히더군요.;;

일단 플레이어의 주소를 알아 내야 합니다. 검색해서 찾아 보면 Obsession은 맨 끄트머리(..)에 나옵니다. (덕분에 갈무리가 쉬웠음. -_-) "듣기" 버튼 위에 마우스 포인터를 올리면 이 노래의 코드가 jap0S117850라는 걸 알 수 있을 겁니다.


[그림 1]

이 상황에서 플레이어의 주소를 알아 내는 방법은 두 가지가 있습니다. 하나는 자바스크립트를 가지고 추적해서 알아 내는 방법과, 또 하나는 새로 띄워진 창에서 바로 주소를 알아 내는 방법입니다. 이 경우엔 후자가 더 쉽지만 궁극적으론 전자가 더 많이 사용되므로 두 개 다 설명하겠습니다.


(2) 자바스크립트로 노가다를 해라!

일단 위에서 나온 파일의 주소는 다음과 같습니다:
http://search.bugsmusic.co.kr/search.bugs?lang=0&where=song&query=obsession&start=1

이 파일에는 script 태그가 몇 개 있습니다. 근데 내용은 하나도 없고 src 속성이 있군요. 이건 바로 외부의 자바스크립트 파일을 삽입하는 명령입니다. src 속성은 물론 삽입할 자바스크립트 파일의 주소고요. src 속성만 나열해 보면 다음과 같습니다:
http://music.bugsmusic.co.kr/javascript/tsong_list.js
http://music.bugsmusic.co.kr/javascript/ad.asp?site=ksearch
http://music.bugsmusic.co.kr/javascript/search_top.asp?lang=0&where=song&query=obsession
http://music.bugsmusic.co.kr/javascript/search_imgmap.js
http://music.bugsmusic.co.kr/javascript/ad_left.asp?site=ksearch

앞뒤의 주석을 보면 뒷쪽 네 개는 광고 등등의 용도로 쓰인다는 걸 알 수 있습니다. (설마 주석 안 보시지는 않았겠죠? :-) 그렇다면 여기서 가장 가능성이 높은 주소는 맨 위의 주소겠죠? 이 파일을 열어 봅시다. (익스플로러의 경우 "view-source:http://music.bugsmusic.co.kr/javascript/tsong_list.js"라고 주소를 쓰면 바로 메모장으로 소스가 나옵니다.)

[그림 1]을 보셨다면 "듣기" 버튼이 클릭될 경우 onesong('jap0S117850');라는 자바스크립트가 실행된다는 걸 알 수 있습니다. 이 onesong 함수를 tsong_list.js 파일에서 찾으면 다음과 같이 나옵니다.


[그림 2]

window.open 함수가 있는 걸로 봐서 새 창을 띄우는 걸 알 수 있습니다. 이게 바로 플레이어겠지요?

첫째 인수에 "http://player.bugsmusic.co.kr/player5/playero.asp?idx="+c1+","라고 되어 있고, 앞에서 c1이 'jap0S117850'이 되므로, 결과적으로 새 창의 주소는 http://player.bugsmusic.co.kr/player5/playero.asp?idx=jap0S117850, 이 됩니다. :-)


(3) 귀차니즘을 방지하기 위한 간단한 방법!

다른 방법도 있습니다. 새로 띄워진 창에서 주소를 바로 알아 내는 방법인데, 벅스 플레이어 같은 경우 키를 죄다 막아 버리기 때문에(..) 좀 꽁수를 써야 합니다.

벅스 플레이어가 실행되어서 창이 띄워지고 잠시동안 로딩하느라-_- 키가 막아지지 않는 때가 있습니다. 그 때를 기다려서 (익스플로러의 경우) Ctrl-N 키를 죽어라 누릅니다! 타이밍이 맞았다면 새 창으로 뜨면서 다음과 같은 주소 표시줄도 함께 나올 겁니다.


[그림 3] 아XX버 광고는 슬쩍 편집해서 모자이크 처리했습니다. ;ㅁ;/

간단하게 알아 냈죠? 하지만 이 방법만으로 모든 것을 해결할 순 없습니다. :-)


(4) 진짜 HTML 소스를 알아 낸다!

이제 가장 골때리는 내용만 남았습니다. 문제의 플레이어 소스에서 실제로 음악을 재생하는 부분을 찾는 것입니다.

예전의 플레이어에서는 좀 복잡하게 알아 내야 했는데, 이번 버전은 상당히 간단하게 알아 낼 수 있었습니다. -_- 이런 경우에는 다음과 같이 찾아 보면 될 겁니다:

1) embed나 bgsound 태그를 찾는다. (옛날엔 이랬는데 요즘은 안 그런다)
2) object 태그를 찾는다. (ActiveX로 플레이어를 만들기도 한다)
3) iframe 태그를 찾아서 해당되는 페이지도 함께 조사해 본다. -_- (예전에 한 번 이랬다)

이번 버전의 경우 다음과 같이 정리할 수 있겠습니다:

1) embed나 bgsound 태그가 존재하지 않았습니다. -_-

2) object 태그는 두 개 있었습니다. 두 개의 codebase는 다음과 같습니다:
http://so.bugsmusic.co.kr/SetGlb.cab#version=2,0,0,4
http://so.bugsmusic.co.kr/BugsOggPlay_5.CAB#version=1,1,9,0
그러나 주소를 보면 아시겠지만 두 번째 codebase가 더 가능성이 높겠죠? :-p

3) iframe 태그는 세 개 있었습니다. src 속성만 뽑으면 다음과 같습니다.
http://ads.bugsmusic.co.kr/html.ng/site=player&size=46860web&age=&gender=&area=&mobile=
http://player.bugsmusic.co.kr/player5/highright_include.htm
http://player.bugsmusic.co.kr/player5/init_list.htm
그런데 id나 name을 보면 알겠지만, 첫째 것은 광고이고 셋째 것은 재생중인 노래의 목록이란 걸 알 수 있습니다. 그러나 둘째 것의 name이 ins이고, 그 주소로도 뭣인지를 추측할 수 없습니다. 이럴 때는 한 번 이 페이지를 열어 보는 것이 좋은데, 황당-_-하게도 이 페이지는 가사가 하이라이트되는 부분이었습니다. (근데 왜 highright야!)

고로 2번의 object 태그 중 codebase가 http://so.bugsmusic.co.kr/BugsOggPlay_5.CAB#version=1,1,9,0 인 것이 재생을 위한 코드일 가능성이 높습니다. 한 번 해 볼까요?

<object classid="clsid:66B30EA0-C033-4D4B-9F90-EA0AF07363AF"
        CODEBASE="http://so.bugsmusic.co.kr/BugsOggPlay_5.CAB#version=1,1,9,0" width="0" height="0"  name="mplayer" id="mplayer" VIEWASTEXT>
  <param name="Key" value="9708">
  <param name="FileName" value="http://player.bugsmusic.co.kr/player5/meta_enc.asp?music_idx=jap0S117850,&mode=">
  <param name="AutoRestart" value="-1">
  <param name="BufferTime" value="5">
  <param name="PlayCount" value="1">
  <param NAME="BugsID" VALUE="$$$$$$$$$$$$$$$$">
</object>

이 소스를 복사해서 HTML 파일로 만들어서 틀어 보면 된다는 것을 알 수 있습니다 :-)

(9월 3일자인가....;;로 벅스뮤직 주소가 모조리 www.bugs.co.kr로 바뀌었습니다. 실제로 사용하기 위해서는 bugsmusic.co.kr 대신 bugs.co.kr를 써야 합니다. 늦게 바꿔서 죄송합니다.;;; -- 토끼군, 2003년 9월 11일 수정)


(5) 응용편 -_-

이제 이 소스를 잘 조사해 보기로 합시다. 일단 <param> 태그 중에서 필요 없는 건 제외하는 게 좋겠죠. 대충 찍어 보면 BugsID는 지워도 될 거라 생각할 수 있습니다.

나머지는 직접 테스트를 해 봐야 할텐데, 제가 해 본 결과로는 FileName, AutoRestart, BufferTime, PlayCount만 있어도 실행되는 것을 알 수 있었습니다. 그러나 이 네 <param> 태그 중 하나라도 없으면 제대로 나오지 않습니다.

그리고 FileName을 보면 아시겠지만, 이 주소에서 코드를 바꾸면 다른 노래도 가능할 거라고 예상할 수 있습니다. 실제로 이게 가능하다는 걸 알 수 있죠. 이렇게 해서 아주 간단하게 벅스뮤직의 ogg 파일을 재생할 수 있습니다.

* 재미로 http://player.bugsmusic.co.kr/player5/meta_enc.asp?music_idx=jap0S117850, 의 내용을 살펴 봅시다. 다음과 같이 나옵니다:
BUGS20857F9E71FD69D73F20337D234A2275397D1326BC7571161758... (대략 생략)
...이걸 가지고 주소를 알 순 없겠죠. 이 상황에서 주소를 알려면 패킷을 가로채서 보여 주는 프로그램을 써야 합니다. (찾아 보면 하나인가 관련 글이 있는데 주소를 까먹었습니다. -_-)


3. 결론

현재 사용되는 벅스 플레이어 4.1을 사용해서 노래를 재생하려면 다음과 같은 코드를 쓰면 됩니다.

<object classid="clsid:66B30EA0-C033-4D4B-9F90-EA0AF07363AF" codebase="http://so.bugsmusic.co.kr/BugsOggPlay_5.CAB#version=1,1,9,0" style="width:0px; height:0px;">
  <param name="FileName" value="http://player.bugsmusic.co.kr/player5/meta_enc.asp?music_idx=[벅스뮤직코드]," />
  <param name="AutoRestart" value="-1" />
  <param name="BufferTime" value="5" />
  <param name="PlayCount" value="1" />
</object>

물론 [벅스뮤직코드]는 해당 음악의 코드로 바꾸면 됩니다. :-)


4. 헛소리

실제로 이걸 가지고 제 누리집의 배경 음악을 넣고 있습니다. (광고 방지를 위해서 주소는 제끼겠습니다;;;)

시도는 하지 않았지만 FileName을 바꿔 주면 여러 개도 재생 가능할 거라 생각됩니다. 한 번 시도해 보신 분이 있다면 연락해 주세요. :-p

재생 설정은 AutoRestart, BufferTime, PlayCount를 조정하면 가능할 거라 생각됩니다. :-)

마지막으로 이 코드는 벅스 플레이어가 바뀌면 사용 불가능할 가능성이 높음을 뒤늦게(..-_-+) 알립니다. (도망간다)


- 토끼군