[html] script type="이게 뭘까?" : MIME 타입

 

 흔히 html 파일의 상하단을 보다보면 <script> 태그를 볼 수 있다.

처음 스크립트를 작성했을 때는 "이걸 그대로 복사해서 src 속성만 값을 바꿔서 사용하면 된다"라고 배웠다.

type의 역할이 궁금했던 나는 import 에서 해당 속성을 지워보았으나, 새로고침한 페이지에는 아무런 변화가 없었다.

더더욱 의문이였다. 아무것도 달라지는 게 없는데, 왜 넣었을까?

 

 

<script type="이걸 뭐라고 부르나요?">

scripttype : 스크립트 유형
- JavaScript MIME 유형 : 기본값인 'text/javascript', 'module' 등
- 그외 MIME 유형 : src 속성은 무시됩니다.

표준 미디어 타입의 전체 목록은 IANA 미디어 타입을 참조하세요.  (출처 : w3schools 문서)

 

이걸 읽고 나서 든 내 생각은.

1. <script> 태그의 script type 속성이라고 부르는 구나

2. text/javascript, module을 MIME 유형이라고 하는구나

3. MIME 유형은 뭐고 IANA 유형은 뭐지?

4. src 속성이 무시되는 <script> 태그는 뭘 위한 거지?

    ㄴ 4번에 대하여..
            '정의된 JavaScript MIME 유형 외에 다른 값이 있을 경우, 무시하겠다'로 이해해야 한다.
            처음 읽었을 때는 그외 MIME 유형이 존재한다고 잘못 이해해서 이렇게 생각한 것이다.

 

 

 

MIME 타입 (IANA 미디어 타입)

 문서, 파일 또는 바이트 집합의 성격과 형식을 말하며, IANA 라는 기관에서 관리 및 정의하고 있다고 한다.

MIME 타입과 IANA 미디어 타입은 같은 것을 지칭하고 있었다.

 

 MIME 타입은 슬래시(/)를 구분으로 좌측의 type, 우측의 subtype으로 구성된다. (공백 불가, 일반적으로 소문자 사용)  type은 text, video와 같은 일반적인 카테고리를 나타내고, subtype은 정확한 데이터 종류를 나타낸다.

type/subtype

 

 

따라서 아래 태그를 해석하자면, './index.js 파일은 text 타입의 javascript 파일입니다' 이다.

<script type="text/javascript" src="./index.js"></script>

 

 

참고) 아래처럼 문자 세트를 지정하기 위해서 매개변수를 넘길 수도 있다.

<script type="text/javascript;charset=UTF-8" src="./index.js"></script>

 

 

 

웹 개발자들이 자주 사용하는 MIME 타입

application/octet-stream	이진 파일의 기본값 - 잘 알려지지 않은 이진 파일
text/plain	텍스트 파일의 기본값 - 잘 알려지지 않은 텍스트 파일
text/css
text/html
text/javascript	javascript 컨텐츠가 사용할 수 있는 유일한 MIME 타입. - 다른 MIME 타입은 JavaScript에게 유효하지 않음

 

(용어) 잘 알려지지 않은 : 브라우저가 자동으로 실행하지 않거나 실행해야할지를 묻기도 합니다.

 

 

 

참고) 레거시 JavaScript MIME 타입 

• application/javascript 지원이 중단되었습니다 
• application/ecmascript 지원이 중단되었습니다 
• application/x-ecmascript 비표준 
• application/x-javascript 비표준 
• text/ecmascript 지원이 중단되었습니다
• text/javascript1.0 비표준
• text/javascript1.1 비표준
• text/javascript1.2 비표준
• text/javascript1.3 비표준
• text/javascript1.4 비표준
• text/javascript1.5 비표준
• text/jscript 비표준
• text/livescript 비표준
• text/x-ecmascript 비표준
• text/x-javascript 비표준

 

 

 

 

 

 

 

출처

- https://ko.javascript.info/modules-intro

- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script/type

- https://www.w3schools.com/tags/tag_script.asp

- module 타입에 대한 설명 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Modules

- https://rocketvalidator.com/html-validation/a-script-element-with-a-src-attribute-must-not-have-a-type-attribute-whose-value-is-anything-other-than-the-empty-string-a-javascript-mime-type-or-module