Get your free and exclusive +45-page Authentication Analytics Whitepaper
개요로 돌아가기

Chrome, Safari 및 Firefox의 Client Hints와 User-Agent

Chrome, Safari 및 Firefox에서 User-Agent 축소 및 Client Hints API 지원 현황과 JavaScript 컴포넌트에서 패스키 및 기기 탐지를 위해 이를 활용하는 방법을 알아보세요.

Vincent Delitz
Vincent Delitz

작성일: 2024년 7월 2일

업데이트: 2026년 7월 27일

Chrome, Safari 및 Firefox의 Client Hints와 User-Agent

이 페이지는 자동 번역되었습니다. 영어 원문은 여기.

PasskeysCheatsheet Icon

Passkeys 치트시트. passkey 프로그램을 위한 실무 가이드, 도입 패턴, KPI.

치트시트 받기
핵심 정보
  • User-Agent 축소는 주요 브라우저 전반에서 완료되었습니다. Chrome과 Edge는 2023년부터, Firefox는 부분적으로 축소되었으며, Safari는 2025년 9월 출시된 iOS 26부터 고정되었습니다.
  • Firefox는 Client Hints나 navigator.userAgentData를 지원하지 않으므로, 개발자는 Mozilla 브라우저에서 기존의 User-Agent 문자열 파싱으로 폴백해야 합니다.
  • getHighEntropyValues() JavaScript API는 Chromium 브라우저에서만 높은 엔트로피 기기 데이터에 접근할 수 있습니다. Safari와 Firefox에는 이 API가 전혀 없습니다.
  • User-Agent 문자열만으로는 Windows 10과 Windows 11을 구별할 수 없습니다. 실제 플랫폼 버전을 확인하려면 Chrome 및 Edge에서 Client Hints를 사용해야만 합니다.
  • Corbado는 새로운 기기를 탐지하고 교차 기기 인증(cross-device authentication) 자격을 평가하는 등 **패스키 인텔리전스(passkey intelligence)**에 Client Hints를 활용하며, 특히 Windows 버전을 구별하는 데 사용합니다.

1. 소개: Client Hints 및 User-Agent 축소란 무엇인가요?#

다양한 사용자 환경을 탐지하고 이에 대응하는 방법은 끊임없이 변화하고 있습니다. 전통적으로 User-Agent 문자열은 브라우저 및 기기 정보를 식별하는 수단으로 사용되어 웹사이트가 이에 맞춰 사용자 경험을 최적화할 수 있도록 했습니다. 하지만 이러한 문자열은 종종 마케팅 목적으로 사용자의 동의 없이 사용자를 식별하고 핑거프린팅(fingerprinting)하는 데 사용되어 개인정보 보호 우려를 낳았습니다.

이러한 맥락에서 JavaScript API 형태의 Client Hints가 도구로 부상하여 사용자의 기기 및 설정에 관한 필수 정보를 보다 통제되고 개인정보를 존중하는 방식으로 공유할 수 있게 되었습니다. 이 문서에서는 User-Agent 축소가 미치는 결과에 집중하고, 이러한 새로운 상황에 적응하는 데 Client Hints가 어떻게 도움이 되는지 살펴봅니다.

우리가 다룰 핵심 사항:

  • User-Agent 축소란: User-Agent 문자열을 줄이는 방향으로의 변화와 그 영향을 이해합니다.
  • Client Hints 작동 방식: Client Hints의 기본 메커니즘과 효과적으로 구현하는 방법을 살펴봅니다.

브라우저와 운영 체제가 저마다 다른 입장을 취하고 대응 방식을 다르게 적용함에 따라, 소프트웨어 개발자는 브라우저와 운영 체제 전반에서 애플리케이션이 여전히 다양한 사용자 환경을 정확하게 탐지하고 대응할 수 있도록 해야 하는 과제에 직면해 있습니다.

이 문서는 이러한 변화에 대한 포괄적인 개요를 제공하여, 기기 또는 운영 체제 세부 정보(예: 상세 기기 관리, 알려진 기기 탐지, 사기 방지 또는 기타 기능 탐지)에 의존하는 사용 사례나 소프트웨어를 다루거나, Corbado처럼 User-Agent 및 Client Hints로 패스키 경험을 최적화해야 하는 개발자에게 통찰력과 실용적인 지침을 제공하는 것을 목표로 합니다.

Client Hints에 대한 기술적인 세부 사항을 살펴보기 전에 User-Agent의 역사와 다양한 User-Agent 축소 노력이 어떻게 진행되는지 간단히 살펴보겠습니다.

1.1 User-Agent의 간략한 역사#

User-Agent 문자열의 역사는 초기 웹 브라우저의 시작과 함께합니다. 팀 버너스리(Tim Berners-Lee)는 1990년에 최초의 웹 브라우저인 WorldWideWeb(나중에 Nexus로 이름 변경됨)을 개발했습니다. 곧이어 1991년에 Line Mode Browser와 같은 선구적인 브라우저가 등장했으며, 이후 MidasWWW, ViolaWWW, Erwise, Cello와 같은 브라우저가 나타났습니다.

1993년에 출시된 NCSA Mosaic(흔히 Mosaic이라 불림)은 초기 웹의 인기를 폭발시킨 주역으로 꼽힙니다. Mosaic의 User-Agent 문자열은 매우 단순하여, 일반적으로 제품명 뒤에 선택적인 슬래시와 버전 번호를 포함한 NCSA_Mosaic/1.0 형식으로 구성되었습니다.

초기에 User-Agent 필드는 분석 목적과 문제 식별을 돕기 위해 도입되었습니다. 1992년 W3C HTTP 아카이브에 기록된 바와 같이, 이 필드는 HTTP 요청에 "포함되어야 한다"고 명시적으로 권장되었습니다. 이 간단한 필드는 제품명과 버전을 전달하는 단순하면서도 효과적인 방법을 제공하여 브라우저 관련 문제를 이해하고 해결하는 데 도움을 주었습니다.

웹이 발전함에 따라 User-Agent 문자열의 복잡성과 사용도 증가했습니다. 문자열은 더 자세해졌고 브라우저, 운영 체제 및 기기에 대한 풍부한 정보를 포함하기 시작했습니다. 이 정보는 웹 분석 및 사용자 경험 최적화에 가치가 있었지만, 동시에 중대한 개인정보 보호 우려를 낳았습니다. 상세한 User-Agent 문자열은 기기 핑거프린팅을 가능하게 하여, 광고주와 추적자가 사용자의 고유한 프로필을 생성하고 여러 웹사이트에 걸쳐 온라인 활동을 추적할 수 있도록 했습니다.

사용자와 규제 기관 모두에게 개인정보 보호가 중요한 관심사가 된 현대에는, User-Agent 문자열의 상세한 특성이 점점 더 문제로 인식되었습니다. 이러한 인식은 웹 기능에 필요한 정보를 제공하는 것과 사용자 개인정보를 보호하는 것 사이에서 균형을 맞추기 위해 User-Agent 문자열의 세분성을 줄이려는 노력으로 이어졌습니다. 이 전환은 개인정보 보호 위험을 완화하고 보안을 강화하기 위해 User-Agent 문자열에 공유되는 정보를 최소화하려는 움직임인 User-Agent 축소의 시작을 의미합니다.

1.2 User-Agent 축소 및 Client Hints 소개#

User-Agent 축소를 향한 움직임은 커지는 개인정보 보호 우려에 대한 대응으로 시작되었습니다. 다음은 이러한 발전 과정의 주요 이정표를 시간순으로 정리한 것입니다.

1.2.1 Safari의 User-Agent#

2017년, Apple은 Safari Technology Preview 46(STP 46)에서 User-Agent 문자열을 고정하여 핑거프린팅에 맞서고 개인정보 보호를 개선하겠다는 유명한 트위터 게시물과 함께 User-Agent 축소 움직임을 주도했습니다.

하지만 최신 User-Agent 정보에 의존하는 웹사이트와의 심각한 호환성 문제로 인해 2021년에 이 결정은 부분적으로 철회되었습니다.

1.2.2 Chrome (+ Edge)의 User-Agent#

2019/2020년, Google은 Chrome에서 User-Agent 문자열의 세분성을 줄이려는 계획을 발표하며, 특정 브라우저 및 기기 정보를 유연하고 통제된 방식으로 요청할 수 있는 User-Agent Client Hints(UA-CH)를 도입했습니다. Google은 호환성과 기능을 확인하기 위해 Chrome Canary 및 Beta 버전에서 User-Agent 축소 테스트를 시작했으며, Android 및 기타 모든 Chrome 플랫폼에서 2023년에 이를 완료했습니다. 동시에 Chrome은 해당 정보에 접근할 수 있는 새로운 방식인 Client Hints를 도입했습니다. Microsoft Edge는 Chromium 기반이므로 모든 플랫폼에서 Chrome과 동일하게 동작합니다.

1.2.3 Firefox의 User-Agent#

2021년에 Mozilla도 이 노력에 동참하여 User-Agent 문자열의 세분성을 점진적으로 줄이기 시작했지만, Firefox에서 Client Hints를 지원하지 않기로 결정했습니다.

1.2.4 현재의 User-Agent (2025년 9월 업데이트)#

  • User-Agent 축소는 브라우저별로 다름: Chromium(Chrome, Edge)은 Client Hints 지원과 함께 완전한 UA 축소를 구현했습니다. 그러나 Safari는 UA-CH를 채택하지 않고 자체적인 고정 UA 방식을 사용하며, Firefox는 navigator.userAgentData를 구현하지 않았습니다. 생태계는 여전히 파편화되어 있습니다.

  • Chromium 내부에서 진화한 Client Hints: 모든 브라우저는 여전히 User-Agent 헤더를 전송하지만, 대부분의 브라우저에서는 이전 버전으로 고정되어 있습니다(아래 표 참고). Chromium의 경우, 더 많은 정보를 얻기 위해 Client Hints를 사용할 수 있습니다.

다음 장에서는 현재 브라우저가 전송하는 User-Agent가 어떻게 되는지 살펴보겠습니다.

Substack Icon

최신 뉴스를 위해 Passkeys Substack을 구독하세요.

구독하기

2. User-Agent 축소란 무엇인가요?#

User-Agent 축소를 이야기할 때 이는 User-Agent 문자열 내의 정보를 줄이는 것을 의미합니다. 축소 이전의 User-Agent에는 무엇이 포함되어 있었는지 더 깊이 알아보겠습니다.

2.1 기존 User-Agent란?#

기존 User-Agent 문자열에는 기능을 탐지하는 데 사용할 수 있는 다음과 같은 구성 요소가 일반적으로 포함되어 있었습니다.

Mozilla/5.0 (Linux; Android 13; Pixel 7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.2.1.0 Mobile Safari/537.36

  • 운영 체제: 운영 체제의 이름 (예: Windows, macOS, Linux).
  • 운영 체제 버전 번호: 운영 체제의 특정 버전.
  • 브라우저 이름: 브라우저 이름 (예: Chrome, Firefox, Safari).
  • 브라우저 버전: 브라우저의 특정 버전.
  • 아키텍처: 시스템 아키텍처 (예: x86, ARM).
  • 기기 유형/모델: 기기 유형 또는 모델에 대한 정보 (예: iPhone, Pixel).
  • 기타 정보: 플랫폼, 빌드 번호 등 추가적인 세부 정보가 포함될 수 있습니다.

2.1.1 기능 탐지에 User-Agent를 사용한 이유는 무엇인가요?#

역사적으로 User-Agent 문자열은 기능 및 플랫폼 탐지에 자주 사용되어 웹사이트가 탐지된 브라우저 및 기기 특성에 따라 콘텐츠와 기능을 조정할 수 있게 했습니다(예: 특정 바이너리용 다운로드 제공 결정). 이는 특히 모바일 폰과 태블릿의 부상과 함께 반응형으로 구축되지 않은 레이아웃이 모바일 폰을 모바일 전용 버전으로 리디렉션해야 할 때 중요해졌습니다.

그러나 이 접근 방식은 이제 브라우저 기능에 대한 가정에 의존하며 이 가정이 항상 옳지는 않거나 충분히 구체적이지 않을 수 있으므로 최적이 아닌 것으로 간주됩니다. 현대의 웹 개발 관행은 가능한 한 브라우저 API를 통한 기능 탐지를 사용하여 특정 브라우저 기능과 역량을 직접 확인할 것을 권장합니다. 이 방법이 더 안정적이며 User-Agent 문자열이나 브라우저 버전에 관계없이 웹사이트가 올바르게 작동하도록 보장합니다. 기능 탐지는 브라우저의 실제 기능에 초점을 맞추어 브라우저 동작 및 기능의 차이를 처리하는 더 강력하고 미래 지향적인 방법을 제공합니다.

기능을 탐지하는 새로운 브라우저 API가 각기 다른 시기에 구현되고 주요 브라우저(예: Chromium 기반 브라우저)와 소규모 브라우저 팀(예: Firefox) 간에 접근 방식이 다른 경우가 많아, 오늘날까지도 이것이 완전히 가능하지는 않습니다.

2.1.2 핑거프린팅의 엔트로피 이해: 많은 정보를 제공하는 것이 왜 문제일까요?#

더 많은 정보는 웹사이트에 더 많은 "엔트로피"를 사용하여 핑거프린트를 생성할 수 있는 폭넓은 가능성을 제공합니다. 이 맥락에서 엔트로피는 웹사이트의 다양한 방문자 사이에서 고유한 핑거프린트를 생성하는 데 사용할 수 있는 변형의 양을 의미합니다.

핑거프린트는 다양한 목적으로 사용될 수 있습니다. 새로운 기기를 식별하여 사기를 탐지하고 계정 탈취를 막는 것과 같은 보호 목적으로 사용할 수도 있지만, 사용자의 동의 없이 방문자를 식별하거나 더 구체적인 광고 타겟팅을 하는 데 사용될 수도 있습니다.

User-Agent 문자열 맥락에서 엔트로피는 개별 사용자를 추적하고 구별하는 데 사용할 수 있는 고유하고 식별 가능한 정보의 양을 나타냅니다.

  • 높은 엔트로피 정보: 특정 브라우저 및 OS 버전 등은 사용자 핑거프린트의 고유성에 크게 기여하여 여러 웹사이트에서 사용자를 쉽게 추적할 수 있게 합니다.
  • 낮은 엔트로피 정보: 일반적인 브라우저 이름이나 운영 체제 이름은 제공하는 데이터의 세부 수준이 낮으며 이 조합을 공유하는 사용자가 많아 사용자 추적에 대한 기여도가 적습니다.

User-Agent 이외에도 엔트로피의 원천으로 활용할 수 있는 다양한 정보가 있습니다. 예를 들어, https://coveryourtracks.eff.org에서 여러 형태의 엔트로피 출처를 확인할 수 있습니다.

2.2 User-Agent 엔트로피 감소#

따라서 브라우저가 User-Agent 축소에 관해 이야기할 때, 이들의 주요 목표는 높은 엔트로피 정보를 줄이는 것입니다. 다음은 축소의 다양한 예시입니다.

2.2.1 예시 1: Chrome User-Agent 축소#

다음은 Android 휴대전화에 적용된 Google의 Chrome User-Agent 축소 예시입니다.

이전: Mozilla/5.0 (Linux; Android <span style={{color: '#016F01' }}>13; Pixel 7</span>) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.0.0 Mobile Safari/537.36

이후: Mozilla/5.0 (Linux; Android <span style={{color: '#016F01' }}>10; K</span>) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.0.0 Mobile Safari/537.36

User-Agent의 형식은 라이브러리의 기존 파싱 로직을 방해하지 않기 위해 그대로 유지되었습니다. 다음 값들이 축소되었습니다.

  • 운영 체제 버전
  • 브라우저 마이너 버전
  • 하드웨어 모델

그래픽은 운영 체제에 따라 어떤 값이 계속 업데이트되는지 보여주며, 녹색 값은 모든 플랫폼에서 일정하게 유지되는 값을 나타냅니다. 다양한 운영 체제 값에 대해서는 일정하게 유지되는 변형만 제공됩니다.

운영 체제축소/고정된 이름
MacMacintosh; Intel Mac OS X 10_15_7
WindowsWindows NT 10.0; Win64; x64
ChromeOSX11; CrOS x86_64 14541.0.0
LinuxX11; Linux x86_64
AndroidLinux; Android 10; K
iOS축소됨 (iOS 26+)

2.2.2 예시 2: Firefox User-Agent 축소#

다음은 User-Agent 축소에 대한 Google의 입장 대부분을 따르는 Mozilla Firefox의 User-Agent 축소 예시입니다.

현재 Firefox 버전을 사용하는 Windows 11 기기의 User-Agent 예시입니다.

Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:127.0) Gecko/20100101 Firefox/127.0

이 User-Agent에서는 CPU 아키텍처, 운영 체제 버전, 브라우저 마이너 버전이 고정되었습니다.

2.2.3 예시 3: macOS에서의 Safari User-Agent 축소#

다음은 macOS에서의 Safari User-Agent 축소 예시입니다.

먼저, Mac Silicon M2에서 실행되는 macOS Sonoma 버전 14.5의 Safari User-Agent부터 살펴보겠습니다.

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.5 Safari/605.1.15

macOS 버전이 10_15_07로 상한이 정해져 있으며, 아키텍처 역시 Intel로 고정되어 Mac CPU 아키텍처를 보고하지 않는 것을 볼 수 있습니다. 이는 macOS의 Firefox 및 Chrome에도 동일하게 적용됩니다.

2.2.4 예시 4: iOS에서의 Safari User-Agent (iOS 26+부터 축소됨)#

iOS 26(2025년 9월 출시) 이전에는 iOS용 Safari가 실제 운영 체제 버전을 노출했습니다. 그러나 Apple은 이제 Safari 26에서 iOS/iPadOS User-Agent를 macOS와 동일하게 고정했습니다. 아래 예시는 iOS 26 이전의 User-Agent를 보여줍니다.

Mozilla/5.0 (iPhone; CPU iPhone OS 17_5_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.5 Mobile/15E148 Safari/604.1

참고: iOS 26부터 모든 iOS 브라우저(Chrome, Firefox, Safari)는 macOS와 유사하게 고정된 User-Agent 문자열을 갖습니다. 아래 예시는 iOS 26 이전의 동작을 보여줍니다.

Mozilla/5.0 (iPhone; CPU iPhone OS 17_5 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/126.0.6478.153 Mobile/15E148 Safari/604.1

Mozilla/5.0 (iPhone; CPU iPhone OS 17_5_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) FxiOS/127.1 Mobile/15E148 Safari/605.1.15

2.3 User-Agent 축소에 따른 탐지 한계#

전반적으로 볼 때 User-Agent는 분명하게 높은 엔트로피 정보에 한해 축소되었습니다. 다음 개요는 어떤 플랫폼 / 운영 체제 조합에서 User-Agent가 축소되는지를 보여줍니다.

브라우저WindowsMacOSiOSAndroid
Chrome축소됨축소됨축소됨 (iOS 26+)축소됨
Edge축소됨축소됨축소됨 (iOS 26+)축소됨
Firefox축소됨축소됨축소됨 (iOS 26+)축소됨
Safari-축소됨*축소됨 (Safari 26+)**-
Samsung Internet---축소됨
WebViews--축소됨 (iOS 26+)축소 안 됨 (≥ 16: 축소됨)

따라서 축소된 User-Agent와 관련한 가장 중요한 탐지 문제는 다음과 같습니다 (* = macOS 버전에 대한 아래 참고 사항 확인).

  • Windows 10과 Windows 11을 구별할 수 없음: 더 이상 User-Agent를 기반으로 Windows 10과 Windows 11 시스템을 구별할 수 없습니다.
  • Android 기기 및 운영 체제 버전을 구별할 수 없음: Apple과 달리, Android는 실제 하드웨어 모델을 User-Agent에 포함했었습니다. 이제는 그렇지 않습니다. 따라서 User-Agent만으로는 다른 하드웨어 모델을 구별할 수 없습니다. 이는 Apple 기기에서는 한 번도 가능했던 적이 없습니다.
  • macOS 버전 및 아키텍처를 구별할 수 없음: User-Agent를 바탕으로 macOS 버전과 플랫폼 아키텍처를 구별할 방법이 없습니다.
  • (*) Safari의 macOS 버전: Safari는 운영 체제 버전을 고정했지만 Safari 버전은 계속 표시합니다. 이 글 작성 시점 기준으로 10.15 이상에서는 Safari 버전에서 3을 빼서 주요 macOS 버전을 탐지하는 것이 안전합니다.
  • (**) Safari 26+의 iOS 버전: 2025년 9월 iOS 26부터 Apple은 iOS/iPadOS User-Agent를 macOS와 유사하게 고정했습니다. OS 버전은 더 이상 노출되지 않습니다.

다음은 macOS 버전을 해당 Safari 버전과 매핑한 표입니다.

macOS 버전Safari 버전출시 연도
macOS Sequoia (15)Safari 182024
macOS Sonoma (14)Safari 172023
macOS Ventura (13)Safari 162022
macOS Monterey (12)Safari 152021
macOS Big Sur (11)Safari 142020
macOS Catalina (10.15)Safari 132019

TLS 핑거프린팅과 같이 정교한 핑거프린팅 기술을 통해 운영 체제와 브라우저를 탐지하는 다른 방법들이 있습니다. 더 깊은 수준의 운영 체제 탐지가 의미 있는 합법적인 시나리오가 있기 때문에, Google은 이 정보를 프로그래밍 방식으로 수신할 수 있도록 Client Hints를 도입했습니다. 다음 장에서는 Client Hints가 어떻게 작동하는지 알아보겠습니다.

3. Client Hints는 어떻게 작동하나요?#

Client Hints는 프라이버시 친화적인 방식으로 User-Agent 문자열에서 제거된 높은 엔트로피 정보에 웹사이트가 접근할 수 있게 해줍니다. Client Hints에 접근하는 두 가지 주요 방법이 있습니다.

  • HTTP 헤더: HTTP 요청 헤더를 사용하며, 퍼스트 파티(first-party) 컨텍스트에서만 사용할 수 있습니다.
  • JavaScript API: 임베디드 스크립트에서 사용할 수 있는 JavaScript API를 사용합니다.

Client Hints는 User-Agent에 이미 포함된 낮은 엔트로피 정보를 가져오는 데 사용할 수도 있습니다. 이는 Client Hints가 지원되는 Chrome의 경우 User-Agent가 더 이상 필요하지 않음을 의미합니다.

3.1 어떤 Client Hints가 존재하나요?#

어떤 접근 방식을 사용하느냐에 따라 Client Hints의 명칭이 약간 다릅니다. 가장 중요한 Client Hints 이름을 나열해 보았습니다.

HTTP UA-CH 토큰UA-CH JS API엔트로피
Sec-CH-UA-Platform-VersionUADataValues.platformVersion높음
Sec-CH-UA-MobileNavigatorUAData.mobile낮음
Sec-CH-UA-ModelUADataValues.model높음
Sec-CH-UANavigatorUAData.brands낮음
Sec-CH-UA-ArchUADataValues.architecture높음

3.2 HTTP 요청 헤더를 통해 Client Hints에 접근하는 방법#

퍼스트 파티 컨텍스트에서 웹사이트는 HTTP 요청 헤더를 사용하여 사용자의 브라우저 및 기기에 대한 특정 정보를 요청할 수 있습니다. 이 접근 방식은 서버가 관심 있는 Client Hints가 무엇인지 서버의 HTTP 응답에 올바른 헤더를 설정하는 것을 포함합니다. 그러면 브라우저는 동일한 출처로의 후속 요청에 이 힌트를 포함합니다.

이 헤더는 향후 요청 시 브라우저가 상세한 사용자 정보를 전송하도록 신호를 보내며, 이를 통해 서버는 응답을 그에 맞게 조정할 수 있습니다. 이 방법을 사용하면 상세한 사용자 정보가 퍼스트 파티 웹사이트에서만 접근 가능하도록 보장하여 서드 파티 리소스가 높은 엔트로피 데이터를 얻는 것을 방지합니다. 사용 가능한 요청 헤더는 두 가지 유형이 있으며, 이에 대해 논의해 보겠습니다.

  • 일반 Client Hint 헤더 (Regular Client Hint Headers)
  • 주요 Client Hint 헤더 (Critical Hint Headers)

3.2.1 일반 Client Hint 헤더 사용 방법#

일반 Client Hints는 서버가 사용자 환경에 대한 정보를 수집하기 위해 브라우저에 후속 요청 시 요청할 수 있는 헤더입니다.

예시: corbado.com에서 macOS 14.5 및 일반 Client Hints가 있는 Chrome

  1. corbado.com에 대한 첫 번째 요청에서, 이 정보는 User-Agent에도 포함되어 있으므로 Chrome은 이미 다음과 같은 낮은 엔트로피 헤더를 포함합니다.
헤더
Sec-Ch-Ua"Google Chrome";v="125", "Chromium";v="125", "Not.A/Brand";v="24"
Sec-Ch-Ua-Mobile?0
Sec-Ch-Ua-Platform"macOS"
  1. corbado.com이 후속 요청에서 운영 체제 버전(플랫폼 버전)을 받으려고 한다고 가정해 보겠습니다. 이를 위해 첫 번째 요청에 대한 응답으로 적절한 “Sec-CH-UA-Platform-Version” 헤더를 설정합니다.
헤더
Accept-CHSec-CH-UA-Platform-Version
  1. 후속 요청 시, corbado.com은 플랫폼 버전이 포함된 추가 헤더를 받게 됩니다.
헤더
Sec-Ch-Ua"Google Chrome";v="125", "Chromium";v="125", "Not.A/Brand";v="24"
Sec-Ch-Ua-Mobile?0
Sec-Ch-Ua-Platform"macOS"
Sec-Ch-Ua-Platform"14.5.0"

동시에 이 요청의 User-Agent는 (플랫폼 버전 없이) 그대로 유지됩니다.

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/125.0.0.0 Safari/537.36

https://user-agent-client-hints.glitch.me/headers를 사용하면 일반 힌트에 대해 다양한 정보 레이아웃이 어떻게 보이는지 실제로 시도해 볼 수 있습니다 (Chrome을 사용해야 함). 자세한 내용은 여기를 참조하세요. corbado.com이 첫 번째 페이지 요청 시 즉각 이 정보를 필요로 한다면 일반 Client Hints 사용으로는 부족하겠지만, 주요(critical) Client Hints를 통해 이 과정을 앞당기는 방법이 있습니다.

3.2.2 Critical (Client) Hint 헤더 사용 방법#

corbado.com이 정확한 macOS 버전에 맞춘 다운로드 페이지를 렌더링하기 위해 첫 번째 요청 시 플랫폼 버전이 필요하다고 가정해 보겠습니다. 이 경우 헤더를 포함한 페이지만 렌더링하도록 즉각적인 요청 재시도를 유도하는 Critical (client) hints를 사용할 수 있습니다.

예시: corbado.com에서 macOS 14.5 및 critical Client Hints가 있는 Chrome

  1. corbado.com에 대한 첫 번째 요청에서, Chrome은 User-Agent에 포함되어 있는 다음의 낮은 엔트로피 헤더를 이미 포함합니다.
헤더
Sec-CH-UA"Google Chrome";v="125", "Chromium";v="125", "Not_A/Brand";v="24"
Sec-CH-UA-Mobile?0
Sec-CH-UA-Platform"macOS"
  1. corbado.com이 첫 페이지 렌더링 시 운영 체제 버전(플랫폼 버전)을 받으려고 한다고 가정해 보겠습니다. 이 경우 첫 번째 요청에 대한 응답으로 critical client hint 헤더인 “Sec-CH-UA-Platform-Version”을 설정합니다.
헤더
Accept-CHSec-CH-UA-Platform-Version
  1. Chrome은 렌더링을 시작하지 않고 즉시 요청을 다시 시도하여, corbado.com의 첫 렌더링 시 헤더를 사용할 수 있게 합니다. 그런 다음 플랫폼 버전이 포함된 추가 헤더를 받게 됩니다.
헤더
Sec-CH-UA"Google Chrome";v="125", "Chromium";v="125", "Not_A/Brand";v="24"
Sec-CH-UA-Mobile?0
Sec-CH-UA-Platform"macOS"
Sec-CH-UA-Platform-Version"14.5.0"

다음 차트에서는 웹사이트가 Critical-CH 헤더를 사용해 중요 부분으로서 기기 모델을 요청하는 또 다른 예시를 보여줍니다. 차트에서 볼 수 있듯이, 클라이언트는 위 예시(왼쪽 시퀀스 차트)처럼 요청을 다시 시도합니다.

Chromium의 Client hints: https://developers.google.com/privacy-sandbox/protections/User-Agent

따라서 critical Client Hints를 사용하면 브라우저가 왕복 시간을 추가하여 두 번째 요청을 즉시 시작해야 하므로 지연 시간(latency)이 발생합니다. 세부 정보를 이미 전송하도록 TLS 핸드셰이크(차트 상단의 녹색 상자)를 촉진하여 전송을 최적화하는 방법이 있습니다. **ALPN(Application-Layer Protocol Negotiation)**을 활용하는 이 접근 방식은 여기에서 자세히 살펴볼 수 있지만, 이 문서의 범위를 벗어납니다.

헤더를 통해 추가 정보를 받으려면 백엔드 또는 웹 서버 / 로드 밸런서에 구성을 추가해야 합니다. 회사로서 웹사이트에 대한 완전한 통제권이 있는 퍼스트 파티 컨텍스트에서는 쉽게 수행할 수 있습니다. 예를 들어, corbado.com의 UI 컴포넌트는 패스키 인텔리전스의 정밀도를 높이기 위해 플랫폼 버전이 필요합니다. 개발자들이 여러 페이지에 컴포넌트를 통합할 때, 그들에게 헤더를 추가하고 그 정보를 컴포넌트로 전달하라고 요구하는 것은 달갑지 않은 오버헤드가 될 것입니다. SPA 및 기타 임베디드 JavaScript 애플리케이션의 경우 다음 섹션에서 설명할 다른 인터페이스를 사용할 수 있습니다.

3.3 JavaScript API(임베디드 스크립트)를 통해 Client hints에 접근하는 방법#

navigator.userAgentData.getHighEntropyValues() 함수를 사용하면 JavaScript API를 통해 Client hints에 유연하고 동적인 방식으로 접근할 수 있어 사용자의 브라우저 및 기기에 대한 특정 정보를 요청할 수 있습니다. 이 방법은 웹 페이지의 스크립트 내에서 navigator.userAgentData 객체를 사용하여 Client Hints를 쿼리하는 과정을 포함합니다. 이 방법은 Client Hint 헤더를 설정할 필요가 없지만, navigator.userAgentData를 지원하는 브라우저(Chrome 및 Edge와 같은 Chromium 기반 브라우저)에서만 작동합니다. Firefox와 Safari는 이 API를 지원하지 않으므로 개발자는 기능을 탐지하고 폴백을 제공해야 합니다.

예를 들어, macOS의 Chrome 콘솔에서 이 코드를 실행하면 다음과 같습니다.

if (navigator.userAgentData) { navigator.userAgentData .getHighEntropyValues(["architecture", "model", "platformVersion"]) .then((ua) => { console.log(ua); }); }

프로미스가 해결(resolve)되면 관련 정보가 반환됩니다. 위에서 간략히 설명한 것처럼 이름이 헤더와 완전히 동일하지는 않지만 매우 유사합니다.

그러면 platformVersion이 프로미스에서 반환되며 임베디드 JavaScript 코드에서 직접 접근할 수 있습니다. 이 함수에 대한 커버리지는 실제 User-Agent 축소 비율보다 훨씬 낮습니다.

또한 Apple의 제한으로 인해 iOS에서 WebKit을 배포해야 하므로, Chrome은 iOS에서 이 기능을 제공하지 않습니다.

지금까지 User-Agent 축소에 대한 가장 중요한 사실과 Client hints가 Chrome에서 이 문제를 어떻게 우회하는지에 대해 정리했습니다.

4. 오늘날 User-Agent에 접근하기 위한 권장 사항#

사용 사례에 따라 애플리케이션이 최상의 결과를 얻을 수 있도록 다른 접근 방식을 사용해야 합니다.

  • 기능 탐지: 가능한 한 기존 브라우저 JavaScript API 사용. 가능할 때마다 User-Agent를 사용하기보다 직접 기능을 탐지하는 브라우저 API에 의존하세요. 이 방법이 더 안정적이고 미래에도 대비할 수 있습니다.
  • 기기 유형과 같은 낮은 엔트로피 힌트의 경우: User-Agent로 충분. 애플리케이션이 기기 유형이나 기타 낮은 엔트로피 세부 사항만 확인하면 되는 경우, User-Agent 문자열로 충분히 구체적인 정보를 얻을 수 있습니다. 이러한 목적에 기존 API를 사용할 수도 있습니다.
  • 높은 엔트로피 정보 및 도메인 제어의 경우: 헤더 방식 사용. 상세한 정보가 필요하고 도메인에 대한 제어 권한이 있다면, 지원되는 브라우저(Chrome, Edge)에서 HTTP 헤더 방식을 활용하여 높은 엔트로피 정보를 요청하세요. (Client hint 헤더를 보내지 않는) 다른 모든 브라우저에서는 기존 User-Agent를 사용하세요. 정보를 즉각적으로 필요한지 아니면 약간의 지연을 허용할 수 있는지에 따라 critical Client Hints를 사용할지 여부를 결정하세요.
  • JavaScript 라이브러리의 경우: getHighEntropyValues 사용. JavaScript 라이브러리를 개발하는 경우, 가장 좋은 옵션은 navigator.userAgentData.getHighEntropyValues() 함수가 정의되어 있을 때 이를 사용하여 사용자 브라우저 및 기기에 대한 특정 정보를 동적으로 요청하고, 다른 경우에는 User-Agent 파싱 라이브러리로 폴백하는 것입니다.

다음 표는 User-Agent(UA) 및 Client Hints(CH)에 접근할 수 있는 경우 운영 체제 버전을 탐지할 수 있는 브라우저를 요약한 것입니다.

브라우저WindowsMacOSiOSAndroid
Chrome✅ CH✅ CH❌ (iOS 26+)✅ CH
Edge✅ CH✅ CH❌ (iOS 26+)✅ CH
Firefox❌ (iOS 26+)
Safari-✅ UA-Safari❌ (Safari 26+)-
Samsung Internet---✅ CH
WebViews--❌ (iOS 26+)✅ UA (≥ 16: ❌)

구체적인 요구사항에 따라 적절한 방법을 선택함으로써, 사용자 세부 정보에 대한 필요성과 개인정보 보호 및 성능 고려 사항의 균형을 효과적으로 맞출 수 있습니다. 추출하기 어렵거나 실제로 기기에 깊이 종속된 정보에 크게 의존한다면, 무거운 작업을 대신 처리해 주는 wurfl이나 51degrees.com과 같은 전문 라이브러리로 폴백하세요. 이 두 라이브러리는 클라이언트 힌트 통합을 지원하며 iPhone 모델을 탐지하기 위한 고유한 방식도 갖추고 있습니다.

5. 패스키를 위해 User-Agent 및 Client Hints를 사용하는 방법#

Corbado는 주로 React로 개발된 UI 컴포넌트를 사용하여 패스키와 관련된 솔루션을 개발하는 데 집중합니다. 당사의 컴포넌트는 다양한 웹사이트에 임베드되어 있으므로 자체 권장 사항에 따라 가능하면 getHighEntropyValues()를 사용하고 다른 모든 경우에는 기존 User-Agent 파싱으로 폴백합니다. 저희는 주로 다음과 같은 용도로 이를 사용합니다.

  • 패스키 관리: 패스키 관리 사이트에서 패스키가 생성된 기기에 대한 모든 가용한 정보를 표시합니다.
  • 교차 기기 인증(Cross-Device-Authentication): 교차 기기 인증을 위해, 클라이언트가 CDA(교차 기기 인증) 활용을 지원할 가능성이 얼마나 되는지 판단하기 위해 운영 체제 정보를 사용합니다. 이는 Windows 10과 11을 구별할 때 특히 중요하며, Chrome 및 Edge의 Client Hints를 사용해야만 가능합니다.

세부 정보: https://learn.microsoft.com/en-us/microsoft-edge/web-platform/how-to-detect-win11

  • 패스키 인텔리전스: 패스키 로그인을 시작할지 여부는 플랫폼이 결정해야 한다고 생각합니다. 따라서 새로운 기기가 사용 중인지 감지하기 위해 컴포넌트에 가능한 한 많은 로직을 통합합니다. 이러한 시나리오에서는 새롭거나 버전이 낮은 운영 체제가 상황 변화를 알려주는 귀중한 힌트가 됩니다.

컴포넌트용 정보를 정리하기 시작했을 때, User-Agent 축소가 시작되기 전이나 도중에 생성된 단편적인 데이터가 매우 많다는 것을 알게 되었습니다. 그래서 탐지 성능을 높이고 싶지만 평소에 User-Agent나 Client Hints를 다루지 않는 개발자분들에게 이 요약이 도움이 될 것이라고 생각했습니다.

6. 결론#

User-Agent 기반 탐지가 수십 년간 표준으로 사용되어 왔지만, 사용자 프라이버시를 보호하기 위해 User-Agent 문자열에 담긴 세부 정보는 점점 더 줄어들고 있습니다. 이 문서에서는 다음 내용을 다루었습니다.

  • User-Agent 축소란? User-Agent 축소는 사용자 프라이버시를 보호하기 위해 User-Agent 문자열을 통해 공유되는 정보량을 최소화하는 과정입니다. 이러한 전환을 통해, 이전에는 여러 웹사이트에서 사용자를 추적하고 핑거프린팅하는 데 사용되었던 운영 체제 버전 및 하드웨어 모델과 같은 데이터의 세분성이 감소합니다. 이 축소가 개발자에게 미치는 영향과 이러한 변화에 적응하는 방법을 살펴보았습니다.
  • Client Hints 작동 방식: Client Hints는 사용자 기기에 대한 구체적이고 높은 엔트로피 정보를 더 프라이버시 친화적인 방식으로 요청할 수 있는 메커니즘을 제공합니다. 개발자는 HTTP 헤더 및 JavaScript API를 사용하여 필요할 때 사용자 환경에 대한 자세한 데이터에 접근할 수 있습니다. Client Hints가 어떻게 구현되는지, 사용 가능한 힌트의 종류, HTTP 요청 헤더 및 JavaScript를 통해 이에 접근하는 방법에 대해 논의했습니다.

Client Hints는 계속 진화하고 있으며 더 많은 브라우저와 개발자가 그 이점을 인식함에 따라 채택이 늘어날 수 있습니다. 그러나 지원이 보편화될지 아니면 이 주제를 두고 웹이 계속 엇갈릴지는 두고 봐야 합니다.

Corbado

Corbado 소개

Corbado는 대규모로 consumer authentication을 운영하는 CIAM 팀을 위한 Authentication Intelligence Platform입니다. IDP 로그와 일반 analytics 도구가 보여주지 못하는 것을 볼 수 있게 해드립니다: 어떤 디바이스, OS 버전, 브라우저, credential manager가 passkey를 지원하는지, 왜 등록이 로그인으로 이어지지 않는지, WebAuthn 플로우가 어디서 실패하는지, OS나 브라우저 업데이트가 언제 조용히 로그인을 망가뜨리는지 — Okta, Auth0, Ping, Cognito 또는 자체 IDP를 교체하지 않고도 전부 파악할 수 있습니다. 두 가지 제품: Corbado Observe passkey 및 다른 모든 로그인 방식에 대한 observability를 더합니다. Corbado Connectanalytics가 내장된 managed passkey를 제공합니다 (기존 IDP와 함께). VicRoads는 Corbado로 500만+ 사용자에게 passkey를 운영하고 있습니다 (passkey 활성화율 +80%). Passkey 전문가와 상담하기

자주 묻는 질문(FAQ)#

iOS 26 이후 웹 앱에서 실제 iOS 버전을 확인하려면 어떻게 해야 하나요?#

Apple은 2025년 9월 출시된 Safari 26부터 iOS/iPadOS의 User-Agent 문자열을 고정했습니다. 이는 iOS에서 실행되는 모든 브라우저의 User-Agent를 통해 더 이상 OS 버전이 노출되지 않음을 의미합니다. Android나 데스크톱의 Chrome과 달리 iOS 브라우저에는 Client Hints API가 제공되지 않으므로 프로그래밍 방식으로 실제 iOS 버전에 접근할 수 없습니다.

일반 Client Hints와 Critical Client Hints의 차이점은 무엇인가요?#

Accept-CH 응답 헤더를 통해 요청되는 일반 Client Hints는 후속 요청에만 포함되며 초기 페이지 로드 시에는 사용할 수 없습니다. 반면 Critical Client Hints는 렌더링 전에 즉각적인 브라우저 재시도를 트리거하여 첫 렌더링 시 힌트를 사용할 수 있도록 보장하지만 요청 주기에 왕복 지연 시간이 추가됩니다.

Apple이 Safari User-Agent를 고정하려던 2017년의 초기 결정을 번복한 이유는 무엇인가요?#

Apple은 2017년 Safari Technology Preview 46에서 User-Agent 고정을 발표했지만, 최신 User-Agent 정보에 의존하는 웹사이트와의 심각한 호환성 문제로 인해 2021년에 이 결정을 부분적으로 철회했습니다. 이후 Apple은 즉각적이고 완전한 고정 대신 점진적으로 UA를 고정하는 방식을 도입했습니다.

Client Hints가 지원되지 않는 경우 Safari에서 macOS 버전을 어떻게 탐지할 수 있나요?#

Safari는 Client Hints를 지원하지 않지만 User-Agent 문자열의 Safari 버전 번호를 통해 macOS 버전을 유추할 수 있습니다. Safari와 macOS 버전 간의 일관된 릴리스 일정을 기반으로, Safari 메이저 버전에서 3을 빼면 macOS 10.15 이상의 macOS 메이저 버전과 안정적으로 매핑됩니다.

JavaScript 라이브러 개발자는 크로스 브라우저 기기 탐지를 위해 어떤 방식을 사용해야 하나요?#

권장되는 방식은 기능이 정의되어 있을 때 navigator.userAgentData.getHighEntropyValues()를 호출하여 Chromium 기반 브라우저를 지원하고, Firefox 및 Safari의 경우 User-Agent 문자열 파싱 라이브러리로 폴백하는 것입니다. 매우 구체적인 기기 모델 식별이 필요한 경우 wurfl 또는 51degrees와 같은 전문 라이브러리를 통해 User-Agent 문자열이 노출하는 것 이상의 추가적인 탐지 기능을 제공받을 수 있습니다.

패스키 도입 과정에서 실제로 무슨 일이 일어나는지 확인하세요.

Console 살펴보기

이 글 공유하기


LinkedInTwitterFacebook