Company logo
  • Empleos
  • Bootcamp
  • Acerca de nosotros
  • Para profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
    • Bootcamp
  • Para empresas
    • Inicio
    • Nuestro proceso
    • Planes
    • Pruebas
    • Nómina
    • Blog
    • Comercial
    • Calculadora

0

50
Vistas
WebAuthn: Can't create public key. Promise is rejected

I am trying to get WebAuthn set up on our login page. I am to the part where I need to make the public key using navigator.credentials.create(). On Chrome, I keep getting the following error: Uncaught (in promise) DOMException: The operation either timed out or was not allowed. See: https://www.w3.org/TR/webauthn-2/#sctn-privacy-considerations-client.

Here is the relevant code:

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
        });
    });
}

Some additional information that may be useful:

  • The server does not yet handle this information, but I don't think that matters since the credentials need to be created before they can be sent
  • Currently testing on https://localhost
  • This is taking place on the login page before the user is logged in. The idea is to prompt the user once they hit submit
5 months ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Firstly, you can test out using virtual authenticator on Chrome, see image below.

enter image description here

On windows, you can setup Windows Hello as authenticator and test that later.

Now some notes for your problem

  1. localhost does not need https
  2. the expected origin specified if using only http, can be http://localhost<:port if not 80>
  3. Need to check the format sent, is it arraybyte or not

I have managed to get it working... You can try and look at my example code and use them, only 2 files

  • Frontend: https://github.com/ais-one/cookbook/blob/develop/js-node/expressjs/public/demo-express/fido.html
  • Express Backend (using fido2-lib): https://github.com/ais-one/cookbook/blob/develop/js-node/expressjs/router/fido.js

I am still cleaning it up to make it to production code (e.g. using JWTs / Sessions when passing info between front and back end.

If you still have problems, we can discuss here... https://github.com/ais-one/cookbook/discussions

5 months ago · Juan Pablo Isaza Denunciar

0

In my case, my supported public key algorithms list was too narrow to support platform authenticator attachment. Now I use this list of algs, and it's working as it should.

{"pubKeyCredParams": [
{
  "type": "public-key",
  "alg": -7
},
{
  "type": "public-key",
  "alg": -8
},
{
  "type": "public-key",
  "alg": -36
},
{
  "type": "public-key",
  "alg": -37
},
{
  "type": "public-key",
  "alg": -38
},
{
  "type": "public-key",
  "alg": -39
},
{
  "type": "public-key",
  "alg": -257
},
{
  "type": "public-key",
  "alg": -258
},
{
  "type": "public-key",
  "alg": -259
}]}
5 months ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos