javascript - WebAuthn:无法创建公钥。 promise 被拒绝

标签 javascript authentication web webauthn

我正在尝试在我们的登录页面上设置 WebAuthn。我现在需要使用 navigator.credentials.create() 创建公钥。在 Chrome 上,我不断收到以下错误:Uncaught (in promise) DOMException: The operation either timed out or was not allowed.请参阅:https://www.w3.org/TR/webauthn-2/#sctn-privacy-considerations-client。

相关代码如下:

if (isAvailable) {
    // Get challenge from server
    fetch("WebAuthn/WebAuthn.ashx", {
        method: "POST"
    })
    .then(res => res.json())
    .then(res => {
        const publicKeyCredentialCreationOptions = {
            challenge: Uint8Array.from(
                res.data, c => c.charCodeAt(0)),
            rp: {
                id: "localhost",
                name: "Company Name"
            },
            authenticatorSelection: {
                authenticatorAttachment: "platform",
                userVerification: "discouraged"
            },
            pubKeyCredParams: [{alg: -7, type: "public-key"}],
            user: {
                id: Uint8Array.from(
                    "UZSL85T9AFC", c => c.charCodeAt(0)),
                displayName: "User",
                name: document.getElementById("tbUser").value // taken from aspx form
            }
        };

        const credential = navigator.credentials.create({
            publicKey: publicKeyCredentialCreationOptions
        });
    });
}

一些可能有用的附加信息:

  • 服务器尚未处理此信息,但我认为这无关紧要,因为需要在发送之前创建凭据
  • 目前正在 https://localhost 上测试
  • 这发生在用户登录之前的登录页面上。想法是在用户点击提交后提示用户

最佳答案

首先,您可以在 Chrome 上使用虚拟身份验证器进行测试,请参见下图。

enter image description here

在 Windows 上,您可以将 Windows Hello 设置为身份验证器并稍后进行测试。

现在针对您的问题做一些说明

  1. localhost 不需要 https
  2. 如果仅使用 http,则指定预期来源,如果不是 80,则可以是 http://localhost<:port>
  3. 需要检查发送的格式,是不是arraybyte

我已经设法让它工作了...您可以尝试查看我的示例代码并使用它们,只有 2 个文件

我仍在清理它以使其成为生产代码(例如,在前端和后端之间传递信息时使用 JWT/ session 。

如果还有问题,我们可以在这里讨论... https://github.com/ais-one/cookbook/discussions

关于javascript - WebAuthn:无法创建公钥。 promise 被拒绝,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68775598/

相关文章:

azure - Azure Active Directory B2C 是否有 REST Api?

javascript - &lt;/script&gt; 标签放置在错误的位置

.htaccess - 允许使用 htaccess 文件使用多个 IP 地址进行管理员登录

javascript - Electron 文件结构和构建应用程序

javascript - 嵌套对象引用有简写吗?

javascript - Handlebars.js 无法读取未定义的属性 'hash'

html - 登录表单已更改,用户名已更改为电子邮件,自动完成功能不断输入已保存的电子邮件

javascript - 无法在三元的第二个操作数中使用 `return`

php - 通过 PHP 和 SOAP 对 Sharepoint/Office356 进行身份验证(声明)

database - 在 IndexedDB 中强制更新