자바스크립트 navigator.useragent로 브라우저 정보를 확인하기.

자바스크립트 navigator.useragent로 브라우저 정보를 확인하기.

2014.06.29 10:13

퍼블리싱을 하거나 웹페이지를 개발하다 보면, 사용하는 브라우저의 환경에 따라 분기를 처리해주어야 할 때가 생긴다.

그럴 때 반드시 처리해 주어야 할 자바스크립트의 navigator.useragnet를 이용하면 브라우저의 정보를 확인할 수 있다.

다들 알고 있는 부분인데, 이렇게 확인된 useragent값을 어떻게 활용할 것인가가 부차적인 문제가 된다.

일단은 이번 포스팅에서는 userAgent를 문자열로 넘겨서 확인하는 것까지만 진행하도록 하겠다.

        var ua = navigator.userAgent;
        document.write(ua);

위의 표에서 보다시피 굉장히 간단하다. navigator.userAgent가 가장 핵심이다.

앞서도 지적했다시피 이 것을 어떻게 활용할 것인가가 관건인 문제이다. 

다행히 userAgent의 문자열에는 ";" 로 구분 지어져 있기 때문에 ;를 기준으로 split을 해서 배열로 넘겨서 확인과 판별에 활용할 수 있다.

IE11에서의 userAgent값은 다음과 같다.

Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; InfoPath.3; rv:11.0) like Gecko 

크롬 브라우저에서의 유저 에이전트 값은 다음과 같다.

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/36.0.1985.143 Safari/537.36

스마트폰인 옵티머스 Gpro의 유저 에이전트 값은 다음과 같다.

Mozilla/5.0 (Linux; Android 4.4.2; LG-F240S Build/KOT49I.F240S20e) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/36.0.1985.131 Mobile Safari/537.36

옵티먼스 G3의 userAgent값은 다음과 같다.

Mozilla/5.0 (Linux; U; Android 4.4.2; ko-kr; LG-F350L Build/KOT49I.F350L10o) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/30.0.1599.103 Mobile Safari/537.36

한 가지 재밌는 점은 이제 브라우저의 표준은 거의 모질라로 확실히 기운 듯하다. 마이크로소프트의 IE마저 11부터는 Geko를 사용해서 Mozilla/5.0 로 뜬다.

IE11의 버전 판별은 Trident/7.0을 기준으로 판별해 낼 수 있다.

오늘의 안구정화는 일반인 각선미 사진이네요~ ^^;