블로그에 다른 사람들과 보기위해서 삽입한 동영상 UCC. 그런데 IE에서는 문제가 없는데 유독 파이어폭스에서만 플러그인이 설치되어 있지 않다고 나오는 경우가 있습니다.


 플러그인 인데 text/html 플러그인이 필요하다는 식으로 나오죠. 당연히 알 수 없는 플러그인입니다. 그런데 저 문제가 왜 발생하느냐 하면 그거 또한 간단합니다.

 대부분의 UCC들은 퍼가기 소스를 Object와 Embed 두가지 방법으로 제공해주고 있습니다. 그런데 대부분의 업체들이 선호하는 방식은 Object입니다. 왜 그럴까요? 그건 Object는 소스 내에 필요한 플러그인에 대한 설치정보를 담아 설치를 유도할 수 있습니다. ActiveX도 가능하죠. 물론 Embed도 가능은 합니다만 설치정보를 담는게 딱히 정해진 규격이 아니기 때문에 무시하는 브라우저도 있습니다.

 게다가 이글루스는 불법적인 ActiveX 설치를 막기 위해서 Object는 제한적 허용만 하고 있습니다. 일부 파라미터를 필터링해서 삭제하는 경우도 있습니다. 그런데 그 필터링 하는 것이 브라우저에서 실행되는 자바 스클립트를 이용한 에디터에서 자동으로 이루어지는 것 인지라. 그거 또한 브라우저 별로 결과가 다릅니다. 예로, 다음 팟의 영상을 Obect로 포스트 내에 삽입하면 IE로 저장하면 파이어폭스에서 재생이 안되고, 파이어폭스에서 저장하면 IE에서 재생이 안되는 경우가 자주 발생합니다. 수정모드로 들어가서 삽입된 소스를 보면 두개가 또 다르게 나오죠.

 그래서 이런 경우에는 파이어폭스는 Object 코드는 전부 무시하고 Embed만 페이지에 그리게 됩니다. 그런데 위의 스샷과 같은 현상이 발생할 수 있습니다. 분명히 플래시 플레이어 플러그인은 설치되어 있음에도 저렇게 나오죠. 이유는 Embed 소스 내에 반드시 필요한 딱 한가지가 빠진 경우입니다.

type="application/x-shockwave-flash"

 제가 이전에 파이어폭스에서 MP3를 재생하도록 하는 방법을 설명할 때부터 강조해오던 그 type 속성입니다. 물론 저 속성이 없더라도 플러그인이 정상적으로 호출되는 경우가 있습니다. 그 경우는 파일의 경로가 .swf 로 끝나는 경우로 확장자를 인식해서 플러그인이 실행되는 경우 입니다. 그런데 대부분의 동영상 UCC들은 뒤에 인자값을 갖기 때문에 확장자를 인식하지 못해서 type 속성이 없이는 스샷과 같은 알 수 없는 플러그인으로 표시가 나올 수 밖에 없습니다. 간단히 말해서, 확장자를 인식하지 못 했기 때문에 해당 경로를 웹 페이지로 인식한 것입니다. 그래서 text/html 이라고 나오는 거구요.

 이 문제를 해결하기 위해서는 위에 쓴 type 속성을 삽입해 주면됩니다. 그러면 어떤 브라우저에서든지 플러그인만 설치되어 있으면 완벽하게 페이지에 그려지게됩니다.

 동영상 UCC 제공업체들의 개발자들이 항상 실수 하는 것 중 하나가 IE를 우선으로 잡아서 Object에는 신경을 쓰지만 Embed에는 신경쓰지 않는 다는 것입니다. IE에서는 저 type이 없어도 정상적으로 보여지기 때문이죠. 다만, 맞는 플러그인을 찾기 위해서 페이지가 좀 늦게 그려질 수 있다는 정도... 그래서 우선순위도 가지고 있구요. 편하다면 편한 것이겠지만 표준을 지켜야 할 필요성을 없애는 결과로 브라우저 별로 다르게 보이게 만드는 주 원인입니다.

 만약 자신의 블로그에 삽입한 동영상 UCC가 IE를 제외한 다른 브라우저에서 잘 보이지 않는다거나, 혹은 모든 브라우저에서 잘 보이기를 원한다면 Object 보다는 Embed를 사용하시고, Embed에 type이 지정되어 있는지 반드시 확인해 보시는게 좋습니다.