Skip to main content

Create the credential

To create a new credential, your application frontend has to pass the credentialCreationOptions to the browser through the Web Authentication API.

We use the FIDO2 JavaScript client to accomplish this.

First include the fido2-client.js as a script in your HTML:

<!-- Replace $instance_id with your instance ID -->
<script src="https://<instance-id>.mauth.nevis.cloud/fido2-client/fido2-client.js"></script>
Content Security Policy

If your web application has Content Security Policy (CSP) enabled, the FIDO2 client needs the following attributes to be added or extended to work:

AttributeComment
script-src https://<instance-id>.mauth.nevis.cloud/Needed for fido2-client.js to be loaded.
connect-src https://<instance-id>.mauth.nevis.cloud/_app/Needed for the FIDO2 client calls the Authentication Cloud REST API.

Include the fido2-client.js on your page to set the nevis.auth.fido2 global variable.

To create a new credential, the FIDO2 JavaScript client needs the following parameters:

  • credentialCreationOptions
  • statusToken
  • authenticatorName

The authenticatorName parameter is optional, and describes the authenticator for the user, and also possibly for your customer service team when managing the authenticators for the users.

// Create the options object with the above parameters.
const registerOptions = {
credentialCreationOptions,
statusToken,
authenticatorName: 'Chrome on work Samsung S21',
};

// Call the register function with the options object.
const result = await nevis.auth.fido2.register(registerOptions);

A native browser dialog prompts the user to perform an authorization gesture. The dialog prompts differ depending on the available and connected authenticators. Once a user has given consent by performing the gesture, the authenticator generates a public and private credential key pair, and returns the public key as part of the response.

The FIDO2 JavaScript client then sends the public key to the Authentication Cloud API to finalize the registration.

Once the process is complete, the result of the transaction is returned in a Promise, regardless of the success or failure of the registration process.