웹 블루투스 API와 패스키

패스키는 웹의 새로운 로그인 표준입니다. 패스키의 핵심 기능 중 하나는 블루투스와 QR 코드를 통한 기기 간 인증(CDA)입니다. 이러한 맥락에서 또 다른 웹 API인 웹 블루투스 API가 중요해집니다.

웹 블루투스 API는 웹 앱이 블루투스 기기와 직접 상호 작용할 수 있게 함으로써, 안전하고 효율적인 인증 프로세스(특히 CDA의 경우)를 보장하는 데 중요한 역할을 합니다.

이 블로그 게시물에서는 웹 블루투스 API의 작동 방식을 소개하고 블루투스 감지가 패스키 인증에 미치는 영향을 살펴보겠습니다. 다음 질문에 대한 답을 찾아보고자 합니다.

1. 웹 블루투스 API란 무엇인가?
2. 웹 블루투스 API는 어떻게 사용하는가?
3. 패스키에 블루투스 감지가 왜 중요한가?

웹 블루투스 API는 웹 앱이 블루투스 기기에 접근하고 통신할 수 있게 해주는 자바스크립트 인터페이스입니다. 이는 HTML5 표준의 일부이며 Chrome, Edge, Opera와 같은 브라우저에서 지원됩니다. 이 API를 통해 웹 앱은 다음을 수행할 수 있습니다.

• 주변의 저전력 블루투스(Energy, BLE) 기기 스캔
• 페어링 권한 요청
• 일반 속성 프로필(GATT) 프로토콜을 사용한 데이터 교환

웹 블루투스 API에는 세 가지 주요 기능이 있습니다.

getAvailability()는 사용자 에이전트가 블루투스를 지원하는지(즉, 기기에 블루투스 모듈이 있는지) 여부를 나타내는 불리언 값으로 확인되는 프로미스(promise)를 반환합니다. 일부 사용자 에이전트는 사용자가 이 메서드가 반환하는 값을 지정하는 옵션을 구성하도록 허용합니다.

navigator.bluetooth.getAvailability().then((available) => {
    if (available) {
        console.log("This device supports Bluetooth!");
    } else {
        console.log("Doh! Bluetooth is not supported");
    }
});

Subscribe to our Passkeys Substack for the latest news.

Subscribe

getDevices()는 해당 출처(origin)가 접근할 수 있는 BluetoothDevices 배열로 확인되는 프로미스를 반환합니다(범위를 벗어나거나 전원이 꺼진 기기 포함). 권한은 이전에 Bluetooth.requestDevice()를 호출하여 얻습니다.

navigator.bluetooth.getDevices().then((devices) => {
    devices.forEach((device) => {
        console.log("Device:", device.name);
    });
});

requestDevice()는 지정된 옵션을 가진 BluetoothDevice 객체에 대한 프로미스를 반환합니다. 선택 UI가 없는 경우, 이 메서드는 기준에 맞는 첫 번째 기기를 반환합니다.

navigator.bluetooth
    .requestDevice({
        filters: [
            {
                services: ["battery_service"],
            },
        ],
    })
    .then((device) => {
        console.log("Device:", device.name);
    })
    .catch((error) => {
        console.log("Error:", error);
    });

자세한 내용과 코드 스니펫은 여기에서 찾을 수 있습니다. 또한 웹 블루투스에 대한 W3C 표준도 참조하세요.

Become part of our Passkeys Community for updates & support.

Join

• HTTPS 전용: 웹 블루투스 API는 보안 컨텍스트(HTTPS)에서만 사용할 수 있어 안전한 데이터 전송을 보장합니다.
• 사용자 제스처 필요: navigator.bluetooth.requestDevice를 통한 기기 검색은 보안상의 이유로 터치나 마우스 클릭과 같은 사용자 제스처에 의해 트리거되어야 합니다.

웹 블루투스 API 지원 여부는 다음 코드를 통해 확인할 수 있습니다.

if ("bluetooth" in navigator) {
    // Web Bluetooth API is supported
    console.log("Web Bluetooth is supported!");
} else {
    // Web Bluetooth API is not supported
    console.log("Web Bluetooth is not supported!");
}

특정 함수를 호출하는 방법은 위에서 설명했습니다.

웹 블루투스 API는 개발자와 사용자에게 여러 가지 이점을 제공합니다.

• 상호작용성: 네이티브 앱이나 플러그인 없이 웹 앱이 블루투스 기기와 상호 작용할 수 있게 합니다.
• 향상된 사용자 경험: 심박수 모니터나 음악 제어기와 같은 무선 기기의 기능 및 센서에 접근할 수 있습니다.
• 보안 및 개인정보 보호: 사용자는 기기 접근에 대한 권한을 부여해야 하며, 이 권한은 언제든지 철회할 수 있습니다.

이점에도 불구하고 웹 블루투스 API에는 한계가 있습니다.

• Safari 및 Firefox 미지원: 모든 브라우저가 이 API를 지원하는 것은 아닙니다. 특히 Safari와 Firefox는 지원하지 않아 상당수 사용자에게 영향을 미칠 수 있습니다.
• 기기 기능에 대한 의존성: 이 API는 호환되는 저전력 블루투스(Energy, BLE) 기기에서만 작동합니다. 또한 배터리 부족이나 범위를 벗어나는 등의 요인으로 기기를 검색하지 못할 수 있습니다.
• 진화하는 사양: 웹 블루투스 API는 초안 사양이므로 변경될 수 있습니다. 개발자는 최신 개발 동향과 브라우저 호환성을 계속 주시해야 합니다.
• 긍정 오류(False Positives): API가 실제로는 블루투스를 사용할 수 없음에도 지원한다고 표시하는 경우가 있습니다.
• 사용자 제어 가용성: 사용자와 브라우저가 블루투스 권한을 비활성화할 수 있으며, 이 경우 블루투스 어댑터가 있어도 getAvailability()가 false를 반환할 수 있습니다. 이는 Permissions-Policy:Bluetooth를 통해 제어됩니다. 마찬가지로 getAvailability()가 true를 반환하더라도 블루투스 어댑터가 켜져 있지 않거나 사용자가 API 사용 권한 요청을 거부할 수 있습니다.

웹 블루투스 API의 채택은 아직 증가하는 추세입니다. 2024년 6월 기준, Can I Use에 따르면 전 세계 사용자의 76.53%가 웹 블루투스 API를 지원하는 기기를 보유하고 있습니다.

하지만 Safari와 Firefox에서의 지원 부족은 여전히 큰 장애물로 남아 있으며, 해당 브라우저의 사용자 경험에 영향을 미칩니다. 또한 Bluetooth.getDevices()와 같은 일부 기능은 사용자가 명시적으로 켜야 하므로 백그라운드에서 API를 사용하는 데 어려움이 있을 수 있습니다.

최신 데이터는 다음에서 확인하세요: https://developer.mozilla.org/en-US/docs/Web/API/Web_Bluetooth_API#browser_compatibility

신뢰 당사자가 웹사이트와 애플리케이션에서 패스키를 제공하고자 할 때 블루투스 사용 가능 여부를 알아야 하는 한 가지 주요 이유가 있습니다.

패스키의 새롭고 혁신적인 기능 중 하나는 **기기 간 인증(CDA)**입니다. 이는 하이브리드 인증이라고도 알려져 있습니다. 이 기능을 통해 사용자는 QR 코드와 블루투스를 사용하여 모바일 기기로 다른 기기(일반적으로 데스크톱이나 노트북)에서 인증할 수 있습니다. 이 하이브리드 인증 방식은 보안과 편의성을 향상시켜 원활한 사용자 경험을 제공합니다. 대부분의 비기술적인 사용자는 코로나19 팬데믹 기간 동안 등록을 위해 QR 코드를 스캔하거나, 나중에 데스크톱 지원을 추가한 모바일 우선 메시징 앱(WhatsApp 또는 Telegram 등)을 통해 QR 코드 스캔에 익숙해져 있습니다.

CDA 전략을 결정하는 것은 모든 패스키 프로젝트의 시작 단계에서 매우 중요합니다. CDA에 더 많이 의존할수록 지원과 안정성이 더 좋아야 합니다. 따라서 기기에서 블루투스 사용 가능 여부를 감지하는 것이 필수적입니다.

하지만 모든 기기에 블루투스 기능이 있거나 블루투스가 켜져 있는 것은 아닙니다. 패스키를 제공하는 신뢰 당사자에게는 블루투스 사용 가능 여부를 감지하여 CDA를 사용할 수 있는지 또는 다른 대체 인증 방법이 필요한지 결정하는 것이 중요합니다. 웹 블루투스 API는 웹 앱이 사용자 기기에서 블루투스 사용 가능 여부를 확인할 수 있게 함으로써 해결책을 제공합니다.

CDA가 항상 안정적인 것은 아니며, 때로는 명확한 이유 없이 연결에 실패할 수 있다는 점을 명심해야 합니다. 또한 API가 비교적 새롭기 때문에 API가 잘못된 결과를 반환하는 경우도 있습니다.

Firefox와 Safari에서 웹 블루투스 API를 사용할 수 없다는 점은 특히 Firefox에게 문제입니다.

Safari는 문제가 덜합니다. 왜냐하면 CDA가 수행될 수 있는 macOS 기기는 초기 모델부터 블루투스가 내장되어 있었기 때문입니다. 하지만 macOS에서 블루투스가 작동하지 않는 경우, 사용자는 기기 간 인증에 문제를 겪을 수 있으며 설정을 해결하거나 대체 방법으로 돌아가야 할 수 있습니다. Safari를 실행하는 iPhone은 처음부터 블루투스가 내장되어 있습니다.

하지만 Firefox는 Windows 기기에서 인기가 많기 때문에 중요한 문제입니다. 사용자가 Firefox에서 CDA를 사용하려는 경우, 웹 블루투스 API가 구현되어 있지 않으므로 신뢰 당사자는 블루투스 사용 가능 여부를 안정적으로 판단할 수 없습니다. 이로 인해 사용자는 무엇을 해야 할지 모른 채 특정 지점에서 막히는 등 좋지 않은 사용자 경험을 겪을 수 있습니다.

이전 블로그에서도 보았듯이, Windows 기기는 패스키 채택 측면에서 뒤처지고 있습니다(State of Passkeys 참조). 블루투스 사용 가능성이 얼마나 일반적인지 살펴보겠습니다.

Windows 10에는 엄격한 블루투스 요구 사항이 없습니다. 하지만 대부분의 최신 노트북과 데스크톱에는 블루투스 기능이 탑재되어 있습니다. 그러나 사용자가 이를 꺼두었거나, 특히 맞춤형 데스크톱과 같은 일부 구성에서는 사용하지 못할 수 있습니다.

Windows 11도 Windows 10과 마찬가지로 블루투스를 의무화하지 않습니다. 하지만 하드웨어가 더욱 통합되고 현대화되는 추세에 따라 대부분의 Windows 11 호환 기기에는 블루투스 기능이 있을 가능성이 높습니다. 그럼에도 불구하고 사용자가 이를 비활성화할 수 있으며, 이는 CDA 구현에 영향을 미칩니다.

다음 표에서 데스크톱 기기가 블루투스를 지원하여 CDA 클라이언트로 사용될 수 있는지 여부를 확인할 수 있습니다.

하드웨어가 블루투스를 지원하더라도 사용자가 블루투스 기능을 꺼둘 수 있다는 점을 명심하세요. 블루투스가 꺼져 있어도 사용자는 CDA를 사용할 수 있습니다. 왜냐하면 사용자가 이를 활성화하도록 선택할 수 있기 때문이며, 이는 Windows와 Mac에서 작동합니다:

macOS 블루투스 켜기 요청

Windows 11 블루투스 켜기 요청

블루투스 사용 가능 여부 정보는 블루투스 지원이 낮고 기기 간 인증이 발생할 확률이 매우 높은(패스키 기반 로그인에서) Windows 10 및 Windows 11에서 특히 흥미롭습니다. 최신 macOS 기기는 모두 블루투스를 지원합니다. 이러한 macOS 기기는 iCloud 키체인에 저장된 패스키에 직접 접근할 수 있을 가능성이 있으므로 우려 대상이 아닙니다.

Windows 10 및 Windows 11에서: getAvailability()를 사용하여 블루투스가 작동할 수 있는지 확인하세요. 사용자가 Windows 이외의 패스키만 가지고 있는 경우, 즉시 다른 인증 옵션으로 대체할 수 있습니다.

하이브리드 패스키만 사용 가능한 상황에서 패스키 인증을 트리거하면 성공적인 인증으로 이어지지 않고 사용자가 막다른 길에 부딪히게 됩니다. Windows 10 및 Windows 11의 다른 모든 브라우저에서는 안타깝게도 CDA 지원 여부를 확인할 다른 방법이 없습니다.

웹 블루투스 API는 블루투스 기능을 통해 패스키 인증을 향상시키는 강력한 도구입니다. 이 API를 이해하고 활용함으로써 개발자는 더 안전하고 사용자 친화적인 인증 방법을 만들 수 있습니다. 하지만 한계를 잘 파악하고 다양한 브라우저와 기기에서 원활한 사용자 경험을 유지하기 위해 강력한 대체 메커니즘을 보장해야 합니다.

이 블로그 게시물을 통해 우리는 세 가지 핵심 질문에 대한 답을 제시했습니다.

1. 웹 블루투스 API란 무엇인가? 웹 블루투스 API는 웹 앱이 블루투스 기기에 접근하고 통신할 수 있게 해주는 자바스크립트 인터페이스로, 안전한 상호작용을 촉진합니다.
2. 웹 블루투스 API는 어떻게 사용하는가? getAvailability(), getDevices(), requestDevice()와 같은 함수를 호출하여 블루투스 지원 여부를 확인하고, 접근 가능한 기기 목록을 나열하며, 기기 페어링을 요청하여 웹 블루투스 API를 사용합니다.
3. 패스키에 블루투스 감지가 왜 중요한가? 웹 블루투스 API를 패스키 구현 전략에 통합함으로써, 블루투스 지원을 감지할 수 있는 기기가 있는 경우에만 CDA로 대체되는 훌륭한 패스키 기반 인증 솔루션을 구축할 수 있습니다.

웹 블루투스 API에 대한 더 많은 정보와 예제 모음은 여기를 클릭하세요.