JavaScript는 navigator라는 객체를 제공하며, 이를 통해 브라우저에 대한 다양한 정보를 얻을 수 있습니다. navigator 객체에는 브라우저의 제품 이름과 코드 이름을 확인할 수 있는 navigator.product와 navigator.appCodeName 속성이 포함되어 있습니다. 지금부터 두 속성을 하나씩 자세히 살펴보겠습니다.
제품 이름(Product Name)
product 속성은 브라우저의 제품 이름을 반환합니다. 대부분의 브라우저에서 이 값은 호환성 유지를 위해 Gecko로 고정되어 있습니다. 실제 렌더링 엔진이 Gecko가 아닌 경우에도 동일한 값을 반환하므로, 브라우저 종류를 정확히 판별하는 용도로는 적합하지 않다는 점에 유의해야 합니다.
예제
<html>
<body>
<p id="proname"></p>
<script>
document.getElementById("proname").innerHTML =
"제품 이름은 " + navigator.product;
</script>
</body>
</html>실행 결과
제품 이름은 Gecko
코드 이름(Code Name)
appCodeName 속성은 브라우저의 내부 코드 이름을 반환합니다. 역사적인 호환성 문제로 인해 Chrome, Firefox, IE(Internet Explorer), Safari, Opera 등 거의 모든 주요 브라우저에서 이 값은 Mozilla로 통일되어 있습니다.
예제
<html>
<body>
<p id="coname"></p>
<script>
document.getElementById("coname").innerHTML =
"코드 이름은 " + navigator.appCodeName;
</script>
</body>
</html>실행 결과
코드 이름은 Mozilla
이처럼 navigator.product와 navigator.appCodeName은 과거 넷스케이프 시절의 호환성을 위해 남겨진 속성으로, 현재는 대부분 고정된 값을 반환합니다. 따라서 실무에서 브라우저를 구분할 때는 userAgent 문자열 분석이나 기능 감지(feature detection) 방식을 함께 활용하는 것이 좋습니다.