브라우저 체크를 할 때마다 매번 구글링을 해가며 커스텀해서 사용하곤 했었는데 정리를 한번 해두면 좋을 것 같아 포스팅을 남깁니다.
브라우저 체크의 핵심은 User-Agent입니다.
클라이언트에서 서버로 요청하는 HTTP 헤더에는 다양한 정보가 있는데 그 중, User-Agent 라고 하는 필드에는 요청에 기반한 사용자 브라우저 및 운영체제 정보를 포함하고 있습니다.
예제 소스는 다음과 같습니다. indexOf 메소드를 사용하여 각각의 브라우저를 구분할 수 있는 문자를 체크하여 그 결과를 리턴하는 구조입니다.
(* indexOf 메소드는 특정 문자열의 위치를 반환(첫 발견된 인덱스값)하는데 해당 문자가 없다면 -1을 반환합니다)
소스를 복사하여 테스트해보면 브라우저별로 어떤 정보가 담겨있는지 확인이 가능합니다.
@RequestMapping(value = "/login/test.do", method = RequestMethod.GET)
public String test(HttpServletRequest request, Locale locale, Model model) {
String browser = "";
String userAgent = request.getHeader("User-Agent");
if(userAgent.indexOf("Trident") > -1) { // IE
browser = "ie";
} else if(userAgent.indexOf("Edge") > -1) { // Edge
browser = "edge";
} else if(userAgent.indexOf("Whale") > -1) { // Naver Whale
browser = "whale";
} else if(userAgent.indexOf("Opera") > -1 || userAgent.indexOf("OPR") > -1) { // Opera
browser = "opera";
} else if(userAgent.indexOf("Firefox") > -1) { // Firefox
browser = "firefox";
} else if(userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Chrome") == -1 ) { // Safari
browser = "safari";
} else if(userAgent.indexOf("Chrome") > -1) { // Chrome
browser = "chrome";
}
logger.info("---------------------------------------------");
logger.info("User-Agent : " + userAgent);
logger.info("Browser : " + browser);
logger.info("---------------------------------------------");
return browser;
}
[IE]
[Chrome]
[Edge]
[Firefox]
IE10까지는 사실 MSIE라는 단어가 있었는데 IE11로 업데이트되면서 MSIE가 사라졌습니다. 그래서 IE를 체크할 땐 Trident를 이용해 체크해줍니다. IE 버전을 체크하고 싶다면 아래를 참고하여 소스에 추가하면 됩니다.
참고)
Trident/7.0 : IE11
Trident/6.0 : IE10
Trident/5.0 : IE9
Trident/4.0 : IE8