웹브라우저가 IE(인터넷 익스플로러)인지 확인하기

출처 - http://ooz.co.kr/67

현재 웹 페이지가 어떤 웹 브라우저로 열렸는지 확인하려면 간단히 userAgent값을 확인하면 됩니다.

userAgent 값에 브라우저를 구분하는 고유의 값들이 들어 있습니다.

예를 들면 현재 페이지가 구글 크롬(Chrome)에서 열렸는지 체크하려면 다음과 같이 작성합니다.

 

var agent = navigator.userAgent.toLowerCase();

if (agent.indexOf("chrome") != -1) {

alert("크롬 브라우저입니다.");

}

사파리나 파이어 폭스 역시 다음과 같습니다.

if (agent.indexOf("safari") != -1) {

alert("사파리 브라우저입니다.");

}

if (agent.indexOf("firefox") != -1) {

alert("파이어폭스 브라우저입니다.");

}

 

 

네. 물론 인터넷 익스플로러도 위와 별로 다르지 않습니다.  IE 10버전까지라면 말이죠.

agent 에 msie (microsoft ineternet explorer) 가 포함되는지 확인하면 됩니다.

 

if (agent.indexOf("msie") != -1) {

alert("인터넷익스플로러 브라우저입니다.");

}

 

 

 

Microsoft가 예전부터 표준을 항상 제대로 잘 지키지 않아서 웹 개발자들을 애먹이고는 하는데요. 이유는 잘 모르겠습니다.ㅡ.ㅡ;

(요즘은 그래도 많이 나아졌죠? 그래도 IE9 버전부터는 노력하는 모습이 보입니다. ㅎㅎ)

 

그런데 IE 11 버전에서 msie 가 userAgent 값에서 사라집니다.

이제 userAgent 에 msie 값이 존재하는지 여부 만으로는 현재 브라우저가 IE인지 알아낼 수 없게 되었습니다. (IE11 버전을 찾아내지 못하겠죠?)

 

 

그러면 다른 방법이 있는지 더 알아보겠습니다.

사실 브라우저 종류는 navigator의 userAgent 말고, appName이라는 값으로도 알아낼 수 있습니다.

 

IE의 경우 navigator.appName 값을 확인하면 'Microsoft Internet Explorer' 라는 값을 넘겨 줍니다.

이렇게 보면 appName을 체크하는게 좀 더 명확해 보입니다.

사실 그럼 처음부터 appName으로 설명해주면 되는 거 아니냐할 수도 있습니다.

 

그런데 또 MS가 이상한 짓을 합니다. (이 속성값만으로는 해결이 안되는 문제가 생깁니다.)

IE 버전별로 navigator.appName 값을 찍어보면 다음과 같습니다.

  

IE Version	navigator.appName
7	Microsoft Internet Explorer
8	Microsoft Internet Explorer
9	Microsoft Internet Explorer
10	Microsoft Internet Explorer
11	Netscape

 

 

IE11?? Netscape ???? MS가 갑자기 IE11버전에서 자신의 appName을 Netscape로 바꿔버립니다.

이 말은 즉 appName 만으로도 브라우저가 IE 인지 알아낼 수 없다는 이야기입니다.

 

위의 두 값을 혼합해서 체크해도 IE11 버전은 알아낼 수가 없습니다. 

이제 더 이상 Netscape라는 이름을 단 브라우저가 나오고 있지는 않지만(2008년도 마지막 출시), 사용자가 2000년대 초반 유행했던 Netscape 브라우저로 접속하지 않을거라는 보장을 할 수 없습니다. (물론 거의 없겠죠? ㅎㅎ)

 

 

그럼 어떻게 체크할 수 있을까요? 마지막 보루가 남아있습니다. ㅎㅎ

 

navigator.userAgent 값을 좀 더 살펴봅시다. 예로 윈도우8에서 IE11 버전의 브라우저의 userAgent 값을 살펴보면

 

Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko

 

Trident/7.0 이라는 값이 보입니다.

 

※ 참고 : 트라이던트(Trident)는 MS의 IE에서 사용하고 있는 레이아웃 엔진의 이름이며, MSHTML이라고도 합니다. 그리고 이 엔진은 IE가 4.0 버전일 때부터 도입되어 현재까지 사용되고 있습니다. 그러므로 IE 브라우저를 구분해낼 수 있는 유일한 값이기도 합니다. (다른 브라우저에서는 트라이던트 엔진을 사용하지 않으니까요)

 

그럼 Trident 로 확인하면 되겠군요!! 최소한 4.0 버전 이상에서는 모두 Trident를 사용한다고 하니, Trident를 사용하여 체크하면 되겠습니다.

그런데!! 또 Trident는 IE 7.0 이하의 버전에서는 발견되지 않습니다. ㅠ.ㅠ (정말 뭐 하나 깔끔한게 없는 IE입니다..)

그나마 위안을 삼는다면 Trident 라는 스트링은 IE 브라우저의 userAgent 에서만 발견된다는 점이겠습니다.

 

그래도 위의 3가지 값들을 모두 혼합해서 체크하면 IE브라우저를 알아낼 수 있지 않을까요?

그럼 위의 내용을 바탕으로 간단하게 현재 브라우저가 IE(인터넷 익스플로러)인지 체크하는 코드를 만들어 보겠습니다.

 

var agent = navigator.userAgent.toLowerCase();

 

if ( (navigator.appName == 'Netscape' && navigator.userAgent.search('Trident') != -1) || (agent.indexOf("msie") != -1) ) {

alert("인터넷 익스플로러 브라우저 입니다.");

}

else {

alert("인터넷 익스플로러 브라우저가 아닙니다.");

}

 

* (navigator.appName == 'Netscape' && navigator.userAgent.search('Trident') != -1)

 -> 현재 브라우저가 IE 11 버전인 경우에 해당합니다.

 

* (agent.indexOf("msie") != -1)

 -> 현재 브라우저가 IE 10 버전 이하인 경우에 해당합니다. (사실 IE 6.0 이하 버전은 msie 스트링을 userAgent에 포함하고 있는지 잘 모르겠습니다. 현재 IE6.0 이하는 윈도우XP 초기 버전에 탑재되었던 것으로 거의 사용되지도 않고, 찾아 설치하기도 힘듭니다.^^)

 

여차저차하여 위의 방법으로 해결하였습니다.

하지만, 역시나 걱정되는 것은 IE 12버전이 나오면 또 어떻게 튈지 모르겠다는 점이겠습니다.^^

IE 12가 출시되면 해당 브라우저의 agent값을 확인하여 대응해주면 될 것 같습니다.

 

 

참고로 현재 글로벌 인터넷 기업들 중에 IE 6.0을 지원하는 곳은 거의 없습니다. (하다 못해 IE 8.0 조차 지원하지 않는 곳도 많습니다.) IE 6.0은  출시 때부터 보안도 상당히 취약하고, 웹 표준도 거의 따르지 않아 개발자들만 고생시킨 악명 높은 브라우저입니다. MS가 웹 브라우저 시장을 독점하다 시피한 우리나라에서는 그 그지같던 IE 6.0 조차도 점유율이 상당히 높았던 때가 있었습니다. 그리고 여담으로 미국에서는 IE6.0 장례식 퍼포먼스까지 했던 것으로 알고 있습니다. ㅎㅎ