How to retrieve a symmetric key using Webauthn/CTAP HMAC-Secret extension in a web browser?

Question

I am trying to leverage the CTAP hmac-secret extension to retrieve a key for symmetric encryption in a web browser. I have Yubikey5 which implements this extension. I read through the CTAP specs, but I cannot find a reference how to do it once I get the assertion data.

Here's my simplified code:

var getCredentialDefaultArgs = {
  publicKey: {
    timeout: 60000,
    allowCredentials: myCredentials,
    challenge: myUint8Array,
    extensions: {
      hmacGetSecret: {
        salt1: "01234567890ABCDEF"
      }
    }
  }
}

navigator.credentials.get(getCredentialDefaultArgs)
.then((assertion) => {
  console.log("assertion", assertion.response.authenticatorData);
  // How do I get my symmetric secret from the authenticatorData ?
  // log just shows: ArrayBuffer(37) {byteLength: 37}
})
.catch((err) => {
  console.log("assertion error", err);
});

I have not been able to find a single working example in JavaScript that would utilize this feature in a web browser.

Answer 1

This extension is currently reserved only for platforms. WebAuthn does not have access to it. Might change in future.

Answer 2

I also wish there was a way to store a secret alongside a WebAuthn credential. :/

Adding to @ackermann-yuriy 's answer: The links I've found RE blocked support for this extension:

• https://bugs.chromium.org/p/chromium/issues/detail?id=1023225
• https://chromestatus.com/feature/5138422207348736
• https://groups.google.com/a/fidoalliance.org/g/fido-dev/c/tosNJvfjMBM?pli=1

Right now (early 2022), the Large Blob Extension seems like the best approach for storing a secret in the authenticator associated with the credential. The good new is that it's shipping in Chromium. The bad news is that it's behind a flag and not yet implemented in Firefox or Safari.