Resources Base
This section introduces different ways to get data into the DWT
buffer.
Supported on desktop and only when
DWT
runs in service mode
A local scanner refers to a scanner that is plugged in the same desktop via USB or is available on the local network and is accessible on the local desktop. The latter is generally known as a network scanner. A network scanner is connected to the LAN itself (cable or WI-FI) and is assigned a static IP. The scanner driver from the device vendor then configures the IP to connect to the scanner.
As far as
DWT
is concerned, a network scanner is just like a local scanner because its driver has taken care of the network connection behind the scene.
A remote scanner refers to a scanner that is..
Windows
desktop on LAN (USB or network) where DWT
must be installedFor more information, check out how to enable remote scan.
A: DWT
provides two ways to set up a scan operation.
A: Check out Buffer Management
This feature is only available for TWAIN scanners.
A: Custom DataSource Data (CDD) is a feature provided by TWAIN and implemented by TWAIN sources (drivers). The idea is to save all TWAIN-related configurations in a file or a base64 string and use it later to restore the same configurations on the same device or a different device of the same model. This feature can be handy in cases like sharing the same configurations across multiple devices, or presetting a device for scanning. DWT
provides two pairs of methods to enable this feature, which are
The first pair saves or loads the data from a file, and the second from a base64 string.
The following shows how to use the second pair in JavaScript.
var cDD = "";
DWObject.SelectSource(function() {
DWObject.OpenSource();
DWObject.AcquireImage(function() {
cDD = DWObject.GetCustomDSDataEx();
}, function(code, error) {
console.log(error);
});
}, function(code, error) {
console.log(error);
});
DWObject.SelectSource(function() {
DWObject.IfShowUI = false;
DWObject.OpenSource();
DWObject.SetCustomDSDataEx(cDD);
DWObject.AcquireImage(function() {
console.log('Success');
}, function(code, error) {
console.log(error);
});
}, function(code, error) {
console.log(error);
});
This feature is only available for TWAIN scanners
A: Capability Negotiation is the way a TWAIN application communicates with a TWAIN source. This is how DWT
communicates with a scanner. The process looks something like this:
DWT
provides two methods, getCapabilities()
and setCapabilities()
, for negotiation. The following shows how to ask for supported page sizes and set it to A4 using Capability Negotiation.
DWObject.getCapabilities(function(result) {
for (var i = 0; i < result.length; i++) {
if (result[i].capability.value === Dynamsoft.EnumDWT_Cap.ICAP_SUPPORTEDSIZES)
sizes = result[i].values;
}
console.log(sizes);
}, function(error) {
console.log(error);
});
DWObject.setCapabilities({
exception: "ignore",
capabilities: [{
capability: Dynamsoft.EnumDWT_Cap.ICAP_SUPPORTEDSIZES,
curValue: 1, // 1 means 'A4' in our case
exception: "fail"
}]
},
function(result) {
console.log(result)
},
function(error) {
console.log(error);
}
);
A: The TWAIN specification defines more than 150 standard capabilities for TWAIN applications and sources to choose from. However, some scanner vendors provide advanced and model-specific capabilities which are not included in the specification. We call them custom capabilities. The following steps show how to use them:
Install the TWAIN Sample App.
Use the TWAIN Sample App to open the source and then check what the hexadecimal value of the custom capability is.
DWObject.SelectSource(function() {
DWObject.OpenSource();
DWObject.setCapabilities({
exception: "ignore",
capabilities: [{
capability: 0xA03D,
curValue: 3,
exception: "fail",
}]
},
function(capabilities) {
console.log(capabilities);
},
function(error) {
console.error(error);
});
},
function(code, error) {
console.log(error);
}
);
The following code snippet shows how to use a camera through DirectShow
.
function PlayVideo(bShow) {
if (DWObject) {
DWObject.Addon.Webcam.StopVideo();
DWObject.Addon.Webcam.SelectSource("CAMERA-NAME");
DWObject.Addon.Webcam.PlayVideo(DWObject, 80, function() {});
}
}
function CaptureImage() {
if (DWObject) {
DWObject.Addon.Webcam.SelectSource("CAMERA-NAME");
var funCaptureImage = function() {
setTimeout(function() {
DWObject.Addon.Webcam.StopVideo();
}, 50);
};
DWObject.Addon.Webcam.CaptureImage(funCaptureImage, funCaptureImage);
}
}
The following code snippet shows how to use a camera through MediaDevices
.
var videoPlaying = false;
function PlayVideo(bShow) {
if (videoPlaying) return;
if (DWObject) {
DWObject.Addon.Camera.stop();
videoPlaying = false;
// DEVICE-ID must be correct
// e.g.: "592bbc7c0f951657d8dc6dc3af8bdd76cde89b78184a8475f70eb012a4040a54"
DWObject.Addon.Camera.selectSource("DEVICE-ID");
.then(function() {
DWObject.Addon.Camera.play()
.then(function() {
videoPlaying = true;
}
);
}
);
}
}
function CaptureImage() {
if (DWObject) {
PlayVideo();
var startCapture = function() {
setTimeout(function() {
if (videoPlaying) {
DWObject.Addon.Camera.capture().then(function(blob) {
DWObject.Addon.Camera.stop();
videoPlaying = false;
});
} else {
startCapture();
}
}, 50);
};
startCapture();
}
}
Load in this context means to open files which are accessible on the file system. These files can reside on the local disk or shared on the network.
As a lightweight library,
DWT
only supports the following file types: BMP, JPG, TIF, PNG, and PDF. However, not all files of these types can be loaded correctly. Learn more here. If you come across a file that is of one of the supported file types but fails to load, please contact Dynamsoft Support.
Open File
dialog and select files to load.The Open File
dialog is only displayed on desktop. On mobile browsers, users are presented with the option to take a picture, use an existing image on the device, or open an existing file stored on the device.
var onSuccess = function() {
console.log("Loaded a file successfully!");
};
var onFailure = function(errorCode, errorString) {
console.log(errorString);
};
DWObject.IfShowFileDialog = true;
// PDF Rasterizer Addon is used here to ensure PDF support
DWObject.Addon.PDF.SetResolution(200);
DWObject.Addon.PDF.SetConvertMode(Dynamsoft.EnumDWT_ConvertMode.CM_RENDERALL);
DWObject.LoadImageEx("", Dynamsoft.EnumDWT_ImageType.IT_ALL, onSuccess, onFailure);
Supported on desktop and only when
DWT
runs in service mode.
var onSuccess = function() {
console.log("Loaded a file successfully!");
};
var onFailure = function(errorCode, errorString) {
console.log(errorString);
};
DWObject.IfShowFileDialog = false;
// PDF Addon is used here to ensure PDF support
DWObject.Addon.PDF.SetResolution(200);
DWObject.Addon.PDF.SetConvertMode(Dynamsoft.EnumDWT_ConvertMode.CM_RENDERALL);
/* "YOUR-FILE-PATH" - example path
* Windows:
* Local: "D:\\Files\\sample.pdf"
* LAN: "\\\\192.168.1.45\\sme\\sample.tif"
* macOS: "/Applications/Images/sample.pdf"
* Linux: "/home/userA/Files/sample.pdf"
*/
DWObject.LoadImage("YOUR-FILE-PATH", onSuccess, onFailure);
WebTwain
instanceOnly supported on desktop platform.
Download
is another type ofLoad
. The only difference between aDownload
with what’s written above is that the file to load needs to be transferred to the local device via the network first.DWT
takes care of the whole process and supports bothHTTP
andFTP
.
HTTP
or HTTPS
Supported on desktop and mobile platforms. For this option, a URL is used to fetch the file. The URL either specifies the path of the file itself or points to a server-side script that eventually returns a file. Check out the code snippets below demonstrating both scenarios.
/* The sample file path is:
* "http://localhost:300/files/sample.tif"
*/
var onSuccess = function() {
console.log("Downloaded a file successfully!");
};
var onFailure = function(errorCode, errorString) {
console.log(errorString);
};
DWObject.HTTPPort = 300;
DWObject.HTTPDownload("localhost", "/files/sample.tif", onSuccess, onFailure);
The method
HTTPDownloadEx
is used because the file type needs to be specified.
JavaScript
/* The sample file path is:
* "http://localhost:300/files/sample.tif"
*/
var onSuccess = function() {
console.log("Downloaded a file successfully!");
};
var onFailure = function(errorCode, errorString) {
console.log(errorString);
};
DWObject.HTTPPort = 300;
DWObject.HTTPDownloadEx("localhost", "/getFile.aspx", Dynamsoft.EnumDWT_ImageType.IT_TIF, onSuccess, onFailure);
Server-side script
The server-side script can be written in any language and in any logic as long as it returns a file.
<%@ Page Language="C#"%>
<%
try
{
String fileName = "sample.tif";
String filePath = Server.MapPath(".") + "\\files\\" + fileName;
System.IO.FileInfo fileInfo = new System.IO.FileInfo(filePath);
Response.ClearContent();
Response.ClearHeaders();
Response.Clear();
Response.Buffer = true;
String fileNameEncode;
fileNameEncode = HttpUtility.UrlEncode(fileName, System.Text.Encoding.UTF8);
fileNameEncode = fileNameEncode.Replace("+", "%20");
String appendedheader = "attachment;filename=" + fileNameEncode;
Response.AppendHeader("Content-Disposition", appendedheader);
Response.WriteFile(fileInfo.FullName);
}
catch (Exception)
{ }
%>
FTP
Supported on desktop platform.
The following code shows how to download a file from FTP.
/* The sample file path is:
* "ftp://192.168.8.20/files/sample.pdf"
*/
var onSuccess = function() {
console.log("Downloaded a file successfully!");
};
var onFailure = function(errorCode, errorString) {
console.log(errorString);
};
DWObject.FTPPort = 21;
DWObject.FTPUserName = "FTPUser";
DWObject.FTPPassword = "SomePassword";
DWObject.FTPDownloadEx("192.168.8.20", "/files/sample.pdf", Dynamsoft.EnumDWT_ImageType.IT_PDF, onSuccess, onFailure);
DWT
is capable of reading files in binary or base64 string format.
var onSuccess = function() {
console.log("Loaded a file successfully!");
};
var onFailure = function(errorCode, errorString) {
console.log(errorString);
};
/**
* The following function loads a binary/blob.
* The method ConvertToBlob() is used to create
* the Blob as an example but the actual Blob can
* come from anywhere.
*/
function loadFileFromBinary() {
if (DWObject) {
DWObject.ConvertToBlob(
[0],
Dynamsoft.EnumDWT_ImageType.IT_PDF,
function(result) {
DWObject.LoadImageFromBinary(
result, onSuccess, onFailure);
}, onFailure);
}
}
/**
* The following function loads a base64 string.
* The method ConvertToBase64() is used to create
* the string as an example but the string can
* come from anywhere.
* NOTE: the prefix such as "data:image/png;base64,"
* should NOT be included in the data to load.
*/
function loadFileFromBase64() {
if (DWObject) {
DWObject.ConvertToBase64(
[0],
Dynamsoft.EnumDWT_ImageType.IT_PDF,
function(result) {
DWObject.LoadImageFromBase64Binary(
result.getData(0, result.getLength()),
Dynamsoft.EnumDWT_ImageType.IT_PDF,
onSuccess, onFailure);
}, onFailure);
}
}
Supported on desktop and only when
DWT
runs in service mode.
DWObject.LoadDibFromClipboard()
Use the method SelectSourceByIndex()
to select a scanner by its index in the source list. In some cases, you may want to select a source by its name as shown in the example below.
var sources = DWObject.GetSourceNames();
sources.find(function(name, index) {
//"EPSON DS-530" is the name of the scanner
if (name === "EPSON DS-530")
DWObject.SelectSourceByIndex(index);
})
PageSize
DWObject.SelectSource(function() {
DWObject.OpenSource();
DWObject.IfShowUI = false;
DWObject.PageSize = Dynamsoft.EnumDWT_CapSupportedSizes.TWSS_USLEGAL;
DWObject.AcquireImage();
});
SetImageLayout
DWObject.SelectSource(function() {
DWObject.OpenSource();
DWObject.IfShowUI = false;
DWObject.Unit = EnumDWT_UnitType.TWUN_INCHES;
DWObject.SetImageLayout(0, 0, 5, 5);
DWObject.AcquireImage();
});
Dynamsoft Service
.Configure the Service by adding the following line to the file DSConfiguration.ini
.
Server=192.168.8.221
We are assuming the IP of this desktop is
192.168.8.221
and that the firewall will allow requests on the ports18622
and18623
. From v16.2, you can do the same on this page http://127.0.0.1:18625/admin/
Dynamsoft Service
in Windows services list and restart it.Create a WebTwain
instance to connect to that service and list all available scanners.
Learn more here
<select id="source"></select>
var host = "192.168.8.221", DWServiceObject;
function createDWTForScan(){
var dwtConfig = {
WebTwainId:"remoteScan",
Host: host,
Port: '18622',
PortSSL: '18623',
UseLocalService:'true'
};
Dynamsoft.WebTwainEnv.CreateDWTObjectEx(
dwtConfig,
function (dwt) {
DWServiceObject = dwt;
console.log('service connected!');
// List the available scanners
DWServiceObject.GetSourceNamesAsync().then(function(devices) {
for (var i = 0; i < devices.length; i++)
document.getElementById("source").options.add(new Option(devices[i], i));
},
function (error){
console.log(error)
}
);
},
function (error){
console.log(error)
}
);
}
Create another WebTwain
instance to show and process the scanned documents.
As the
WebTwain
instance created in the last step is interacting with a Dynamsoft Service running remotely, it’s recommended to only use it for scanning. Therefore, we create anotherWebTwain
instance that receives the scanned data for further processing.
<div id="dwtcontrolContainer"></div>
var DWObject;
Dynamsoft.WebTwainEnv.Containers = [{ContainerId: "dwtcontrolContainer", Width: "585px", Height: "513px"}];
Dynamsoft.WebTwainEnv.ProductKey = "YOUR-PRODUCT-KEY";
Dynamsoft.WebTwainEnv.UseLocalService = false; //Create the `WebTwain` instance in WASM mode as it doesn't need to scan documents
function Dynamsoft_OnReady() {
DWObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer');
}
Use the first WebTwain
instance, DWServiceObject
, to scan documents.
function AcquireImage(){
var OnAcquireImageSuccess, OnAcquireImageFailure = function () {
DWServiceObject.CloseSource();
};
var deviceConfiguration = {
SelectSourceByIndex: 0,
IfShowUI: true,
PixelType:Dynamsoft.EnumDWT_PixelType.TWPT_RGB,
Resolution: 300,
IfFeederEnabled: false,
IfDuplexEnabled: false,
IfDisableSourceAfterAcquire: true,
RemoteScan: true,
ShowRemoteScanUI: true
};
deviceConfiguration.SelectSourceByIndex = document.getElementById("source").selectedIndex;
DWServiceObject.AcquireImage(deviceConfiguration, OnAcquireImageSuccess, OnAcquireImageFailure);
}
We transfer the scanned documents to the second
WebTwain
instance,DWObject
, in the eventOnPostTransferAsync
.
DWServiceObject.RegisterEvent('OnPostTransferAsync', function(outputInfo){
DWServiceObject.ConvertToBlob(
[DWServiceObject.ImageIDToIndex(outputInfo.imageId)],
Dynamsoft.EnumDWT_ImageType.IT_PNG,
function (result, indices, type) {
DWObject.LoadImageFromBinary(
result,
function () {
console.log('LoadImageFromBinary success');
DWServiceObject.RemoveImage(DWServiceObject.ImageIDToIndex(outputInfo.imageId));
},
function (errorCode, errorString) {
console.log(errorString);
}
);
},
function (errorCode, errorString) {
console.log(errorString);
}
);
});
The following is the complete code, note that we are referencing the library from the CDN “unpkg” for simplicity.
<script type="text/javascript" src="https://unpkg.com/dwt@16.2.4/dist/dynamsoft.webtwain.min.js"></script>
<select id="source"></select>
<input type="button" value="Scan" onclick="AcquireImage();" />
<div id="dwtcontrolContainer"></div>
<script type="text/javascript">
var DWObject;
window.onload = function() {
Dynamsoft.WebTwainEnv.Containers = [{ContainerId: "dwtcontrolContainer", Width: "585px", Height: "513px"}];
Dynamsoft.WebTwainEnv.ProductKey = "YOUR_PRODUCT_KEY";
Dynamsoft.WebTwainEnv.UseLocalService = false; //Create the `WebTwain` instance in WASM mode as it doesn't need to scan documents
Dynamsoft.WebTwainEnv.ResourcesPath = "https://unpkg.com/dwt@16.2.4/dist";
Dynamsoft.WebTwainEnv.Load();
};
function Dynamsoft_OnReady() {
DWObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer');
createDWTForScan();
}
var host = "192.168.8.221", DWServiceObject;
function createDWTForScan(){
var dwtConfig = {
WebTwainId:"remoteScan",
Host: host,
Port: '18622',
PortSSL: '18623',
UseLocalService:'true'
};
Dynamsoft.WebTwainEnv.CreateDWTObjectEx(
dwtConfig,
function (dwt) {
DWServiceObject = dwt;
console.log('service connected!');
DWServiceObject.GetSourceNamesAsync().then(function(devices) {
for (var i = 0; i < devices.length; i++)
document.getElementById("source").options.add(new Option(devices[i], i));
},
function (error){
console.log(error)
}
);
DWServiceObject.RegisterEvent('OnPostTransferAsync', function(outputInfo){
DWServiceObject.ConvertToBlob(
[DWServiceObject.ImageIDToIndex(outputInfo.imageId)],
Dynamsoft.EnumDWT_ImageType.IT_PNG,
function (result, indices, type) {
DWObject.LoadImageFromBinary(
result,
function () {
console.log('LoadImageFromBinary success');
DWServiceObject.RemoveImage(DWServiceObject.ImageIDToIndex(outputInfo.imageId));
},
function (errorCode, errorString) {
console.log(errorString);
}
);
},
function (errorCode, errorString) {
console.log(errorString);
}
);
});
},
function (error){
console.log(error)
}
);
}
function AcquireImage(){
var OnAcquireImageSuccess, OnAcquireImageFailure = function () {
DWServiceObject.CloseSource();
};
var deviceConfiguration = {
SelectSourceByIndex: 0,
IfShowUI: true,
PixelType:Dynamsoft.EnumDWT_PixelType.TWPT_RGB,
Resolution: 300,
IfFeederEnabled: false,
IfDuplexEnabled: false,
IfDisableSourceAfterAcquire: true,
RemoteScan: true,
ShowRemoteScanUI: true
};
deviceConfiguration.SelectSourceByIndex = document.getElementById("source").selectedIndex;
DWServiceObject.AcquireImage(deviceConfiguration, OnAcquireImageSuccess, OnAcquireImageFailure);
}
</script>
latest version