Skip to content

Commit d41ca36

Browse files
added 11.6.0
1 parent 9a53875 commit d41ca36

16 files changed

+909
-2670
lines changed

SimpleHTMLApp/README.md

Lines changed: 119 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
# Acuant JavaScript Web SDK v11.5.1
1+
# Acuant JavaScript Web SDK v11.6.0
22

3-
**November 2021**
3+
**March 2022**
44

55
See [https://github.com/Acuant/JavascriptWebSDKV11/releases](https://github.com/Acuant/JavascriptWebSDKV11/releases) for release notes.
66

@@ -83,6 +83,11 @@ The SDK includes the following modules:
8383
- **AcuantJavaScriptSdk.min.js**
8484
- **AcuantCamera.min.js**
8585
- **AcuantPassiveLiveness.min.js**
86+
- **opencv.min.js**
87+
- **face_landmark_68_tiny_model-weights_manifest.json**
88+
- **face_landmark_68_tiny_model.bin**
89+
- **tiny_face_detector_model-shard1**
90+
- **tiny_face_detector_model-weights_manifest.json**
8691
- **AcuantInitializerWorker.min.js**
8792
- **AcuantInitializerServicejs**
8893
- **AcuantInitializerService.wasm**
@@ -92,14 +97,15 @@ The SDK includes the following modules:
9297
- **AcuantMetricsWorker.min.js**
9398
- **AcuantMetricsService.js**
9499
- **AcuantMetricsService.wasm**
95-
96100

97101
1. Load the main script files, excluding ones that will not be used:
98102

99103
<script src="AcuantJavascriptWebSdk.min.js"></script>
100104
<script async src="AcuantCamera.min.js"></script>
101105
<script async src="AcuantPassiveLiveness.min.js"></script>
106+
<script async src="opencv.min.js" charset="utf-8"></script>
102107
108+
**Note:** OpenCV is only needed for AcuantPassiveLiveness module.
103109

104110
1. Define a custom path to load files (if different than root):
105111

@@ -114,7 +120,7 @@ The SDK includes the following modules:
114120
//sdk has been loaded;
115121
}
116122
117-
**Note:** The SDK loads using a listener for DOMContentLoaded. If the scripts will be added to the page in a way that the listener won't be called (for example, in a single-page react application), once the SDK scripts are loaded in the page, manually call the following function:
123+
**Note:** The SDK loads using a listener for DOMContentLoaded. If the scripts will be added to the page in a way that the listener won't be called (for example, in a single-page react application), once the SDK scripts are loaded in the page, manually call the following function:
118124

119125
loadAcuantSdk();
120126

@@ -230,7 +236,7 @@ For other browsers that do not support WebRTC, the device's camera app (manual c
230236

231237
1. Add a viewport meta tag (if not already present) to prevent the video/ui from rendering at a much higher resolution than it needs to:
232238

233-
<meta name="viewport" content="width=device-width, initial-scale=1">
239+
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
234240

235241
1. Add HTML to show the live capture preview:
236242

@@ -248,23 +254,23 @@ For other browsers that do not support WebRTC, the device's camera app (manual c
248254
}
249255
};
250256

251-
1. Set up callback to retrieve the image at each state of the camera. For more information on the processed image returned via **onCropped**, see [Image from AcuantCameraUI and AcuantCamera](#image-from-acuantcameraui-and-acuantcamera).
257+
1. Set up callback to retrieve the image at each state of the camera. Be aware that cropping the image can fail and cause the **onCropped response to be undefined**. For more information on the processed image returned via **onCropped**, see [Image from AcuantCameraUI and AcuantCamera](#image-from-acuantcameraui-and-acuantcamera).
252258

253259
var cameraCallback = {
254-
onCaptured: function(response){
260+
onCaptured: function(response) {
255261
//document captured
256262
//this is not the final result of processed image
257263
//show a loading screen until onCropped is called
258264
},
259-
onCropped: function(response){
265+
onCropped: function(response) {
260266
if (response) {
261267
//use response
262268
} else {
263269
//cropping error
264270
//restart capture
265271
}
266272
},
267-
onFrameAvailable: function(response){
273+
onFrameAvailable: function(response) {
268274
//this is optional
269275
//Use only if you plan to display custom UI elements in addition to what is already displayed by the camera.
270276
response = {
@@ -319,20 +325,19 @@ If you are not using AcuantCamerUI, and you want to use your own live capture UI
319325

320326
**Note:** Launching Live Capture after a Live Capture error directs users to Manual Capture. For best practice, do not rely on this behavior, and send users to Manual Capture from within your implementation.
321327

322-
1. Start manual capture. For more information on the processed image returned via **onCropped**, see [Image from AcuantCameraUI and AcuantCamera](#image-from-acuantcameraui-and-acuantcamera).
328+
1. Start manual capture. Be aware that cropping the image can fail and cause the **onCropped response to be undefined**. For more information on the processed image returned via **onCropped**, see [Image from AcuantCameraUI and AcuantCamera](#image-from-acuantcameraui-and-acuantcamera).
323329

324330
AcuantCamera.startManualCapture({
325-
onCaptured: function(response){
331+
onCaptured: function(response) {
326332
//this will be called after user finishes capture
327333
//then proceeds to crop
328334
//onCropped will be called after finished
329335
},
330-
onCropped: function(response){
331-
if(response){
336+
onCropped: function(response) {
337+
if (response) {
332338
//cropped response;
333339

334-
}
335-
else{
340+
} else {
336341
//Error occurred during cropping; retry capture
337342
}
338343
}
@@ -461,7 +466,7 @@ This information is for processing images manually if they are not captured thro
461466

462467
**Prerequisite:** To use the face capture and FaceID API, credentials with FaceID must be enabled.
463468

464-
Acuant recommends using the **LiveAssessment** property rather than the score) to evaluate response. **AcuantPassiveLiveness.startSelfieCapture** will return a rescaled image.
469+
Acuant recommends using the **LiveAssessment** property rather than the score) to evaluate response. **AcuantPassiveLiveness.start** will return a rescaled image in onCaptured callback. The module supports real-time face detection only Android.
465470

466471
Follow these recommendations to effectively process an image for passive liveness:
467472
#### Image requirements
@@ -484,52 +489,108 @@ The following may significantly increase errors or false results:
484489
- A spotlight on the face and nearest surroundings
485490
- An environment with poor lighting or colored light
486491

487-
**Note**: Face live capture and guidance is not supported, only manual capture is available. Also, the use of fish-eye lenses is not supported by this API.
492+
**Note**: On iOS, real-time face detection is not supported, only manual capture is available. Also, the use of fish-eye lenses is not supported by this API.
488493

489494
### Start face capture and send Passive Liveness request
490495

491-
**Important:** Do not use this function for face capture if you are not using the Acuant FaceID API.
492-
493-
1. Start face capture with device's camera app.
494-
495-
AcuantPassiveLiveness.startSelfieCapture(callback:function(base64img){
496-
//called with result
497-
})
498-
499-
1. Upload face image and send request for Passive Liveness result.
500-
501-
AcuantPassiveLiveness.postLiveness({
502-
endpoint: "ACUANT_PASSIVE_LIVENESS_ENDPOINT",
503-
token: "ACUANT_PASSIVE_LIVENESS_TOKEN",
504-
subscriptionId: "ACUANT_PASSIVE_LIVENESS_SUBSCRIPTIONID",
505-
image: base64img
506-
}, function(result){
507-
result = {
508-
LivenessResult = {
509-
LivenessAssessment : String =
510-
//POSSIBLE VALUES
511-
"Live",
512-
"NotLive",
513-
"PoorQuality",
514-
"Error";
515-
Score: 0
516-
},
517-
Error: "",//error description
518-
ErrorCode: String =
496+
**Important:** Do not use this module for face capture if you are not using the Acuant FaceID API.
497+
498+
1. Add an HTML element to show face capture preview:
499+
500+
```
501+
<div id="acuant-face-capture-container"></div>
502+
```
503+
504+
1. Optionally, create custom detection texts:
505+
506+
```
507+
const faceDetectionStates = {
508+
FACE_NOT_FOUND: "FACE NOT FOUND",
509+
TOO_MANY_FACES: "TOO MANY FACES",
510+
FACE_ANGLE_TOO_LARGE: "FACE ANGLE TOO LARGE",
511+
PROBABILITY_TOO_SMALL: "PROBABILITY TOO SMALL",
512+
FACE_TOO_SMALL: "FACE TOO SMALL",
513+
FACE_CLOSE_TO_BORDER: "TOO CLOSE TO THE FRAME"
514+
}
515+
```
516+
517+
**Note:** The module does not provide the text UI element.
518+
519+
1. Set up callback:
520+
521+
```
522+
var faceCaptureCallback = {
523+
onDetection: (text) => {
524+
//Triggered when the face does not pass the scan. The UI element
525+
//should be updated here to provide guidence to the user
526+
},
527+
onOpened: () => {
528+
//Camera has opened
529+
},
530+
onClosed: () => {
531+
//Camera has closed
532+
},
533+
onError: (error) => {
534+
//Error occurred. Camera permission not granted will
535+
//manifest here with 1 as error code. Unexpected errors will have 2 as error code.
536+
},
537+
onPhotoTaken: () => {
538+
//The photo has been taken and it's showing a preview with a button to accept or retake the image.
539+
},
540+
onPhotoRetake: () => {
541+
//Triggered when retake button is tapped
542+
},
543+
onCaptured: (base64Image) => {
544+
//Triggered when accept button is tapped
545+
}
546+
}
547+
```
548+
**Note:** On iOS only onCaptured will be called.
549+
550+
1. Start face capture:
551+
552+
```
553+
AcuantPassiveLiveness.start(faceCaptureCallback, faceDetectionStates);
554+
```
555+
556+
**Note:** On iOS calling ```AcuantPassiveLiveness.start``` will launch the native camera. Alternatively, the module exposes ```startManualCapture``` method that launches the native camera and returns the image taken in base64.
557+
558+
1. Upload face image and send request for Passive Liveness result:
559+
560+
```
561+
AcuantPassiveLiveness.getLiveness({
562+
endpoint: "ACUANT_PASSIVE_LIVENESS_ENDPOINT",
563+
token: "ACUANT_PASSIVE_LIVENESS_TOKEN",
564+
subscriptionId: "ACUANT_PASSIVE_LIVENESS_SUBSCRIPTIONID",
565+
image: base64img
566+
}, (result) => {
567+
result = {
568+
LivenessResult = {
569+
LivenessAssessment : String =
570+
LivenessAssessment : String =
571+
LivenessAssessment : String =
519572
//POSSIBLE VALUES
520-
"Unknown",
521-
"FaceTooClose",
522-
"FaceNotFound",
523-
"FaceTooSmall",
524-
"FaceAngleTooLarge",
525-
"FailedToReadImage",
526-
"InvalidRequest",
527-
"InvalidRequestSettings",
528-
"Unauthorized",
529-
"NotFound"
530-
}
531-
})
532-
573+
"Live",
574+
"NotLive",
575+
"PoorQuality",
576+
"Error";
577+
Score: 0
578+
},
579+
Error: "",//error description
580+
ErrorCode: String =
581+
//POSSIBLE VALUES
582+
"Unknown",
583+
"FaceTooClose",
584+
"FaceNotFound",
585+
"FaceTooSmall",
586+
"FailedToReadImage",
587+
"InvalidRequest",
588+
"InvalidRequestSettings",
589+
"Unauthorized",
590+
"NotFound"
591+
}
592+
})
593+
```
533594

534595
----------
535596

0 commit comments

Comments
 (0)