Các tính năng Client của WebAuthn

WebAuthn là tiêu chuẩn hiện đại đằng sau passkey. Thay vì dựa vào mật khẩu truyền thống, nó tận dụng mật mã hóa khóa công khai, cho phép người dùng xác thực bằng passkey, có thể bao gồm sinh trắc học (như vân tay hoặc nhận dạng khuôn mặt) hoặc khóa bảo mật vật lý. Sự thay đổi này không chỉ tăng cường bảo mật mà còn cải thiện trải nghiệm người dùng bằng cách loại bỏ nhu cầu quản lý mật khẩu.

Tiêu chuẩn WebAuthn Level 3 giới thiệu các tính năng client mới (có thể được truy xuất qua API trình duyệt getClientCapabilities()), nhằm mục đích cung cấp cho các nhà phát triển và nền tảng nhiều quyền kiểm soát và sự linh hoạt hơn khi triển khai passkey. Những cập nhật này mang lại các cải tiến giúp đơn giản hóa quá trình tích hợp passkey trên các thiết bị, trình duyệt và nền tảng, đảm bảo hành trình người dùng mượt mà và nhất quán hơn.

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

1. Các tính năng client của WebAuthn là gì?
2. Có những tính năng client WebAuthn nào?
3. Các tính năng client của WebAuthn cải thiện việc triển khai passkey như thế nào?
4. Tại sao các tính năng client của WebAuthn lại quan trọng đối với cả nhà phát triển và quản lý sản phẩm?

Khi đọc xong, bạn sẽ hiểu cách những tính năng này có thể giúp bạn tạo ra các luồng xác thực liền mạch, an toàn và phù hợp với kỳ vọng của người dùng hiện đại.

Các tính năng client của WebAuthn là một tập hợp các tính năng cho phép trình duyệt và nền tảng thông báo về các loại chức năng WebAuthn mà chúng hỗ trợ. Nói một cách đơn giản, chúng hoạt động giống như một "danh sách kiểm tra tính năng" cho phép các trang web biết những phương thức và cài đặt xác thực nào có sẵn trên thiết bị của người dùng. Điều này cho phép các nhà phát triển tùy chỉnh luồng xác thực dựa trên khả năng của client, đảm bảo trải nghiệm người dùng mượt mà và an toàn hơn.

Ví dụ, nếu một trình duyệt báo hiệu rằng nó hỗ trợ xác thực sinh trắc học (như Touch ID), các nhà phát triển có thể thiết kế luồng đăng nhập của họ để cung cấp cho người dùng tùy chọn đăng nhập bằng vân tay. Ngược lại, nếu trình duyệt không hỗ trợ một số tính năng nhất định, các nhà phát triển có thể cung cấp các tùy chọn dự phòng, như mật khẩu hoặc SMS OTP.

Tiêu chuẩn WebAuthn Level 3 giới thiệu một số tính năng client mới giúp việc triển khai passkey trở nên linh hoạt và thân thiện với người dùng hơn. Hỗ trợ đầu tiên cho lệnh gọi API getClientCapabilities() đã được giới thiệu trong Safari 17.4.

Để phát hiện hỗ trợ trong trình duyệt, đoạn mã sau có thể hữu ích:

// Check if PublicKeyCredential is supported in the current browser
if (typeof PublicKeyCredential === "undefined") {
    console.log("PublicKeyCredential is not supported in this browser.");
}
 
// Check if getClientCapabilities method exists on PublicKeyCredential
if (typeof PublicKeyCredential.getClientCapabilities === "function") {
    try {
        let capabilities = await PublicKeyCredential.getClientCapabilities();
        console.log(capabilities);
    } catch (error) {
        console.error("Error getting client capabilities:", error);
    }
} else {
    console.log("getClientCapabilities is not supported in this browser");
}

getClientCapabilities() cho phép các trang web và ứng dụng truy vấn client (ví dụ: trình duyệt hoặc thiết bị) để xác định những tính năng WebAuthn nào nó hỗ trợ. Bằng cách hiểu các khả năng của client, các nhà phát triển có thể tối ưu hóa các luồng xác thực để tận dụng các tính năng có sẵn, như xác thực sinh trắc học, và cung cấp các phương thức thay thế nếu một số khả năng không có.

Subscribe to our Passkeys Substack for the latest news.

Subscribe

Đây là cái nhìn sâu hơn về các tính năng client của WebAuthn và cách chúng tác động đến việc tích hợp passkey:

conditionalCreate cho phép tạo passkey tự động dựa trên các điều kiện cụ thể. Một ứng dụng có thể sử dụng khả năng này để tự động tạo passkey trong quá trình tự động điền mật khẩu nếu trình quản lý mật khẩu có hỗ trợ tương ứng. Tính năng này giúp thúc đẩy việc áp dụng passkey và việc sử dụng sau đó bằng cách tự động chuyển người dùng từ mật khẩu sang passkey.

Tương tự như conditionalCreate, conditionalGet kích hoạt đăng nhập bằng passkey một cách tự động. Điều này hữu ích trong các tình huống cần kích hoạt trải nghiệm người dùng passkey tốt nhất, làm cho việc đăng nhập không chỉ không cần mật khẩu mà còn không cần tên người dùng (người dùng chỉ cần nhấp vào passkey đã chọn trong một cửa sổ modal / danh sách thả xuống và có thể xác thực). Bằng cách sử dụng khả năng này, các nhà phát triển có thể đảm bảo xác thực bằng passkey chỉ xảy ra khi thích hợp, giảm thiểu các lời nhắc không cần thiết và nâng cao trải nghiệm người dùng.

hybridTransport đảm bảo rằng passkey có thể được sử dụng trên các thiết bị khác nhau, cho phép xác thực chéo thiết bị liền mạch (qua mã QR và Bluetooth). Ví dụ, một người dùng có thể sử dụng passkey được lưu trữ trên điện thoại thông minh của họ để đăng nhập vào một dịch vụ trên máy tính để bàn. Khả năng này cho phép người dùng xác thực một cách an toàn mà không cần phải chuyển passkey thủ công hoặc dựa vào các phương thức đăng nhập thông thường cho mỗi thiết bị, thúc đẩy một trải nghiệm xác thực thống nhất.

Các trình xác thực nền tảng, như Windows Hello, Face ID hoặc Touch ID, được tích hợp trực tiếp vào thiết bị và cung cấp trải nghiệm passkey nhanh hơn, mượt mà hơn và an toàn hơn bằng cách cho phép người dùng xác thực bằng sinh trắc học hoặc phương thức gốc khác của thiết bị (ví dụ: hình mở khóa PIN).

Become part of our Passkeys Community for updates & support.

Join

userVerifyingPlatformAuthenticator đảm bảo rằng xác thực bằng passkey bao gồm xác minh người dùng, chẳng hạn như quét vân tay hoặc nhận dạng khuôn mặt chủ động, cung cấp một lớp bảo mật bổ sung.

Tính năng relatedOrigins cho phép xác thực liền mạch trên các tên miền khác nhau thuộc sở hữu của cùng một tổ chức (ví dụ: amazon.com và amazon.de). Ví dụ, nếu một công ty quản lý nhiều tên miền hoặc có các tên miền phụ khác nhau, người dùng có thể đăng nhập một lần và truy cập tất cả các tài sản mà không cần xác thực lại trên mỗi tên miền. Khả năng này hợp lý hóa trải nghiệm người dùng, giảm bớt sự phiền toái và đặc biệt có giá trị đối với các doanh nghiệp trong môi trường quốc tế hoặc có các nền tảng đa dịch vụ.

Phương thức signalAllAcceptedCredentials(options) cung cấp danh sách đầy đủ các ID thông tin xác thực WebAuthn cho một người dùng nhất định. Các Bên tin cậy (Relying Party) của WebAuthn nên sử dụng phương thức này thay vì signalUnknownCredential() khi người dùng đã được xác thực, vì không có nguy cơ rò rỉ quyền riêng tư. Phương thức này cung cấp một cái nhìn tổng quan toàn diện về các thông tin xác thực khóa công khai của người dùng, bao gồm bất kỳ thay đổi gần đây nào có thể chưa được cập nhật trên các trình xác thực hiện đang kết nối.

Hãy xem một ví dụ. Một người dùng (userId: A) có 2 passkey với ID thông tin xác thực được mã hóa Base64URL thành X và Y. Sau đó, người dùng xóa passkey X trong cài đặt tài khoản của dịch vụ web (example.com) (vì vậy khóa công khai bị xóa). Bây giờ, hãy chạy đoạn mã sau:

PublicKeyCredential.signalAllAcceptedCredentials({
    rpId: "example.com",
    userId: "A", // WebAuthn User Handle, Base64URL.
    allAcceptedCredentialIds: ["Y"],
});

Nếu trình xác thực có sẵn tại thời điểm thực thi đoạn mã trên, thì trình xác thực sẽ xóa hoặc ẩn passkey X khỏi các quy trình xác thực trong tương lai. Tuy nhiên, trình xác thực có thể không được gắn vào tại thời điểm thực thi, vì vậy các bên tin cậy nên thực thi mã này định kỳ, ví dụ như mỗi lần đăng nhập.

Các passkey không có trong allAcceptedCredentialIds sẽ bị xóa hoặc ẩn, có thể không thể khôi phục được. Vì vậy, điều quan trọng là các bên tin cậy phải chú ý rằng các ID thông tin xác thực WebAuthn hợp lệ không bao giờ bị xóa khỏi danh sách. Nếu một ID thông tin xác thực hợp lệ vô tình bị xóa, thì bên tin cậy nên ngay lập tức đưa nó vào một lệnh gọi signalAllAcceptedCredentials(options) khác càng sớm càng tốt để "hiển thị lại" passkey. Nếu passkey bị xóa chứ không phải bị ẩn, thì không có nhiều cách để khắc phục.

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

Try for Free

Phương thức signalCurrentUserDetails(options) báo hiệu tên hiện tại và Tên hiển thị WebAuthn của người dùng. Khi signalCurrentUserDetails(options) được gọi, client sẽ tuân theo một tập hợp các bước đã xác định để thực hiện hành động này.

Hãy xem một ví dụ. Một người dùng có User ID WebAuthn là A cập nhật tên của họ trong cài đặt tài khoản của một trang web (example.com). Sau đó, bên tin cậy có thể chạy đoạn mã sau:

PublicKeyCredential.signalCurrentUserDetails({
    rpId: "example.com",
    userId: "A", // user ID, Base64URL.
    name: "New user name",
    displayName: "New display name",
});

Trình xác thực sau đó sẽ cập nhật siêu dữ liệu của passkey được lưu cục bộ. Lợi ích lớn là trong các yêu cầu Conditional UI / tự động điền passkey trong tương lai, menu lựa chọn / danh sách thả xuống của Conditional UI sẽ hiển thị tên và Tên hiển thị WebAuthn đã được cập nhật.

Phương thức signalUnknownCredential(options) báo hiệu rằng một ID thông tin xác thực WebAuthn không được Bên tin cậy (Relying Party) của WebAuthn nhận dạng, ví dụ, nếu passkey đã bị người dùng xóa. Không giống như signalAllAcceptedCredentials(options), phương thức này không yêu cầu cung cấp danh sách đầy đủ các ID thông tin xác thực được chấp nhận và User Handle WebAuthn, do đó ngăn chặn rò rỉ quyền riêng tư tiềm ẩn cho những người gọi chưa được xác thực.

Hãy xem một ví dụ. Một người dùng xóa một passkey có ID thông tin xác thực X trên cài đặt tài khoản của một trang web (example.com) (vì vậy khóa công khai bị xóa). Tuy nhiên, khóa riêng tư vẫn có sẵn trên thiết bị của người dùng. Điều này có nghĩa là trong các yêu cầu đăng nhập Conditional UI / tự động điền passkey trong tương lai (với danh sách allowCredentials trống), passkey vẫn có thể được chọn. Tuy nhiên, nỗ lực đăng nhập sẽ thất bại, vì khóa công khai đã bị xóa, vì vậy bên tin cậy nên chạy:

PublicKeyCredential.signalUnknownCredential({
    rpId: "example.com",
    credentialId: "X", // credential ID the user just tried, Base64URL
});

Trình xác thực sau đó sẽ xóa hoặc ẩn passkey có ID thông tin xác thực X khỏi các quy trình xác thực trong tương lai.

Vì tiêu chuẩn WebAuthn Level 3 vẫn đang ở trạng thái dự thảo, việc áp dụng các tính năng client mới này chưa hoàn toàn phổ biến. Các trình duyệt khác nhau đã dần dần triển khai các tính năng này, nhưng sự hỗ trợ có sự khác biệt. Dưới đây là tổng quan cập nhật về tính khả dụng trên các trình duyệt chính được tham chiếu ở trên:

Tốc độ áp dụng có thể sẽ tăng nhanh khi Level 3 trưởng thành và nhiều trình duyệt hơn phát hành các tính năng này. Nếu bạn muốn xem có bao nhiêu người dùng có thể tận dụng getClientCapabilities() ngay bây giờ, bạn có thể kiểm tra dữ liệu thực tế bằng Passkeys Analyzer miễn phí. Hãy theo dõi ghi chú phát hành của trình duyệt và tài liệu liên quan để lên kế hoạch cho khả năng tương thích rộng hơn khi nó phát triển.

Are your users passkey-ready?

Test Passkey-Readiness

Là một nhà phát triển, bạn có thể tự hỏi việc phát hiện các tính năng client mới của WebAuthn này có ý nghĩa gì đối với bạn và bạn nên sử dụng chúng trong ứng dụng của mình như thế nào. Dưới đây, bạn sẽ tìm thấy các khuyến nghị để sử dụng chúng.

Tuy nhiên, hãy lưu ý rằng không phải tất cả các trình duyệt đều đã hỗ trợ lệnh gọi API getClientCapabilities() (tính đến tháng 11 năm 2024). Có một polyfill có sẵn tại đây, có thể được sử dụng cho đến khi tất cả các trình duyệt bắt kịp.

Sử dụng getClientCapabilities() sớm trong mã của bạn để phát hiện các tính năng được hỗ trợ của client ngay từ đầu khi tải trang / luồng xác thực. Điều này sẽ cho phép bạn tùy chỉnh trải nghiệm một cách linh hoạt và cung cấp các tính năng passkey hoạt động trên thiết bị / trình duyệt, ví dụ: thúc đẩy xác thực nền tảng khi được hỗ trợ hoặc cung cấp các phương thức thay thế (ví dụ: SMS OTP hoặc khóa bảo mật phần cứng) nếu không.

Nếu bạn thêm passkey vào một trang web / ứng dụng hiện đang sử dụng mật khẩu, tính năng conditionalCreate có thể là một động lực thực sự cho việc áp dụng passkey của bạn. Trong nền, trong quá trình tự động điền mật khẩu với một trình quản lý thông tin xác thực phù hợp (chỉ có Apple Passwords tính đến tháng 10 năm 2024), một passkey sẽ được tạo tự động và sẽ được ưu tiên trong các lần tự động điền trong tương lai.

Để không chỉ có tỷ lệ áp dụng passkey cao, mà còn có tỷ lệ sử dụng đăng nhập bằng passkey cao, hãy thử kiểm tra xem thiết bị / trình duyệt có thể sử dụng Conditional UI / Tự động điền Passkey bằng cách kiểm tra conditionalGet hay không. Bằng cách này, bạn sẽ khuyến khích người dùng sử dụng passkey đã tạo để đăng nhập, vì nó được hệ điều hành / trình duyệt chủ động đề xuất và đòi hỏi ít nỗ lực hơn cả việc tự động điền mật khẩu.

Tận dụng hybridTransport để cho phép xác thực chéo thiết bị (qua mã QR và Bluetooth), cho phép người dùng đăng nhập liền mạch từ điện thoại thông minh của họ, ngay cả khi họ đang truy cập dịch vụ của bạn trên máy tính để bàn.

Các tính năng client của WebAuthn đại diện cho một bước tiến quan trọng trong việc giải quyết các khoảng trống hiện có của passkey. Trong bài viết này, chúng ta đã giải quyết các câu hỏi chính về các tính năng client của WebAuthn:

1. Các tính năng client của WebAuthn là gì? Chúng ta đã giải thích cách các tính năng này cho phép trình duyệt và nền tảng báo hiệu sự hỗ trợ của chúng đối với các chức năng cụ thể, giúp các nhà phát triển kiểm soát nhiều hơn các luồng xác thực.
2. Có những tính năng client WebAuthn nào? Chúng ta đã cung cấp một cái nhìn tổng quan về các tính năng mới được giới thiệu trong tiêu chuẩn Level 3, bao gồm getClientCapabilities, conditionalCreate, hybridTransport, và nhiều hơn nữa.
3. Các tính năng client của WebAuthn cải thiện việc triển khai passkey như thế nào? Chúng ta đã thảo luận về cách các tính năng này hợp lý hóa việc tích hợp, tăng cường sử dụng chéo thiết bị và cải thiện bảo mật.
4. Tại sao các tính năng client của WebAuthn lại quan trọng đối với các nhà phát triển? Những tính năng này giúp tạo ra các trải nghiệm xác thực liền mạch, an toàn, phù hợp với kỳ vọng của người dùng hiện đại, giúp việc triển khai trở nên dễ dàng và hiệu quả hơn.

Chúng tôi khuyến khích bạn khám phá các tính năng mới của WebAuthn Level 3 và cập nhật về việc áp dụng chúng trên các trình duyệt. Nếu bạn đang tìm cách triển khai passkey và tận dụng các khả năng nâng cao này, hãy liên hệ với chúng tôi để được hướng dẫn và hỗ trợ chuyên môn.