Gợi ý về Thông tin xác thực Khóa công khai WebAuthn / Gợi ý User-Agent

WebAuthn và passkey đang có đà phát triển mạnh mẽ và ngày càng được áp dụng rộng rãi. Đồng thời, từ góc độ kỹ thuật, tiêu chuẩn WebAuthn cũng đang phát triển nhanh chóng. Gợi ý thông tin xác thực khóa công khai WebAuthn (còn gọi là Gợi ý User-agent) là sự bổ sung mới nhất cho API Xác thực Web, nhằm mục đích cải thiện cách các nhà phát triển triển khai xác thực bằng passkey trong ứng dụng của họ.

Trong bài viết này, chúng ta sẽ trả lời các câu hỏi sau:

• Gợi ý Thông tin xác thực Khóa công khai WebAuthn là gì?
• Tại sao chúng ta cần Gợi ý Thông tin xác thực Khóa công khai WebAuthn?
• Gợi ý Thông tin xác thực Khóa công khai WebAuthn hoạt động như thế nào?
• Những hạn chế và trường hợp đề xuất sử dụng Gợi ý Thông tin xác thực Khóa công khai WebAuthn cho các dự án của bạn là gì?

Hãy bắt đầu bằng cách xem xét động lực trước tiên.

Ngày nay, có nhiều nơi khác nhau mà bạn có thể tạo và lưu trữ passkey:

• Trình quản lý mật khẩu của bên thứ ba (ví dụ: 1Password, Dashlane, Bitwarden, KeePassXC)
• Trình quản lý mật khẩu của Google / Hồ sơ Chrome
• iCloud Keychain / Mật khẩu Apple
• Windows Hello
• Một điện thoại thông minh khác (iOS, Android) hoặc máy tính bảng (iPadOS, Android)
• Khóa bảo mật phần cứng (ví dụ: YubiKey)

Đối với người dùng, điều này có thể mang lại sự linh hoạt và tự do lựa chọn. Tuy nhiên, một số ứng dụng và kịch bản yêu cầu hạn chế một số tùy chọn này, ví dụ như khi bạn chỉ muốn cho phép khóa bảo mật phần cứng do yêu cầu bảo mật cao hơn.

Để tác động đến việc tạo passkey và lưu trữ, chúng ta đã có thuộc tính authenticatorAttachment.

Subscribe to our Passkeys Substack for the latest news.

Subscribe

authenticatorAttachment cho phép các bên tin cậy (relying party) hạn chế nơi có thể tạo passkey.

platform chỉ một authenticator được tích hợp sẵn vào thiết bị đang chạy WebAuthn. WebAuthn giao tiếp với nó bằng các phương thức truyền tải dành riêng cho nền tảng đó, chẳng hạn như các API dành riêng cho nền tảng. Một thông tin xác thực khóa công khai được liên kết với một authenticator platform được gọi là thông tin xác thực platform. Từ danh sách trên, các trình quản lý thông tin xác thực / vị trí sau có thể lưu trữ thông tin xác thực platform:

• Trình quản lý mật khẩu của bên thứ ba (ví dụ: 1Password, Dashlane, Bitwarden, KeePassXC)
• Trình quản lý mật khẩu của Google / Hồ sơ Chrome
• iCloud Keychain / Mật khẩu Apple
• Windows Hello

Windows 11 và Chrome:

macOS 15 (Sequoia) và Chrome:

Khi nhấp vào Hủy, hộp thoại sau sẽ xuất hiện:

macOS 15 (Sequoia) và Safari:

cross-platform chỉ một authenticator bên ngoài thiết bị đang chạy WebAuthn (roaming authenticator) vì nó có thể được sử dụng trên nhiều thiết bị. WebAuthn tương tác với nó bằng các giao thức truyền tải đa nền tảng như Bluetooth hoặc NFC. Một thông tin xác thực khóa công khai được liên kết với một roaming authenticator được gọi là thông tin xác thực roaming. Từ danh sách trên, các trình quản lý thông tin xác thực / vị trí sau có thể lưu trữ thông tin xác thực cross-platform:

• Một điện thoại thông minh khác (iOS, Android) hoặc máy tính bảng (iPadOS, Android)
• Khóa bảo mật phần cứng (ví dụ: YubiKey)

Windows 11 và Chrome:

macOS 15 (Sequoia) và Chrome:

macOS 15 (Sequoia) và Safari:

Không xác định chỉ ra rằng có thể sử dụng một authenticator platform hoặc một authenticator cross-platform. Ở đây, người dùng có thể chọn nơi họ muốn lưu trữ passkey.

Windows 11 và Chrome:

macOS 15 (Sequoia) và Chrome:

macOS 15 (Sequoia) và Safari:

Khi nhấp vào Hủy, hộp thoại sau sẽ xuất hiện:

authenticatorAttachment đã được sử dụng trong một thời gian. Tuy nhiên, nó cũng thiếu linh hoạt đối với các phát triển mới như Xác thực chéo thiết bị (qua mã QR và Bluetooth). Ở đây, một passkey cũng được lưu trữ ví dụ trong Trình quản lý mật khẩu của Google (thông tin xác thực platform) nhưng được kích hoạt bằng cross-platform bởi relying party. Ngoài ra, việc kiểm soát của một relying party để ảnh hưởng đến loại passkey nên được sử dụng trong một quy trình đăng nhập (không phải đăng ký) chỉ có thể được thực hiện bằng cách sửa đổi giá trị transports của một thông tin xác thực.

Đó là lúc Gợi ý Thông tin xác thực Khóa công khai WebAuthn phát huy tác dụng.

Become part of our Passkeys Community for updates & support.

Join

Gợi ý thông tin xác thực khóa công khai WebAuthn là một tham số mới được giới thiệu trong API Xác thực Web (chính thức trong WebAuthn Cấp 3). Chúng cung cấp hướng dẫn cho trình duyệt về loại authenticator mà người dùng có khả năng sẽ sử dụng trong quá trình xác thực. Điều này giúp mang lại trải nghiệm người dùng liền mạch và trực quan hơn bằng cách tập trung giao diện người dùng của trình duyệt vào các tùy chọn phù hợp nhất.

Ba loại Gợi ý

Các gợi ý có ba loại:

1. security-key: Cho biết người dùng dự kiến sẽ sử dụng một khóa bảo mật phần cứng (ví dụ: YubiKey).
2. client-device: Gợi ý rằng người dùng sẽ sử dụng một authenticator platform được gắn vào thiết bị khách (như Touch ID trên macOS, Face ID trên iOS hoặc Windows Hello trên Windows).
3. hybrid: Ngụ ý rằng người dùng có thể sử dụng điện thoại thông minh hoặc máy tính bảng để xác thực chéo thiết bị qua mã QR và Bluetooth.

Những gợi ý này không phải là yêu cầu nghiêm ngặt từ relying party mà đóng vai trò là hướng dẫn để nâng cao trải nghiệm người dùng như những gợi ý cho trình duyệt.

Sau đây, bạn sẽ thấy ảnh chụp màn hình cho macOS Sequoia (Edge + Chrome) và Windows 10 (Chrome) với authenticatorAttachment không được chỉ định và Gợi ý User-agent WebAuthn được đặt thành security-key.

Ở đây, chúng ta thấy một hạn chế khác, đó là gợi ý security-key không được tôn trọng trên Windows 10, ít nhất là không trực tiếp. Luồng về cơ bản giống như luồng cho gợi ý client-device.

Khi nhấp vào Hủy, hộp thoại sau sẽ xuất hiện:

Sau đây, bạn sẽ thấy ảnh chụp màn hình cho macOS Sequoia (Edge + Chrome) và Windows 10 (Chrome) với authenticatorAttachment không được chỉ định và Gợi ý User-agent WebAuthn được đặt thành client-device.

Khi nhấp vào Hủy, hộp thoại sau sẽ xuất hiện:

Khi nhấp vào Hủy, hộp thoại sau sẽ xuất hiện:

Khi nhấp vào Hủy, hộp thoại sau sẽ xuất hiện:

Sau đây, bạn sẽ thấy ảnh chụp màn hình cho macOS Sequoia (Edge + Chrome) và Windows 10 (Chrome) với authenticatorAttachment không được chỉ định và Gợi ý User-agent WebAuthn được đặt thành hybrid.

Với sự ra đời của các gợi ý, các nhà phát triển giờ đây có thể cung cấp một loạt các tùy chọn ưu tiên theo thứ tự giảm dần, mang lại sự linh hoạt hơn.

Đoạn mã dưới đây cho trình duyệt biết rằng người dùng có khả năng sẽ xác thực bằng khóa bảo mật phần cứng, tập trung giao diện người dùng cho phù hợp.

Để tương thích với các user agent cũ hơn, khi gợi ý này được sử dụng trong PublicKeyCredentialCreationOptions, authenticatorAttachment nên được đặt thành cross-platform.

const credential = await navigator.credentials.create({
  publicKey: {
    challenge: /* your challenge here */,
    hints: ['security-key'],
    authenticatorSelection: {
      authenticatorAttachment: 'cross-platform'
    }
  }
});

Gợi ý security đặc biệt có giá trị trong các trường hợp đảm bảo cao, nơi trang web / relying party chỉ muốn cho phép khóa bảo mật phần cứng và hướng người dùng theo hướng này.

Trong ví dụ này, gợi ý cho thấy người dùng có thể sử dụng authenticator platform tích hợp sẵn của thiết bị hiện tại.

Để tương thích với các user agent cũ hơn, khi gợi ý này được sử dụng trong PublicKeyCredentialCreationOptions, authenticatorAttachment nên được đặt thành platform.

const credential = await navigator.credentials.create({
  publicKey: {
    challenge: /* your challenge here */,
    residentKey: true,
    hints: ['client-device'],
    authenticatorSelection: {
      authenticatorAttachment: 'platform'
    }
  }
});

Việc đặt gợi ý client-device có lợi nếu có nhiều passkey được liên kết với một tài khoản người dùng và một số trong số chúng có thể có sẵn trên thiết bị đang đăng nhập, trong khi những cái khác được lưu trữ trên các thiết bị khác. Nếu hệ thống (trí tuệ passkey) phát hiện rằng người dùng đang cố gắng đăng nhập có khả năng cao có sẵn một passkey cục bộ, thì gợi ý này có thể được đặt trong PublicKeyCredentialRequestOptions giúp người dùng tiết kiệm một cú nhấp chuột để chọn đúng passkey.

Trong ví dụ này, gợi ý cho thấy người dùng có thể sử dụng điện thoại thông minh hoặc một thiết bị tương tự để xác thực.

Để tương thích với các user agent cũ hơn, khi gợi ý này được sử dụng trong PublicKeyCredentialCreationOptions, authenticatorAttachment nên được đặt thành cross-platform.

const credential = await navigator.credentials.create({
  publicKey: {
    challenge: /* your challenge here */,
    residentKey: true,
    hints: ['hybrid'],
    authenticatorSelection: {
      authenticatorAttachment: 'cross-platform'
    }
  }
});

Gợi ý hybrid có thể hữu ích nếu người dùng có nhiều khóa và hệ thống (trí tuệ passkey) phát hiện rằng trên thiết bị hiện tại, có lẽ không có passkey cục bộ nào. Để cải thiện UX và tiết kiệm một cú nhấp chuột, bạn có thể đặt gợi ý User-agent WebAuthn này và trực tiếp nhắc người dùng xác thực chéo thiết bị (qua mã QR và Bluetooth). Hơn nữa, nếu bạn cố gắng xây dựng một hệ thống passkey ưu tiên di động (mobile-first), thì việc đặt gợi ý này rất có ý nghĩa.

Để tự mình thử nghiệm với các tùy chọn khác nhau, chúng tôi khuyên bạn nên xem Passkeys Debugger.

Want to experiment with passkey flows? Try our Passkeys Debugger.

Try for Free

Điều quan trọng là phải hiểu cách Gợi ý Thông tin xác thực Khóa công khai WebAuthn tương tác với các tham số WebAuthn khác như authenticatorAttachment và credential transports.

Đầu tiên, điều quan trọng cần lưu ý là những gợi ý này không phải là yêu cầu nghiêm ngặt. Chúng không ràng buộc user-agent (trình duyệt) mà đóng vai trò là hướng dẫn để cung cấp trải nghiệm tốt nhất bằng cách tận dụng thông tin theo ngữ cảnh bạn có về yêu cầu. Điều này có nghĩa là các trình duyệt có thể chọn xem xét các gợi ý nhưng không bắt buộc phải tuân theo chúng một cách nghiêm ngặt.

Gợi ý được cung cấp dưới dạng một mảng theo thứ tự ưu tiên giảm dần. Thứ tự này xác định cách trình duyệt nên ưu tiên chúng:

• Gợi ý đầu tiên được ưu tiên: Nếu hai gợi ý mâu thuẫn, trình duyệt sẽ ưu tiên gợi ý đầu tiên.
• Gợi ý chồng chéo: Nếu một gợi ý cụ thể hơn có thể không được tất cả các trình duyệt nhận ra, bạn có thể bao gồm các gợi ý ít cụ thể hơn sau đó để có khả năng tương thích rộng hơn.
• Gợi ý trùng lặp: Nếu cùng một gợi ý xuất hiện nhiều lần, mọi lần xuất hiện tiếp theo sẽ bị bỏ qua.

Ví dụ:

hints: ['security-key', 'hybrid', 'client-device']

Trong mảng này:

1. Trình duyệt đầu tiên ưu tiên security-key.
2. Nếu không áp dụng được, nó sẽ xem xét hybrid.
3. Cuối cùng, nó sẽ xem xét client-device (authenticator platform trên thiết bị khách).

Gợi ý có thể mâu thuẫn với thông tin chứa trong authenticatorAttachment và credential transports. Khi điều này xảy ra, gợi ý sẽ được ưu tiên. Điều này mang lại sự linh hoạt hơn so với việc sử dụng nghiêm ngặt authenticatorAttachment trước đây, vốn giới hạn authenticator ở platform hoặc cross-platform.

Ví dụ với các tham số mâu thuẫn:

const credential = await navigator.credentials.create({
  publicKey: {
    challenge: /* your challenge here */,
    hints: ['hybrid'],
    authenticatorSelection: {
      authenticatorAttachment: 'platform' // Mâu thuẫn với gợi ý
    }
  }
});

Trong trường hợp này:

• Gợi ý: Gợi ý ưu tiên cho authenticator hybrid.
• authenticatorAttachment: Chỉ định platform, thường giới hạn authenticator cho thiết bị khách.
• Kết quả: Trình duyệt ưu tiên gợi ý hơn authenticatorAttachment, tập trung vào các tùy chọn hybrid.

Hiện tại, gợi ý thông tin xác thực khóa công khai WebAuthn chỉ có sẵn trong Chrome (từ phiên bản 128). Tính đến thời điểm hiện tại, Edge và Safari đã cho biết có kế hoạch tích hợp tính năng này, trong khi Firefox vẫn chưa xác nhận thời gian phát hành.

Điều quan trọng cần nhớ là trong Chrome, tham số authenticatorAttachment vẫn tiếp tục được tôn trọng cho đến bây giờ. Điều này có nghĩa là ngày nay authenticatorAttachment là yếu tố quyết định, bất kể gợi ý nào được đặt. Tuy nhiên, chúng tôi kỳ vọng rằng trong các phiên bản Chrome tương lai, gợi ý thông tin xác thực khóa công khai sẽ trở thành phương pháp được ưu tiên và duy nhất.

Mặc dù phiên bản Chrome mới nhất hỗ trợ Gợi ý User-agent WebAuthn, những gợi ý này không được Windows 11 và Windows Hello / Windows Security tôn trọng. Lý do cơ bản là giao diện người dùng được kiểm soát bởi chính hệ điều hành (Windows Hello / Windows Security).

Hơn nữa, một passkey được lưu trữ trong Trình quản lý mật khẩu của Google và được đồng bộ hóa với Windows 11, Gợi ý User-agent WebAuthn không được tôn trọng, vì xác thực cục bộ cuối cùng trên Windows 11 xảy ra với Windows Hello / Windows Security. Với việc đồng bộ hóa passkey sắp tới trên Windows 11 qua tài khoản Microsoft, chúng tôi cũng kỳ vọng những cải tiến cho Windows 11 và Gợi ý User-agent WebAuthn.

Trên Windows 10, Gợi ý User-agent WebAuthn lại được tôn trọng, vì giao diện người dùng WebAuthn được xử lý bởi Chrome chứ không phải bởi Windows Hello / Windows Security. Tuy nhiên, trong các thử nghiệm của chúng tôi, chúng tôi không thấy hiệu ứng cho security-key. Khi gợi ý này được đặt, luồng trông giống như luồng cho client-device.

Gợi ý thông tin xác thực khóa công khai WebAuthn (user-agent) mang lại một loạt lợi ích cho cả nhà phát triển và người dùng. Tính năng này vẫn còn mới và chưa được triển khai cho tất cả các trình duyệt và hệ điều hành (tính đến tháng 10 năm 2024).

Điều quan trọng là phải nhận thức được những hạn chế hiện tại đặc biệt đi kèm với Windows 11. Trong Windows 11, giao diện người dùng passkey được xử lý bởi Windows Hello (hộp thoại bảo mật Windows Hello) và điều này hiện đang chi phối sự hỗ trợ của Chrome / Edge cho Gợi ý User-agent WebAuthn. Điều này cũng áp dụng cho passkey được đồng bộ hóa từ Trình quản lý mật khẩu của Google sang Windows (ở đây, các gợi ý cũng chưa có hiệu lực).

Điều này có nghĩa là gợi ý thông tin xác thực khóa công khai WebAuthn thực sự chỉ hoạt động trên macOS và Windows 10 (trong số các hệ điều hành máy tính để bàn chính).

Hơn nữa, tính đến tháng 10 năm 2024, ngay cả khi Chrome / Edge được sử dụng trên các hệ điều hành này, nếu authenticatorAttachment được đặt, thì điều này cũng chi phối các Gợi ý User-agent WebAuthn (như Google đã tuyên bố).

Từ góc độ trường hợp sử dụng, chúng tôi thấy các trường hợp sử dụng được đề xuất sau đây để nhận được nhiều giá trị nhất từ tính năng mới này.

Khi xây dựng backend và trí tuệ passkey của bạn, hãy cố gắng bao gồm việc sử dụng đúng các gợi ý thông tin xác thực khóa công khai để tạo điều kiện thuận lợi cho việc đăng nhập và tiết kiệm cho người dùng những cú nhấp chuột không cần thiết. Ví dụ, nếu hệ thống của bạn phát hiện rằng người dùng đăng nhập trên một thiết bị có khả năng có sẵn một passkey cục bộ, hãy sử dụng gợi ý client-device.

Nếu người dùng truy cập trang web từ một thiết bị mới và trí tuệ passkey của bạn biết rằng một passkey có thể có sẵn trên thiết bị di động của người dùng, hãy đặt gợi ý thành hybrid, để người dùng có thể nhanh chóng quét mã QR và sử dụng passkey hybrid.

Mục tiêu chính ở đây là cung cấp một trải nghiệm người dùng liền mạch và trực quan hơn. Bằng cách hướng dẫn các trình duyệt về những authenticator có khả năng được sử dụng, các nhà phát triển có thể giảm bớt sự nhầm lẫn và rắc rối của người dùng trong quá trình đăng nhập. Thay vì người dùng bị choáng ngợp với các tùy chọn xác thực không cần thiết, các gợi ý cho phép trình duyệt tập trung vào các lựa chọn phù hợp nhất, dẫn đến trải nghiệm nhanh hơn, đơn giản hơn.

Các doanh nghiệp hoặc tổ chức chính phủ có mức độ đảm bảo cao đã tiêu chuẩn hóa việc sử dụng khóa bảo mật phần cứng để xác thực người dùng sẽ thấy các gợi ý thông tin xác thực passkey đặc biệt hữu ích. Bằng cách sử dụng gợi ý security-key, họ có thể đảm bảo rằng các trình duyệt hiển thị nổi bật tùy chọn khóa bảo mật phần cứng.

Điều này đặc biệt hữu ích cho các tổ chức lớn nơi nhân viên đã được cấp khóa bảo mật phần cứng và nơi các phương thức xác thực khác (chẳng hạn như authenticator platform) không được phép. Gợi ý security-key cho phép các doanh nghiệp khóa chặt các luồng xác thực của họ mà không giới hạn sự linh hoạt cho các cải tiến trong tương lai.

Gợi ý hybrid tỏa sáng trong các kịch bản mà xác thực chéo thiết bị và do đó cách tiếp cận ưu tiên thiết bị di động được mong muốn hoặc khi người dùng thường xuyên di chuyển giữa các thiết bị hoặc nền tảng.

Một ví dụ về trường hợp sử dụng này là một ứng dụng hướng đến người tiêu dùng dự đoán hầu hết người dùng sẽ sử dụng điện thoại thông minh của họ để xác thực, thông qua các phương pháp sinh trắc học hoặc các ứng dụng authenticator dựa trên web (passkey ưu tiên di động). Bằng cách chỉ định hybrid làm gợi ý, các nhà phát triển đảm bảo rằng giao diện người dùng của trình duyệt khuyến khích việc sử dụng điện thoại thông minh, cải thiện sự tiện lợi và khả năng truy cập.

Gợi ý thông tin xác thực khóa công khai WebAuthn cung cấp một cách linh hoạt để nâng cao trải nghiệm người dùng trong quá trình xác thực bằng passkey. Hãy cùng xem lại các câu hỏi từ phần giới thiệu với những hiểu biết mà chúng ta đã thu thập được:

1. Gợi ý Thông tin xác thực Khóa công khai WebAuthn là gì?

   Chúng là những đề xuất tùy chọn được cung cấp bởi trang web / ứng dụng để hướng dẫn máy khách về phương thức xác thực có khả năng nhất mà người dùng sẽ sử dụng – cho dù đó là khóa bảo mật phần cứng, authenticator platform hay giải pháp hybrid như xác thực chéo thiết bị.

2. Tại sao chúng ta cần Gợi ý Thông tin xác thực Khóa công khai WebAuthn?

   Chúng hợp lý hóa quy trình xác thực bằng cách thu hẹp các tùy chọn được trình bày cho người dùng, giảm bớt rắc rối / số lần nhấp chuột không cần thiết và cải thiện trải nghiệm tổng thể.

3. Gợi ý Thông tin xác thực Khóa công khai WebAuthn hoạt động như thế nào?

   Các nhà phát triển chỉ định các gợi ý như security-key, client-device, hoặc hybrid dựa trên ngữ cảnh, cho phép các trình duyệt ưu tiên phương thức xác thực phù hợp cho người dùng. Mặc dù những gợi ý này không phải là yêu cầu nghiêm ngặt, chúng giúp tối ưu hóa luồng giao diện người dùng trong quá trình xác thực.

4. Những hạn chế và trường hợp sử dụng được đề xuất là gì?

   Hiện tại, hỗ trợ đầy đủ cho các gợi ý này chỉ giới hạn ở Chrome và Edge, với các trình duyệt và hệ điều hành khác như Windows 11 cho thấy mức độ tương thích khác nhau. Các trường hợp sử dụng hiệu quả nhất bao gồm cải thiện UX đăng nhập, thực thi việc sử dụng khóa bảo mật phần cứng trong môi trường bảo mật cao và cho phép xác thực chéo thiết bị trong các ứng dụng ưu tiên di động.

Kết luận, Gợi ý Thông tin xác thực Khóa công khai WebAuthn cho phép các nhà phát triển tạo ra các quy trình xác thực thân thiện với người dùng và trực quan hơn bằng cách hướng dẫn các trình duyệt đến các tùy chọn phù hợp nhất cho mỗi kịch bản người dùng. Mặc dù vẫn đang phát triển, tính năng này có thể tăng cường đáng kể cả bảo mật và trải nghiệm người dùng trong việc triển khai passkey.