Thymeleaf + webauthn 客户端(浏览器)

问题描述 投票:0回答:1

我正在考虑构建一个 spring-thymeleaf 应用程序,该应用程序支持基于 webauthn 的密钥。

https://github.com/webauthn4j/webauthn4j-spring-security/tree/master/samples显示了使用Java的服务器和使用Angular的客户端。服务器端对我来说很清楚。我想知道的是客户端以及如何用百里香构建前端? 我的示例想法:

<head>
    <!-- Include your JavaScript file -->
    <script th:src="@{/js/webauthn.js}"></script>
</head>
// webauthn.js
function initWebAuthn(challenge, userId, userName, displayName) {
    const createOptions = {
        publicKey: {
            // ... set up your create options using the variables
            challenge: Uint8Array.from(atob(challenge), c => c.charCodeAt(0)),
            user: {
                id: Uint8Array.from(atob(userId), c => c.charCodeAt(0)),
                name: userName,
                displayName: displayName
            },
            // ... other options
        }
    };

    document.getElementById('registerButton').addEventListener('click', function() {
        navigator.credentials.create({ publicKey: createOptions.publicKey })
            .then((credential) => {
                // Process and send the credential to the server
            })
            .catch((error) => {
                console.error(error);
            });
    });
}

这种方法是使用 webauthn 客户端库的有效替代方法吗?或者有没有计划将 webauthn 与 thymeleaf 集成以更方便实施?

thymeleaf spring-thymeleaf
1个回答
0
投票

是的,我最近创建了一个支持 webauthn 的 spring-thymeleaf 应用程序。这正是我所采取的方法。 thymeleaf 页面仅包含 javascript 库,用于处理与浏览器支持的 Web 身份验证 API (WebAuthn) 的通信。在服务器端,我利用了 Yubico FIDO 库。您肯定走在正确的道路上。

© www.soinside.com 2019 - 2024. All rights reserved.