Yo use FIDOw keys in web browsers, we have to use the FIDO2 Web Authentication (WebAuthn) API. WebAuthn is a set of standards and APIs that allows the browser to communicate with the operating system and deal with using cryptographic keys. WebAuthn falls under FIDO2 standards, but it was developed by the W3C.

We use a client-side JavaScript library called "webauth-json" that serves as a convenience wrapper for the WebAuthn API by encoding binary data using base64url. 

https://github.com/github/webauthn-json

This article demonstrates how to use the webauth-json JavaScript library and DualShield API to register a FIDO2 key in a web browser. 

Import WebAuth-Jason

To use the webauth-jason, you need to install it first

npm install --save @github/webauthn-json

Install WebAuth-Jason

Then, you need to import it

import { create, CredentialCreationOptionsJSON, CredentialRequestOptionsJSON, get, PublicKeyCredentialWithAssertionJSON } from '@github/webauthn-json';

Create Objects

We need to create 3 objects, fidoObj, CredentialCreationOptionsJSON, and CredentialRequestOptionsJSON

fidoObj = {
    manufacturerCode: "DN",
    productCode: "FIDO2",
    method: "FIDO2"
  };

  credentialCreateOptions: CredentialCreationOptionsJSON = {
    publicKey: {
      rp: {
        name: ""
      },
      user: {
        name: "",
        displayName: "",
        id: ""
      },
      challenge: "",
      pubKeyCredParams: [],
      timeout: 0,
      excludeCredentials: [],
      authenticatorSelection: {userVerification: "discouraged"},
      attestation: "none",
    }
  };

  credentialRequestOptions: CredentialRequestOptionsJSON = {
    publicKey: {
      challenge: "",
      extensions:{
        appid:""
      },

    allowCredentials: [],
    userVerification: "discouraged"
    }
  };