How to Integrate Server-Based Liveness into Your Web Application
This guide outlines the steps for integrating the Oz Liveness Web SDK into a customer web application for capturing facial videos and subsequently analyzing them on a server.
.png?alt=media&token=ffca0d61-2d52-4234-92e3-66f714b0caee)
The SDK implements the ready-to-use face capture user interface that is essential for seamless customer experience and accurate liveness results. Under the hood, it communicates with Oz API.
Oz Liveness Web SDK detects both presentation and injection attacks. An injection attack is an attempt to feed pre-recorded video into the system using a virtual camera.
Finally, while the cloud-based service provides the fully-fledged functionality, we also offer an on-premise version with the same functions but no need for sending any data to our cloud.
We recommend starting with the SaaS mode and then reconnecting your web app to the on-premise Web Adapter and Oz API to ensure seamless integration between your front end and back end. With these guidelines in mind, integrating the Oz Liveness Web SDK into your web application can be a simple and straightforward process.
Tell us domain names of the pages from which you are going to call Web SDK and email for admin access, e.g.:
Domain names from which WebSDK will be called:
Email for admin access: |
In response, you’ll get URLs and credentials for further integration and usage:
Login: [email protected] Password: …
API: https://api.sandbox.ozforensics.com Web Console: https://sandbox.ozforensics.com Web Adapter: https://yourcompany.sandbox.ozforensics.com |
Add the following tags to your HTML code. Use Web Adapter URL received before:
<link rel="stylesheet" href="https://<web-adapter-url>/plugin/ozliveness.css"/>
<script src="https://<web-adapter-url>/plugin_liveness.php?lang=en|es"></script>
Add the code that opens the plugin and handles the results:
OzLiveness.open({
lang: 'en',
action: [
// 'photo_id_front', // request photo ID picture
'video_selfie_blank' // request passive liveness video
],
on_complete: function (result) {
// This callback is invoked when the analysis is complete
console.log('on_complete', result);
}
});
Keep in mind that it is more secure to get your back end responsible for the decision logic. You can find more details including code samples here.
With these steps, you are done with basic integration of Web SDK into your web application. You will be able to access recorded media and analysis results in Web Console via browser or programmatically via API.
- Customizing plugin look-and-feel
- Adding custom language pack
- Tuning plugin behavior
- Plugin parameters and callbacks
- Security recommendations
Please find a sample for Oz Liveness Web SDK here. To make it work, replace
<web-adapter-url> with the Web Adapter URL you've received from us.For Angular and React, replace
https://web-sdk.sandbox.ozforensics.com in index.html.