Browser: Authentication

Authenticate an existing Passkey with the Service.

Who is this for?

• dApps logging back into the service without connecting to another client
• Browser Wallets that want to communicate with other clients

Client

Sign in with an existing account using an instance of the SignalClient

app.ts

await client.assertion(
    credentialId, // Some known credential ID
    {requestId: 12345} // Optional requestId to link
)

Stateless

Using the stateless method without a SignalClient

app.ts

import {assertion} from '@algorandfoundation/liquid-auth/assertion'
await assertion(
  "https://my-liquid-service.com",
  credentialId, // Some known credential ID
  {requestId: 12345} // Optional requestId to link
)

Manual

If you want to manually handle the process of creating a passkey, you can use the following methods and preforming the three steps of the process.

🧮 Options

Manually fetching the Options from the service.

import {fetchAssertionRequestOptions} from '@algorandfoundation/liquid-client/assertion'

const encodedOptions = await fetchAssertionRequestOptions("https://my-liquid-service.com", "<KNOWN_CREDENTIAL_ID>")

🎉 Retrieving

Decode the options and fetch the Passkey.

import {fromBase64Url} from "@algorandfoundation/liquid-client/encoding";
const options = { ...encodedOptions };
// Challenge from the service
options.challenge = fromBase64Url(options.challenge);
// Decode any known credentials
if (options.allowCredentials) {
  for (const cred of options.allowCredentials) {
    cred.id = fromBase64Url(cred.id);
  }
}
const credential = navigator.credentials.get({
  publicKey: options
})

🔐 Liquid Extension

Optionally, Authenticate a remote user with the Liquid Extension.

credential.clientExtensionResults = {
    // Optionally authenticate a remote peer
    requestId: "<UUID_FROM_QR_CODE>"
}

🚚 Response

Encode and submit the passkey to the service.

import {fetchAssertionResponse} from '@algorandfoundation/liquid-client/assertion'
import {toBase64URL} from '@algorandfoundation/liquid-client/encoding'

const result = await fetchAssertionResponse("https://my-liquid-service.com", {
  id: credential.id,
  type: credential.type,
  rawId: toBase64URL(credential.rawId),
  clientExtensionResults: credential.clientExtensionResults,
  response: Object.keys(AuthenticatorAssertionResponse.prototype).reduce((prev, curr) => {
    prev[curr] = toBase64URL(credential.response[curr]);
    return prev;
  }, {
    clientDataJSON: toBase64URL(credential.response.clientDataJSON),
  }),
})