ASLIRI - COMPREHENSIVE LIVENESS - WEB SDK (React Component)
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 --savesample in App.tsx :
import React, { useEffect, useState } from 'react'
import { CheckAuthentication, ComprehensiveLiveness } from "asliri-comprehensive-liveness-react"
function App() {
interface resultInterface {
score: number,
message: string,
image: string
}
const result = (result:resultInterface) => {
console.log(result.message); // message response
console.log(result.score); // score liveness
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 React, { useEffect, useState } from 'react'
import { CheckAuthentication, ComprehensiveLiveness } from "asliri-comprehensive-liveness-react"
function App() {
const result = (result) => {
console.log(result.message); // message response
console.log(result.score); // score liveness
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.
Note: result score from 0 to 1 (you can manage the score)
Version History
2.0.0
- Result with object {message, score, image}
1.3.0
- Result with object {message, score, image}
1.2.0
- Bug fix something error
- Bug Fix Load ACU component
1.1.0
- Score back to 0 - 1
- Result with object {message, score}
1.0.1
- Change result Score 0 - 1 to 0 - 100
1.0.0
- Initial release