TrustX Appkey Web SDK Guide

Early Access

The Daon Appkey Javascript library provides secure biometric registration and authentication capabilities for web and mobile environments. It offers a simple JavaScript API for implementing user registration and authentication workflows that can be integrated with TrustX API.

This document provides a quick-start installation guide with simple installation instructions to get started using the library.

Note

For biometric registration and authentication flows, it is necessary to add FIDO SDK dependences to the Trust SDK.

CDN/ Script Usage

Before using the Appkey Web SDK, ensure you have the following files in your project:

ixjs_bg.wasm - WebAssembly binary for core functionality
DaonAppkey.v{version}.min.js - Main Daon Appkey library

Usage Example:

// Authentication

const payload = await DaonAppkey.authentication({ appkeyAuthClientRequest, language, translations });

NPM/ REACT Usage

Info

The Appkey Web SDK will be distributed to NPM in a future update. This document will be updated once the NPM distribution is available.

To include the Appkey Web SDK in your project, add the following to your list of dependencies:

// package.json

"dependencies": {

...

"@daon/trustx-appkey": "file:./path/to/DaonAppkey-{version}.tgz"

}

For Android applications, if you are using Typescript, it is also required to add the following:

// index.d.ts

declare module '@daon/trustx-appkey';

Usage Example:

import { registration, authentication } from '@daon/trustx-appkey';

// Registration

const payload = await registration({ appkeyRegClientRequest, language, translations });

// Authentication

const payload = await authentication({ appkeyAuthClientRequest, language, translations, transactionCallback });

REACT Registration Example

import { registration, ELocalization, ETranslationKey } from '@daon/trustx-appkey';

import { useEffect } from 'react';

import './App.css'

function App() {

useEffect(() => {

window.parent.postMessage({ event: 'READY' }, '*')

window.addEventListener('message', async (event) => {

const { sessionData, constants } = event.data.variables

const { language } = constants

const { appkeyRegClientRequest } = sessionData

const translations = {

[ELocalization.EN]: {

[ETranslationKey.REGISTRATION_TITLE]: "New En Title",

[ETranslationKey.REGISTRATION_SUBTITLE]: "New En subTitle",

[ETranslationKey.REGISTRATION_DESCRIPTION]: "New En description",

REACT Authentication Example

import { authentication, ELocalization, ETranslationKey } from '@daon/trustx-appkey';

import { useEffect } from 'react';

import './App.css'

function App() {

const transactionCallback = (text: string) => {

const transactionResponse = window.confirm(`Text from transaction is ${text}`)

return transactionResponse

}