Как зарегистрировать учетные данные клиента Webauthn в браузере Keepass Altike Authenticator ⇐ Javascript

[Anonymous]

Веб -сайт webauthn.io демонстрирует регистрацию и аутентификацию WebAuthn. В моем случае учетные данные хранятся в менеджере паролей (Enpass). Ссылка между менеджером паролей и браузером выполняется через плагин в моем браузере. Запуск этого кода запускает всплывающее окно с просьбой вставить ключ USB, тогда как я ожидал всплывающего окна с просьбой отпечатка пальца вместе с всплывающим окном плагина диспетчера паролей. < /P>

Код: Выделить всё

click
Console
empty


bouton = document.getElementById("my_button");
console = document.getElementById("console");
console.innerHTML = "Console initialised";
bouton.addEventListener("click", myFunction);
// help at : https://stackoverflow.blog/2022/11/16/biometric-authentication-for-web-devs/
// demo : https://github.com/duo-labs/webauthn.io
// atelier : https://developers.google.com/codelabs/webauthn-reauth?hl=fr#0

async function myFunction () {
const srvchallenge = new Uint8Array(20);
const id_buffer = new Uint8Array(5);
id_buffer[0] = 0;
id_buffer[1] = 1;
id_buffer[2] = 2;
id_buffer[3] = 3;
id_buffer[4] = 4;
for(let i = 0; i < 20; i++) {
srvchallenge[i] = Math.floor(Math.random() * (Math.pow(2,8)-1));
}
options = {
publicKey: {
attestation: "none",
challenge: srvchallenge,
pubKeyCredParams: [{alg:-8, type : "public-key"},{alg:-7, type:"public-key"},{alg:-257, type : "public-key"}],
rp : { name : "test.home", id : "test.home"},
timeout : 6000,
user: {displayName: "Tonio", id : id_buffer, name: "Tonio8924"},
hints : [],
extensions: { "credProps" : true},
authenticatorSelection : {
"requireResidentKey": false,
"residentKey" : "preferred",
"userVerification": "preferred"
}
},
};
try {
const capabilities = await PublicKeyCredential.getClientCapabilities();
for (const [key, value] of Object.entries(capabilities)) {
console.innerHTML = console.innerHTML + "
" + key + " " + value;
}
const creds = await navigator.credentials.create(options);
if (creds == null)
{
console.innerHTML = "Cannot create credentials";
}
else
{
console.innerHTML = "credential create done.
";
console.innerHTML += "Authenticator attachement : " + creds.authenticatorAttachement + "
";
console.innerHTML += creds.toJSON();
}
}
catch (error) {
console.innerHTML = error;
}
if (creds == null) {
console.innerHTML = "no password credentials available";
}
else {
console.innerHTML = creds.id + " " + creds.type;
}
};

отладка webauthn.io javaScript, я понял что -то было сделано для правильной обработки API api api WebAuthn reception под плагином диспетчера паролей в браузере. Я слегка (и не совсем понимал проблемы) изменил свой сценарий, зарегистрировав аборт в структуру параметров , как ниже:






click
Console
empty


bouton = document.getElementById("my_button");
console = document.getElementById("console");
console.innerHTML = "Console initialised";
bouton.addEventListener("click", myFunction);
// help at : https://stackoverflow.blog/2022/11/16/b ... -web-devs/
// demo : https://github.com/duo-labs/webauthn.io
// atelier : https://developers.google.com/codelabs/ ... th?hl=fr#0
class s extends Error {
constructor({message: e, code: t, cause: r, name: n}) {
super(e, {
cause: r
}),
Object.defineProperty(this, "code", {
enumerable: !0,
configurable: !0,
writable: !0,
value: void 0
}),
this.name = n ?? r.name,
this.code = t
}
}

const c = new class {
constructor() {
Object.defineProperty(this, "controller", {
enumerable: !0,
configurable: !0,
writable: !0,
value: void 0
})
}
createNewAbortSignal() {
if (this.controller) {
const e = new Error("Cancelling existing WebAuthn API call for new one");
e.name = "AbortError",
this.controller.abort(e)
}
const e = new AbortController;
return this.controller = e,
e.signal
}
cancelCeremony() {
if (this.controller) {
const e = new Error("Manually cancelling existing WebAuthn API call");
e.name = "AbortError",
this.controller.abort(e),
this.controller = void 0
}
}
};
async function myFunction () {
const srvchallenge = new Uint8Array(20);
const id_buffer = new Uint8Array(5);
id_buffer[0] = 0;
id_buffer[1] = 1;
id_buffer[2] = 2;
id_buffer[3] = 3;
id_buffer[4] = 4;
for(let i = 0; i < 20; i++) {
srvchallenge = Math.floor(Math.random() * (Math.pow(2,8)-1));
}
options = {
publicKey: {
attestation: "none",
challenge: srvchallenge,
pubKeyCredParams: [{alg:-8, type : "public-key"},{alg:-7, type:"public-key"},{alg:-257, type : "public-key"}],
rp : { name : "test.home", id : "test.home"},
timeout : 6000,
user: {displayName: "Tonio", id : id_buffer, name: "Tonio8924"},
hints : [],
extensions: { "credProps" : true},
authenticatorSelection : {
"requireResidentKey": false,
"residentKey" : "preferred",
"userVerification": "preferred"
}
},
};
options.signal = c.createNewAbortSignal();
try {
const capabilities = await PublicKeyCredential.getClientCapabilities();
for (const [key, value] of Object.entries(capabilities)) {
console.innerHTML = console.innerHTML + "
" + key + " " + value;
}
const creds = await navigator.credentials.create(options);
if (creds == null)
{
console.innerHTML = "Cannot create credentials";
}
else
{
console.innerHTML = "credential create done.
";
console.innerHTML += "Authenticator attachement : " + creds.authenticatorAttachement + "
";
console.innerHTML += creds.toJSON();
}
}
catch (error) {
console.innerHTML = error;
}
if (creds == null) {
console.innerHTML = "no password credentials available";
}
else {
console.innerHTML = creds.id + " " + creds.type;
}
};



< /code>
Это действительно прогресс, потому что всплывающее окно просит отпечаток пальца вместо ключа USB. Плагин менеджера паролей не всплывает, и когда я предоставляю свой отпечаток пальца, ничто не зарегистрировано в менеджере паролей, ни другое.>

Подробнее здесь: https://stackoverflow.com/questions/796 ... ke-authent