Frontend

javascript 에서 웹브라우저 확인하는 방법

고수트 2021. 4. 28. 15:10
반응형

javascript로 익스플로어 IE 인지 크롬 Chrome 인지 확인하는 법

javascript 로 작업을 하다보면 IE 와 관련하여 CSS 를 반영하는 것이 어려워 

IE 를 막을 떄가 있다.

그럴 떄에 코드에 IE 인지 Chrome 인지 체크하는 로직이 필요한데 아래와 같이 간단하게 

navigator 를 이용하면 된다.

먼저 크롬인 경우에는 아래와 같이 userAgent 로 판별 가능하다.

if (navigator.userAgent.toLowerCase().indexOf("chrome") != -1) {
	// 크롬
}

 

익스플로어 역시 IE 10 버전 까지는 위와 같은 방법으로 가능하지만

IE 11 버전에서는 또 이름을 Netscape 라고 이상하게 바꿔버려 아래와 같이 IE 의 레이아웃 엔진이름을

체크하는 로직을 추가하여야 한다.

  const agent = navigator.userAgent.toLowerCase()
  
  // IE 인지 확인
  if ((navigator.appName === 'Netscape' && agent.search('trident') !== -1) || (agent.indexOf('msie') !== -1)) {
    console.log('ie')
  }

 

반응형