최근 IE6에 CSS3 적용을 위해 CSS3PIE 라는 컴포넌트를 사용하려고 하다보니 작동하지 않는 문제에 부딪혔는데, 다른 분들이 같은 문제를 겪을수도 있기에 테스트 하는 방법과 어떻게 해결하는지에 대해서 좀 적어보도록 하겠습니다.
HTC(HTML Component)가 뭘까요?
Microsoft에서 Internet Explorer용으로 개발한 컴포넌트 수행 방법입니다.
IE용이란 말의 의미는? Firefox나 Chrome등의 브라우저에서는 작동하지 않는다는 뜻이죠~
IE5부터 사용 가능합니다.
그럼 어떻게 사용하는 건가요?
.htc 라는 확장자를 가진 컴포넌트 파일을 CSS에 등록함으로 사용할 수 있습니다.
예제를 보면 좀 쉽게 이해할 수 있을 것 같습니다.
test.html
<html>
<head>
<title>HTC Test Example</title>
<style
type="text/css">
body {
behavior:url('test.htc');
}
</style>
</head>
<body>
</body>
</html>
test.htc
<public:component>
<public:attach event="ondocumentready" onevent="init()"/>
<script language="JavaScript">
<!--
function init() {
alert('htc loaded : htc');
}
-->
</script>
</public:component>
이 두개의 파일을 같은 디렉토리에 넣고 test.html을 열었을 때 알림창이 뜨면서 htc loaded 라는 메시지가 보이면 정상 작동이 되는 것입니다.
더 많은 예제를 보고 싶으시다면 'htc component'로 검색하시면 많이 나옵니다. HTC만 검색하면 스마트폰이 검색되더라구요~
잘된다면 다행, 안된다면??
HTC 컴포넌트가 작동하지 않는 경우가 있습니다.
위처럼 해서 한번에 작동한다면 골치 아플 일 없는데, 안된다면 골치아프죠~
제 경우에는 .htc 파일의 MIME 타입이 지정되지 않은 문제였습니다. ('MIME 타입이 뭐냐' 에 대해서는 검색해 보시면 나올 테니 넘어가도록 하겠습니다.)
두가지 해결 방법이 있습니다.
- 서버에 .htc의 MIME 을 등록한다.
- 컴포넌트 파일의 헤더를 htc 타입으로 지정한다.
이 중 제대로 된 해결책은 첫번째 방법입니다. 두번째 방법은 임시방편으로 이용하면 될 것 같군요
첫번째! 서버에 .htc 의 MIME 등록
대체 이게 뭔소린가??? 싶은 분들을 위한 링크
MIME 등록하는 법은 의외로 간단합니다. 웹호스팅이나 서버호스팅을 하는 경우에는 업체에 '.htc 파일 MIME 등록해 주세요~' 라고만 하면 됩니다.
직접 서버를 운영하거나 서버를 조정해야 하는 경우에는 참고 문서를 검색해 보시는게 좋을 것 같습니다. (너무 무책임하죠? -_-;)
Apache를 쓰느냐 IIS를 쓰느냐에 따라서 설정하는 법이 다르기 때문입니다.
HTC의 타입은 text/x-component 입니다.
두번째!! 헤더에 정보 입력
php 를 기준으로 작성했습니다.
test_htc.php
<? header("Content-Type:text/x-component; charset:EUC-KR"); ?>
<public:component>
<public:attach
event="ondocumentready"
onevent="init()"/>
<script
language="JavaScript">
<!--
function init() {
alert('htc loaded : php');
}
-->
</script>
</public:component>
이렇게 적으면 됩니다. 그리고 당연히 test.html 문서의 'test.htc' 라고 적힌 부분은 'test_htc.php'로 변경해 줘야 겠죠?
MIME에 등록이 안되면 이 방법도 되다가 안되다가 하더라구요~ 불안정하고 수정할 부분이 많은 관계로 추천하진 않습니다.
참고 파일:
test_htc.php
test.html
