Interfacing with the end-user's scanner from a webapp (web/scanner integration)

Question

Consider the following scanning procedure in a typical document handling webapp:

• The user scans a document using a scanner connected to his/her computer
• The scanned image is saved locally on the user's computer as a BMP/JPG/TIF/PNG file
• The user hits a file upload "Browse.." button in the web application
• The user is presented with a file dialog which he/she uses to locate the scanned image
• The user hits "Upload image" and the scanned image is uploaded to the server where it is stored

This process is quite complicated and I'd like to reduce the number of steps in order to make the process more user friendly/fool proof. Under ideal circumstances the above steps would be replaced with only one step in which the procedure initiate document scanning, complete document scanning and upload resulting image is automatically triggered from the webapp when clicking say "Scan and upload". Unfortunely it seems like the state of "web/scanner integration" is quite poor so this might be utopia.

How would you tackle this problem? More specifically, how would you go about reducing the number steps involve in the use-case described?

Answer 1

Well, two years have passed, so here's an update on the state of the art for those just joining us.

Both Dynamsoft and Atalasoft have multi-browser web-scanning toolkits which are compatible with any server-side stack. Both require the user to install an ActiveX (in IE) or an NPAPI plugin (Chrome, Firefox, etc.) to get access to the scanner via the TWAIN API.

Obviously if you have the time or a limited budget, you can create your own plugin. I heartily recommend the FireBreath plugin framework, and any TWAIN library rather than writing your own TWAIN code.

Once the ActiveX or plugin is installed, the rest of the work is a combination of javascript & HTML on the client, and some kind of handler on the server to accept and process the incoming image, which can be made to look just like a multipart form submit with an attached file.

I recommend doing the image upload in javascript using AJAX, because it is then part of the same browser 'session' as the web page, and it inherits the browser's proxy settings, session cookies and server-side authentication. I don't know about Dynamsoft's control, the Atalasoft toolkit includes such AJAX uploading. The image(s) are handed from the plugin to the javascript as a base64-encoded string, so no local file is actually created.

Disclaimer: I work on Atalasoft's WingScan web-scanning toolkit.