방문자의 브라우저 확인하기

최적의 페이지를 보여주기 위해서 방문자가 사용하고 있는 브라우저를 확인합니다.
방문자가 사용하고 있는 브라우저의 버젼, 그리고 JavaScript를 지원 하는지 여부를 확인하여 그것에 맞는 페이지를 제공합니다.

<HTML>
<HEAD>
<META HTTP-EQUIV="Refresh" CONTENT="1;URL=http://a.b.com/JSno.html">
<SCRIPT LANGUAGE="JavaScript"><!--
var clintAgent = navigator.userAgent;
var clintName = navigator.appName;

if ( clintName.indexOf("Netscape") != -1 ) {
	if ( clintAgent.indexOf("Mozilla/4") != -1 )
		self.location.href = "NN4.htm";
	else 
		self.location.href = "BelowNN3.htm";
}
else {
	if ( clintAgent.indexOf("MSIE 4") != -1 )
		self.location.href = "IE4.htm";
	else 
		self.location.href = "BelowIE3.htm";
}
//--></SCRIPT>
</HEAD>
<BODY>
안녕하세요.. 1초 후 방문자님의 브라우저에 알맞는 페이지로 갑니다.
</BODY>
</HTML>

꼭 이대로 사용할 필요는 없습니다. navigator 오브젝트가 지원하는 문자열 중에서 각 브라우저를 구별할 만한 문자열을 넣어주면 됩니다. 위의 것이 복잡하고 NN4, IE4, NN3이하 이렇게 3가지만 구분 하려면 간단합니다.

if ( document.layers ) self.location.href = "NN4.htm"
else if ( document.all ) self.location.href = "IE4.htm"
else self.location.href = "BelowNN3.htm"

3줄이면 됩니다.

위의 소스는 방문자의 Javascript의 버젼을 확인하여 버젼에 맞는 페이지를 가져 옵니다. 만약, Javascript를 꺼놓은 브라우저는 1초 후에 <META> tag에 지정된 페이지를 출력합니다(load).

위와 같이 모든 버젼별로 페이지를 만든다면 여러 페이지를 작성해야 합니다.
이것을 피하기 위해서는 Javascript를 중요한 부분에서의 사용을 피해야 합니다.
왜냐하면, Javascript를 브라우저에서 꺼놓은 사용자도 있기 때문입니다.

참고로, 아래는 <SCRIPT> 택 에서의 버젼별 분류입니다.

  NN2, IE3는 Javascript 1.0 지원
  NN3, IE3.02 Javascript 1.1 지원
  NN4, IE4는 Javascript 1.2 지원
  (버젼4에서는 두 브라우저 간에 호환이 안되는 Object가 있습니다.예:layer)

<SCRIPT LANGUAGE="JAVASCRIPT1.2"> Version 1.2 이상.
<SCRIPT LANGUAGE="JAVASCRIPT1.1"> Version 1.1 이상.
<SCRIPT LANGUAGE="JAVASCRIPT"> Version 1.0 이상.

NN3로는 JavaScript1.2 를 읽을 수 없습니다. NN4, IE4가 필요합니다.

브라우저별 Navigator 객체 구성요소 모음

아래는 IE5, NN4, IE4, NN3의 navigator Object의 구성요소 입니다. 전부 한글 windows95용입니다.

IE5 (한글판 기준)
----------------------------------------------
appCodeName = Mozilla
appMinorVersion = 0
appName = Microsoft Internet Explorer
appVersion = 4.0 (compatible; MSIE 5.0; Windows 95: DigExt)
cookieEnabled = true
cpuClass = x86
mimeTypes =
onLine = true
opsProfile =
platform = Win32
plugins =
systemLanguage = ko
userAgent = Mozilla/4.0 (compatible; MSIE 5.0; Windows 95; DigExt)
userLanguage = ko
userProfile =
-----------------------------------------------

NN4 (영문판 기준)
----------------------------------------------
userAgent = Mozilla/4.01 [en] (Win95; I)
appCodeName = Mozilla
appVersion = 4.01 [en] (Win95; I)
appName = Netscape
language = en
platform = Win32
plugins = [object PluginArray]
mimeTypes = [object MimeTypeArray]
----------------------------------------------

IE4 (한글판 기준)
----------------------------------------------
appCodeName = Mozilla
appMinorVersion = 0
appName = Microsoft Internet Explorer
appVersion = 4.0 (compatible; MSIE 4.0; Windows 95)
cookieEnabled = true
cpuClass = x86
mimeTypes =
onLine = true
opsProfile =
platform = Win32
plugins =
systemLanguage = ko
userAgent = Mozilla/4.0 (compatible; MSIE 4.0; Windows 95)
userLanguage = ko
userProfile =
-----------------------------------------------

NN3 gold (영문판 기준)
-----------------------------------------------
userAgent = Mozilla/3.01Gold (Win95; I)
appCodeName = Mozilla
appVersion = 3.01Gold (Win95; I)
appName = Netscape
plugins = [object PluginArray]
mimeTypes = [object MimeTypeArray]
-------------------------------------------------

NN4와 IE4인지 구별 하기

E4 = (document.all) ? true : false
위는 IE4이면 E4=true를 NN4이면 E4=false를 돌려 준다. 이것은 아래의 식으로도 표현할 수 있다.

N4 = (document.layers) ? true : false
NN4는 N4=true, IE4는 N4=false

if( !(document.layers||document.all) ) { DHTML을 지원하지 않는 브라우저 NN3, IE3.02이하}

128bit 암호화(encryption)가 가능한 브라우저 인지 확인하기. if( navigator.appName=="Netscape" ) { ver = navigator.appVersion if( ver.indexOf("U;")>0 || ver.indexOf("U)")>0 ) // USA: 128-bits encryption } else // else it's an "I"nternational version (export 40 bits)

ie4, ie5 구별하기

nn3, nn4, ie4를 구별하기는 쉽지만 ie5를 구별하기는 까다롭습니다. 각 브라우저의 버젼을 확인해야 하는데 appVersion이 ie4, ie5에서 비슷하게 아래로 나옵니다.

appVersion = 4.0 (compatible; MSIE 5.0; Windows 95; DigExt)

appVersion = 4.0 (compatible; MSIE 4.0; Windows 95; DigExt)

위의 구문은 위의 것이 ie5의 appVersion이고 아래의 것이 ie4의 것입니다. 맨앞의 버전정보가 둘다 4.0으로 나옵니다. 그래서 다른 정보를 가지고 있는 굵은 글자들을 확인해야 합니다.

이것을 하는 방법은 여러가지가 있겠지만 아래로 사용하면 가장 간단하지 않을까 생각합니다.

	var UA = navigator.appName
	var ver = navigator.appVersion
	
	if(UA.indexOf("Microsoft") != -1) {
		ver = parseInt(ver.split(";")[1].split(" ")[2])
	
		if(ver >= 5) alert("ie5를 사용합니다.")
		else if(ver >= 4) alert("ie4를 사용합니다.")
		else alert("ie3를 사용합니다.")
	}

운영체제 구분 하기

<HTML><HEAD><TITLE>OSnVR</TITLE><SCRIPT>
function OSnVR(){	 // # From JCS("jcSerre@Teaser.fr")

var v = navigator.appVersion.toLowerCase()
theOS = "?" ; theVR = ""

///////////////////// Windows

if( v.indexOf("win")>0 ){
theOS = "Windows"
if( v.indexOf("win95")>0||v.indexOf("windows 95")>0||v.indexOf("win32")>0 ){ 
	theVR=" 95"; return }
if( v.indexOf("win97")>0||v.indexOf("windows 97")>0 ){ theVR=" 97" ; return }
if( v.indexOf("win98")>0||v.indexOf("windows 98")>0 ){ theVR=" 98" ; return }
if( v.indexOf("windows 3.1")>0 ){ theVR=" 3.1" ; return }
if( v.indexOf("win16")>0 ){ theVR=" 3.x" ; return }
if( v.indexOf("windows 3")>0 ){ theVR=" 3" ; return }
if( v.indexOf("winnt")>0||v.indexOf("windows nt")>0 ){ theVR=" NT" ; return }
return
}

/////////////////// MacOS

if( v.indexOf("mac")>0 ){
theOS = "MacOS"
if( v.indexOf("ppc")>0||v.indexOf("powerpc")>0 ){ theVR=" PPC" ; return }
theVR = " 68K"
return
}

///////////////////// X11s

if( v.indexOf("X11")>0 ){
theOS = "X11"
if( v.indexOf("sunos")>0 ){ theVR=" SunOS" ; return }
if( v.indexOf("hp-ux")>0 ){ theVR=" HP-UX" ; return }
if( v.indexOf("linux")>0 ){ theVR=" Linux" ; return }
if( v.indexOf("osf")>0 ){ theVR=" OSF" ; return }
if( v.indexOf("irix")>0 ){ theVR=" Irix" ; return }
if( v.indexOf("aix")>0 ){ theVR=" AIX" ; return }
return
}

/////////////////// OS/2

if( v.indexOf("os/2")>0 ){ theOS="OS/2" ; return }

/////////////////// Craps

if( v.indexOf("webtv")>0 ){ theOS="Web" ; theVR="TV" ; return }
}

OSnVR()
document.write(theOS+theVR)

</SCRIPT></BODY></HTML>

T O P