How to Create Web-Based Scanner Software

Last Updated on

Are you looking to create web-based scanner software to access scanners on client machines? If so, note that there is no way for a web page to directly access local resources on client machines. So, to make this happen, you can use a TWAIN plugin.

In this article, I’ll show you how to use Dynamsoft’s Dynamic Web TWAIN SDK to create a web-based scanner program allowing end-users to scan documents from a web page. Your users will be able to access the application from IE, Edge, Chrome, Firefox, and Safari on Windows, Linux, and Mac OS X machines.

Try basic scan online demo

web based scanner software

Developing a Simple Scan Page

You can follow the steps below to create a scan page to interact with scanners connected to client machines.

1. Install Dynamic Web TWAIN on your machine. You can download a 30-day free trial here.

2. Create an empty HTML page with the Resources folder.

Build-the-Hello-World-Scan-Page-2

3. Include the two Dynamsoft JS files in the <head> tag

<script src="Resources/dynamsoft.webtwain.initiate.js"></script>
<script src="Resources/dynamsoft.webtwain.config.js"></script>

4. Add Dynamic Web TWAIN container to the <body> tag

<div id="dwtcontrolContainer"></div>

5. Add a scan button to the page with the scan function

<input type="button" value="Scan" onclick="AcquireImage();" />
<script type="text/javascript">
    var DWObject;
    function Dynamsoft_OnReady() {
        DWObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer');
    }
    function AcquireImage() {
        if (DWObject) {
            DWObject.SelectSource(function () {
                DWObject.OpenSource();
                DWObject.AcquireImage();
            },
            function () {console.log("SelectSource failed!"); });
        }
    }
</script>

Now when you run the web page in a browser a user can click the “scan” button to see the connected scanner devices. They can choose one and scan documents. You can try our basic scan online demo to see how this works.

By following these steps you will have implemented a simple web scanner software for document scanning in HTML and JavaScript. If you want to save the images to a server, database, or document libraries, you can use the HTTP/HTTPS upload methods provided by Dynamic Web TWAIN. Also, use C#, VB.NET, PHP, JSP, etc. to receive the image data on the server-side.

Try the latest version of Dynamic Web TWAIN for Free. Contact us if you have any questions.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Subscribe Newsletter

Subscribe to our mailing list to get the monthly update.

Subscribename@email.com