Dev Center
Table of contents

Thanks for Downloading Dynamic Web TWAIN 30-Day Trial!

Your download will start shortly. If your download does not begin, click here to retry.

Mobile Web Capture has been removed from Dynamic Web TWAIN as of Release 18.2. If you still require Mobile Web Capture, you must use the Plus edition of Dynamic Web TWAIN v18.1. Please contact support@dynamsoft.com for further details.

How to Enable Mobile Web Capture

You can follow the steps below to use Dynamic Web TWAIN SDK to enable image capture from mobile cameras in a web page.

Start a Web application

Create a mobile-capture.html and copy the Resources folder of Dynamic Web TWAIN, which can be found under the installation folder, to the same location.

Include the library

Embed the scripts of the library, among which dynamsoft.webtwain.addon.camera.js is the add-on module for mobile web capture.

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

Add an div element on the page for the library. dwtcontrolContainer is the default ID for the div. You can change it in the file dynamsoft.webtwain.config.js if necessary.

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

Add code for mobile web capture

The below code shows how to scan a document from scanners on desktop and invoke the camera module for mobile capture.

function AcquireImage() {
   if (DWObject) {
     if (Dynamsoft.Lib.env.bMobile) {
	   var showVideoConfigs = {
		scannerViewer:{
			autoDetect:{
				enableAutoDetect: true
			}
		},
		filterViewer: {
			exitDocumentScanAfterSave: true
		}
	    };
           
	    if(!DWObject.UseLocalService) {
        // invoke the camera module for mobile capture
		DWObject.Addon.Camera.scanDocument(showVideoConfigs).then(
			function(){
				console.log("OK");
			}, 
			function(error){
				console.log(error.message);
			});
	    } 
       }
       else {
            DWObject.SelectSource(
                function() {
                    DWObject.OpenSource();
                    DWObject.AcquireImage();
                },
                function() {
                    console.log("SelectSource failed!");
                });
       }
   }
}

See the mobile capture page in action

To try out the mobile web capture, please first deploy the web application as an HTTPS site so that it will get proper authentication to access the mobile cameras.

Try mobile capture demo

Here is a working mobile capture online demo which you can test.

Additional notes:

  1. By default, the size of the viewer is 270 in width and 350 in height, so it’ll appear to be too small. Check out how to customize the viewer for more information.

  2. Important: Not all mobile browsers allow the use of cameras. Check out browsers on mobile devices for more information. If you are using an unsupported browser (for example, Chrome on iOS), you may receive the error The current browser has not implemented the MediaDevices interface.

Is this page helpful?

YesYes NoNo

In this article:

latest version

    • Latest Version (18.4)
    • Version 18.3
    • Version 18.1
    • Version 18.0
    • Version 17.3
    • Version 17.2.1
    • Version 17.1.1
    • Version 17.0
    • Version 16.2
    • Version 16.1.1
    Change +