Javascript Based Fingerprint Reader for Website Login, Web based attendance and etc.,

Reading fingerprints from scanners and manage them from the web page is a nightmare to developers. CAMS offers the end-to-end online SDK solutions to our clients who can use our SDK system to implement the web based fingerprint login, web based fingerprint attendance system and etc. Using our api, biometric fingerprint scanners or readers can be integrated with the web application through the simple javascript changes.

It just needs couple of mins to setup the client-server setup with establishing the communication to fingerprint scanner. Templates and additional information are transferred with 5 layer encryption protection which makes the data most secured and unbreakable to the intruders. More details are shared in the below documentation.

You can develop you server with any language such as JAVA/JSP, .Net, C++, NodeJs, and etc. Server language is not a parameter for enabling fingerprint reader from your website. All the operations are handled with simple HTML and Javascript.

Who wants to read this page?

This page is applicable for people who falls in the following requirements

  1. If you are looking for fingerprint scanner to read the fingerprint from your website
  2. If you are looking for fingerprint web site login
  3. If you are looking for fingerprint attendance system at your website

How to do the setup?

Once the fingerprint scanner is plugged into the USB drive, the respective driver will be installed automatically. Then a windows service to be installed which will be taking care of adding the security features to the fingerprint templates to avoid the eavesdropping. Then in client page, approximately 10 lines of JavaScript code to be included.

Now setup is ready, you can right way start using the fingerprint scanner and use it for your login page or attendance page or any other purposes.

How it works

The following diagram explains the functional components involved in the overall communication and their possible communication messages between components.
CAMS Web Based fingerprint scanner integration technical overview diagram

Client page (javascript) will have the configuration for setting up URLs and events for capturing new fingerprints and comparing fingerprints. Client page is responsible for calling the respective operations (Capture, Merge, Compare, CaptureAndVerify) whenever is required.

On the successful completion of any operation, the respective server URLs, if configured, will be called or the events to be triggered with its resulted data. Following are the operations and its result data.

  1. Capture - Encrypted fingerprint template, bmp base64 fingerprint image, encrypted capture time at client system, encrypted auth token
  2. Merge - Encrypted fingerprint template of given three fingerprint templates, encrypted merged time, encrypted auth token
  3. Compare - Encrypted score, encrypted comparison time, encrypted auth token
  4. CaptureAndVerify - Encrypted fingerprint template on success or decryption-failable random string, encrypted capture time at client system, encrypted auth token

Web API or Online SDK for fingerprint reader

HTML Page Change

In client html page, the following code should be included as the first script section in the head section.

<script src="[to-be-shared-privately]></script>

	fp.onCaptureSuccess = null;
	fp.captureReturnImage = false; // By default only template is captured, setting it to true returns BMP image along with template.

	fp.onMergeSuccessUrl = null;
	fp.onMergeSuccess = null;	// if onMergeSuccessUrl  is not set, the function assigned here will be triggered

	fp.onCompareSuccessUrl = null;
	fp.onCompareSuccess = null;	// if onCompareSuccessUrl  is not set, the function assigned here will be triggered

	fp.onCaptureAndVeifySuccessUrl = null;
	fp.onCaptureAndVeifySuccess = null;	// if onCaptureAndVeifySuccessUrl  is not set, the function assigned here will be triggered

	fp.onCaptureFailure = null;
	fp.onMergeFailure  = null;
	fp.onCompareFailure  = null;
	fp.onCaptureAndVeifyFailure  = null;

Operation: Capture

Call triggerCapture( sendImage ) which takes care of capturing the fingerprint templates and images. Once successful capture, it triggers the fp.onCaptureSuccess call. On failure, it triggers fp.onCaptureFailure. Sending true for sendImage will and capture the fingerprint image and pass into the onCaptureSuccess event.

A function as below to be written to handle the capture data and the same function name should be assigned to fp.onCaptureSuccess;

	function handleCapture(template, image)
		// template is the encrypted fingerprint template
		// image is base64 bmp image. You can use this data to display the fingerprint image on the browser


Operation: Merge

Call tiggerMerge( tmp1, tmpl2, tmpl3) which merges the three templates into one. On successful merge, the template will be passed to the URL configured in fp.onMergeSuccessURL. If it is null, then fp.onMergeSuccess event will be triggered.

A function as below can be written to handle the merge data and the same function name should be assigned to fp.onMergeSuccess. Note that this is an optional operation.

	function handleMerge(template)
		// template is the encrypted merged template of three fingerprint templates


Operation: Compare

Call tiggerCompare( tmp1, tmpl2) which compares the two templates and sends comparison score. The comparison value can be anything between 0 and 100. On successful comparison, the score will be passed to the URL configured in fp.onCompareSuccessURL. If it is null, then fp.onCompareSuccess event will be triggered.

A function as below can be written to handle the comparison result and the same function name should be assigned to fp.onCompareSuccess. Note that this is an optional operation.

	function handleCompare(score)
		// the comparison score will be between 0 and 100.


Operation: CaptureAndVerify

Call tiggerMerge( tmpl ) which captures new fingerprint, compares with the passed one and sends the response to fp.onCaptureAndVeifySuccessUrl. This operation shall be used for fingerprint login purposes. If onCaptureAndVeifySuccessUrl is null then fp.onCaptureAndVeifySuccess event will be triggered.

A function as below can be written to handle the merge data and the same function name should be assigned to fp.onCaptureAndVeifySuccess. Note that this is an optional operation.

	function handleMerge(score)
		// the score of the comparison of newly captured template and the passed one will coming between 0 and 100.



CAMS ensures that the complete system is highly secured and the data getting transferred are not breakable. It establishes the Industrial standard Trusted Path and Trusted Channel. Following are the few primary security aspects implemented in our system.

  1. All the data which includes fingerprint template, comparison score, success/failure status, auth token, operation time are fully encrypted by Advanced Encryption Standard (AES-256) algorithm
  2. All the operations sends the encrypted auth token and the operation time. This enables you to validate if the data is new or something manipulated with older data
  3. Communication between scanner handler and cams security server happens through HTTPS
  4. The data gets transferred between scanner handler and the cams security server are five layer encryption applied with (1) date are randomly bitwise rotated/altered, (2) rotated/altered data are encrypted with internal encryption algorithm and (3) and on top of the encrypted algorithm AES-256 encryption algorithm is applied. This ensures that data are impossible to break, (4) and (5) are confidential
  5. Clients are strongly recommended to implement your site with SSL. This ensures that eavesdropping becomes to complex
As we ensure various security measures are handled, the data are completely safe till it lands to your server.

Hardware - Fingerprint Scanner

CAMS ZK 7500 is recommended hardware for this project. Refer the specification at

web based fingerprint scanner


The fingerprint matching ratio is 1:1 at client level. The mathcing is done with fingerprint templates. We offer 1:N matching with server level which is a seperate feature from this suite. This matching shall be done with fingerprint images.

Supported Browser

All the browsers which supports HTML and Javascript shall be used. Since, all the browsers are supporting HTML and Javascript, No browser dependency for using this integration suite with your web application

Supported OS

The present version support all the versions of Windows OS which includes Windows XP, Windows Vista, Windows Server 2003, Windows Server 2008, Windows 7, Windows 8, Windows Server 2012, Windows 10, Windows Server 2016, and any latest windows OS

Video: How to Integrate Fingerprint Scanner with Website Through Javascript?

Cost Details

Various customization and the upgradation may be required from client to client. We list the cost of the common features that requires for every one.

The scanner license are yearly based. Every scanner is required a license which needs to be renewed every year. The windows service handler can be installed in multiple machines and as long as a scanner is having valid license, it can be connect to any no. of computers. It means, that license if scanner only. So, you can use one scanner to multiple computers one after one. The license expired scanner does not return the captured templates.

Service/Product USD INR
1 Scanner License 40/year 2,400/year
>10 Scanner License 30/scanner/year 1,800/scanner/year
>50 Scanner License 20/scanner/year 1,200/scanner/year
>100 Scanner License Please write to
Activation Charge
One time charge for a scanner
120 7000
Developer Support (Optional) 750 40000