ASLIRI - COMPREHENSIVE LIVENESS - WEB SDK (React Component) (Beta Version)

This SDK for POC or testing integration development

Description

You can verification face and eye with comprehensive liveness by ASLIRI. The SDK support for ReactJS / NextJS

Check out the SDK for a simplified integration.

1. Copy wasm folder to public directory

• wasm folder provided by ASLIRI
• copy to projectname/public/copyhere...

2. Get your token with ASLIRI Team

3. Install Library via NPM

npm i asliri-comprehensive-liveness-react-beta --save

sample in App.tsx :

import { useEffect, useState } from 'react'

import { CheckAuthentication, ComprehensiveLiveness } from "asliri-comprehensive-liveness-react-beta"

function App() {

  const result = (result:any) => {
    console.log(result.score); // score liveness
    console.log(result.message); // message response 
    console.log(result.image); // image base64
  };

  const handleError = (err: string) => {
    console.log({ err });
  };

  const [auth, setAuth] = useState("");
  const [apiCalled, setApiCalled] = useState(false);

  const getAuth = async () => {
    const getAuthenticationResult = await CheckAuthentication(
      "provided by ASLIRI"
    );
    setAuth(getAuthenticationResult);

    console.log({ getAuthenticationResult });
  };

  useEffect(() => {
    setApiCalled(true);
  }, []);

  useEffect(() => {
    if (apiCalled) {
      getAuth();
    }
  }, [apiCalled]);

  return (
    <>
      <div>
        <ComprehensiveLiveness
          getAuthentication={auth}
          getResult={result}
          handleError={handleError}
        ></ComprehensiveLiveness>
      </div>
    </>
  );
}

export default App

sample in App.js :

import { useEffect, useState } from 'react'

import { CheckAuthentication, ComprehensiveLiveness } from "asliri-comprehensive-liveness-react-beta"

function App() {

  const result = (result) => {
    console.log(result.score); // score liveness
    console.log(result.message); // message response 
    console.log(result.image); // image base64
  };

  const handleError = (err) => {
    console.log({ err });
  };

  const [auth, setAuth] = useState("");
  const [apiCalled, setApiCalled] = useState(false);

  const getAuth = async () => {
    const getAuthenticationResult = await CheckAuthentication(
      "provided by ASLIRI"
    );
    setAuth(getAuthenticationResult);

    console.log({ getAuthenticationResult });
  };

  useEffect(() => {
    setApiCalled(true);
  }, []);

  useEffect(() => {
    if (apiCalled) {
      getAuth();
    }
  }, [apiCalled]);

  return (
    <>
      <div>
        <ComprehensiveLiveness
          getAuthentication={auth}
          getResult={result}
          handleError={handleError}
        ></ComprehensiveLiveness>
      </div>
    </>
  );
}

export default App

Thank you.

Version History

0.0.6

• Update component

0.0.5

• Result with object {message, score, image}

0.0.4

• Bugfix something error

0.0.3

• Result with object {message, score}

0.0.2

• Bug Fix Load ACU component

0.0.1

• Initial release