[HTTP] User-Agent를 읽는 법

웹 개발을 하다보면 접속 환경과 관련된 이슈가 종종 발생합니다. 그럴 때는 로그에 남아 있는 클라이언트의 정보를 유용하게 활용할 수 있습니다.

사용자의 접속 환경 정보는 요청 헤더 Request header 의 User-Agent, UA가 가지고 있습니다.

UA는 클라이언트의 브라우저, 운영체제 종류에 따라 다른 웹 페이지를 보여주거나, 통계를 내는 등 다양한 용도로 활용할 수 있습니다.

브라우저를 열고 개발자 도구의 콘솔에서 navigator.userAgent 를 입력하면 다음과 같은 결과를 출력해 줍니다.

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36

현재 웹 시장을 장악하고 있는 크롬의 UA입니다.

그냥 Windows / Chrome 이렇게 딱 나오면 좋겠는데 모질라? 애플은 뭐고 사파리는 또 왜 뭐지? 대충은 알 수 있지만 따로 찾아보지 않는 이상 정확히 파악하기는 힘드실 겁니다. 

크게 세 부분으로 나눠서 좀 더 자세히 알아보도록 하겠습니다.

 

Mozilla/5.0 (Windows NT 10.0; Win64; x64)

 

이 부분을 이해하기 위해서는 브라우저의 역사를 잠깐 알아볼 필요가 있습니다.

옛날 옛적에 모자이크라는 브라우저가 있었습니다. 다른 브라우저와 구분을 위해 NCSA_Mosaic/2.0 이라는 식별자를 가지고 있었죠. 1년 후 넷스케이프가 등장하면서 모자이크를 끝내버렸는데 넷스케이프에서는 Mozilla/1.0 이라는 이름을 사용했습니다. Mozilla는 Mosaic + Godzilla의 합성어라고 합니다. Mosaic + killer 라는 설도 있습니다. 이후에 악명 높은 브라우저, 인터넷 익스플로러가 등장해 독과점으로 세계를 평정합니다. IE는 넷스케이프와 호환된다는 것을 내세워 넷스케이프를 없애버리기 위해 자신을 Mozilla/1.22 라고 했습니다. 그 이후로 웹 표준을 따르는 수많은 브라우저들이 탄생하면서  호환성을 보여주기 위해 Mozilla/5.0을 깃발처럼 꽂아넣었습니다.

이렇게 이것저것 넣다보니 UA는 점점 길어졌고 지금에 이르게 되었습니다.

서버에서 UA를 검색해서 다르게 처리할 수 있기 때문에 브라우저 입장에서는 귀찮다고 막 빼버릴 수도 없습니다. 

괄호 안에는 운영체제 정보가 나옵니다. 윈도우 10 64비트를 사용하고 있습니다.

 

AppleWebKit/537.36 (KHTML, like Gecko) 

 

렌더링 엔진은 HTML, CSS를 읽어 사용자가 볼 수 있게 문서를 만들어주는, 브라우저의 핵심이라고 할 수 있습니다.

AppleWebKit이 바로 렌더링 엔진의 하나인데, WebKit이 Gecko와 비슷한 KHTML을 기반으로 만들어졌다는 걸 꾸역꾸역 표시하고 있습니다.

 

Chrome/111.0.0.0 Safari/537.36

 

마지막으로 브라우저의 진짜 정체가 나오고 있죠. Chrome이긴 한데 Safari/537.36 랑도 잘 맞는다는 걸 굳이 알려주고 있습니다. 보통 슬래쉬 / 뒤에 나오는 숫자 또는 문자는 버전 정보입니다.

요즘 나오는 브라우저는 대부분 오픈 소스 프로젝트인 크로미움 기반이라 Chrome 이란 단어만 가지고 크롬과 아닌 것을 구별하기는 어렵습니다. 

 

실전

 

엣지

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36 Edg/112.0.1722.64

Edg 부분을 제외하면 크롬과 크게 다르지 않습니다.

 

웨일

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Whale/3.20.182.12 Safari/537.36

역시 비슷하지만 Whale이 있는 걸 보니 웨일입니다.

 

안드로이드

이번에는 조금 더 긴 예시를 보겠습니다.

Mozilla/5.0 (Linux; Android 10; SM-T500 Build/QP1A.190711.020; wv)

이 분은 갤럭시탭으로 접속을 하셨군요. 안드로이드 버전과 모델명까지 나옵니다.

AppleWebKit/537.36 (KHTML, like Gecko)

이 부분은 크롬과 같고

Version/4.0 Chrome/102.0.5005.189 Whale/1.0.0.0 Crosswalk/27.102.0.14 Safari/537.36

뭐가 굉장히 많죠? Crosswalk는 앱 개발을 할 때 사용했던 브라우저라고 합니다. 요즘에는 웹뷰를 많이 쓰죠. Whale이 있는 걸 보니 네이버의 냄새가 나네요. 가장 앞에 있는 Version/4.0은 안드로이드 앱에서 나타나는 것 같은데... 안드로이드 4.0을 의미하는 걸까요? 뭔지 아시는 분은 제보 부탁드립니다. 아무튼 여기서 건질 건 그렇게 많지 않은 것 같습니다.

NAVER(inapp; search; 1010; 11.21.8)

진짜 정체는 역시 마지막에 나오는군요. 네이버 앱 내에서 인앱 브라우저를 여셨네요. 저도 카톡 링크를 통해서 인터넷 접속을 하는 경우가 많은데 일부 기능이 정상적으로 동작하지 않는 경우가 종종 있더라구요.

최대한 많은 기기와 브라우저를 모두 지원하면 좋겠지만 이런 경우에는 가급적 일반적인 경로로 접속을 하게끔 유도하는 것도 방법이겠죠... 아직도 IE를 사용하는 분들은 좀 바꿔주세요 ㅠㅠ

여기까지 정독을 하셨다면 UA 별 거 없군, 마지막 부분만 확인하면 되겠네! 라는 생각이 드실 겁니다. 

하지만 정 귀찮으시다면 그냥 여기서 검색해보시면 될 것 같습니다...

https://whatmyuseragent.com/

UA를 카테고리별로 잘 정리해놨더라구요.